rc-slider - npm Package Compare versions

Comparing version 8.7.1 to 9.0.0-alpha.0

es/Handle.js

@@ -96,3 +96,6 @@ import _extends from 'babel-runtime/helpers/extends';
           tabIndex = _props.tabIndex,
-          restProps = _objectWithoutProperties(_props, ['prefixCls', 'vertical', 'reverse', 'offset', 'style', 'disabled', 'min', 'max', 'value', 'tabIndex']);
+          ariaLabel = _props.ariaLabel,
+          ariaLabelledBy = _props.ariaLabelledBy,
+          ariaValueTextFormatter = _props.ariaValueTextFormatter,
+          restProps = _objectWithoutProperties(_props, ['prefixCls', 'vertical', 'reverse', 'offset', 'style', 'disabled', 'min', 'max', 'value', 'tabIndex', 'ariaLabel', 'ariaLabelledBy', 'ariaValueTextFormatter']);
 
@@ -108,2 +111,7 @@ var className = classNames(this.props.className, _defineProperty({}, prefixCls + '-handle-click-focused', this.state.clickFocused));
 
+      var ariaValueText = void 0;
+      if (ariaValueTextFormatter) {
+        ariaValueText = ariaValueTextFormatter(value);
+      }
+
       return React.createElement('div', _extends({
@@ -124,3 +132,6 @@ ref: this.setHandleRef,
         'aria-valuenow': value,
-        'aria-disabled': !!disabled
+        'aria-disabled': !!disabled,
+        'aria-label': ariaLabel,
+        'aria-labelledby': ariaLabelledBy,
+        'aria-valuetext': ariaValueText
       }));
@@ -147,3 +158,6 @@ }
   tabIndex: PropTypes.number,
-  reverse: PropTypes.bool
+  reverse: PropTypes.bool,
+  ariaLabel: PropTypes.string,
+  ariaLabelledBy: PropTypes.string,
+  ariaValueTextFormatter: PropTypes.func
 };

es/Range.js

@@ -12,3 +12,2 @@ import _defineProperty from 'babel-runtime/helpers/defineProperty';
 import classNames from 'classnames';
-import { polyfill } from 'react-lifecycles-compat';
 import shallowEqual from 'shallowequal';
@@ -427,3 +426,6 @@ import Track from './common/Track';
           handleStyle = _props4.handleStyle,
-          tabIndex = _props4.tabIndex;
+          tabIndex = _props4.tabIndex,
+          ariaLabelGroupForHandles = _props4.ariaLabelGroupForHandles,
+          ariaLabelledByGroupForHandles = _props4.ariaLabelledByGroupForHandles,
+          ariaValueTextFormatterGroupForHandles = _props4.ariaValueTextFormatterGroupForHandles;
 
@@ -459,3 +461,6 @@
             return _this4.saveHandle(i, h);
-          }
+          },
+          ariaLabel: ariaLabelGroupForHandles[i],
+          ariaLabelledBy: ariaLabelledByGroupForHandles[i],
+          ariaValueTextFormatter: ariaValueTextFormatterGroupForHandles[i]
         });
@@ -524,3 +529,6 @@ });
   min: PropTypes.number,
-  max: PropTypes.number
+  max: PropTypes.number,
+  ariaLabelGroupForHandles: PropTypes.arrayOf(PropTypes.string),
+  ariaLabelledByGroupForHandles: PropTypes.arrayOf(PropTypes.string),
+  ariaValueTextFormatterGroupForHandles: PropTypes.arrayOf(PropTypes.func)
 };
@@ -531,8 +539,9 @@ Range.defaultProps = {
   pushable: false,
-  tabIndex: []
+  tabIndex: [],
+  ariaLabelGroupForHandles: [],
+  ariaLabelledByGroupForHandles: [],
+  ariaValueTextFormatterGroupForHandles: []
 };
 
 
-polyfill(Range);
-
 export default createSlider(Range);

es/Slider.js

@@ -170,2 +170,5 @@ import _extends from 'babel-runtime/helpers/extends';
           tabIndex = _props3.tabIndex,
+          ariaLabelForHandle = _props3.ariaLabelForHandle,
+          ariaLabelledByForHandle = _props3.ariaLabelledByForHandle,
+          ariaValueTextFormatterForHandle = _props3.ariaValueTextFormatterForHandle,
           min = _props3.min,
@@ -193,2 +196,5 @@ max = _props3.max,
         tabIndex: tabIndex,
+        ariaLabel: ariaLabelForHandle,
+        ariaLabelledBy: ariaLabelledByForHandle,
+        ariaValueTextFormatter: ariaValueTextFormatterForHandle,
         style: handleStyle[0] || handleStyle,
@@ -226,3 +232,6 @@ ref: function ref(h) {
   min: PropTypes.number,
-  max: PropTypes.number
+  max: PropTypes.number,
+  ariaLabelForHandle: PropTypes.string,
+  ariaLabelledByForHandle: PropTypes.string,
+  ariaValueTextFormatterForHandle: PropTypes.func
 };
@@ -229,0 +238,0 @@

lib/Handle.js

@@ -136,3 +136,6 @@ 'use strict';
           tabIndex = _props.tabIndex,
-          restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'vertical', 'reverse', 'offset', 'style', 'disabled', 'min', 'max', 'value', 'tabIndex']);
+          ariaLabel = _props.ariaLabel,
+          ariaLabelledBy = _props.ariaLabelledBy,
+          ariaValueTextFormatter = _props.ariaValueTextFormatter,
+          restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'vertical', 'reverse', 'offset', 'style', 'disabled', 'min', 'max', 'value', 'tabIndex', 'ariaLabel', 'ariaLabelledBy', 'ariaValueTextFormatter']);
 
@@ -149,2 +152,7 @@
 
+      var ariaValueText = void 0;
+      if (ariaValueTextFormatter) {
+        ariaValueText = ariaValueTextFormatter(value);
+      }
+
       return _react2['default'].createElement('div', (0, _extends3['default'])({
@@ -165,3 +173,6 @@ ref: this.setHandleRef,
         'aria-valuenow': value,
-        'aria-disabled': !!disabled
+        'aria-disabled': !!disabled,
+        'aria-label': ariaLabel,
+        'aria-labelledby': ariaLabelledBy,
+        'aria-valuetext': ariaValueText
       }));
@@ -187,4 +198,7 @@ }
   tabIndex: _propTypes2['default'].number,
-  reverse: _propTypes2['default'].bool
+  reverse: _propTypes2['default'].bool,
+  ariaLabel: _propTypes2['default'].string,
+  ariaLabelledBy: _propTypes2['default'].string,
+  ariaValueTextFormatter: _propTypes2['default'].func
 };
 module.exports = exports['default'];

lib/Range.js

@@ -47,4 +47,2 @@ 'use strict';
 
-var _reactLifecyclesCompat = require('react-lifecycles-compat');
-
 var _shallowequal = require('shallowequal');
@@ -70,3 +68,2 @@
 
-/* eslint-disable react/prop-types */
 var _trimAlignValue = function _trimAlignValue(_ref) {
@@ -92,3 +89,3 @@ var value = _ref.value,
   return utils.ensureValuePrecision(valNotConflict, props);
-};
+}; /* eslint-disable react/prop-types */
 
@@ -481,3 +478,6 @@ var Range = function (_React$Component) {
           handleStyle = _props4.handleStyle,
-          tabIndex = _props4.tabIndex;
+          tabIndex = _props4.tabIndex,
+          ariaLabelGroupForHandles = _props4.ariaLabelGroupForHandles,
+          ariaLabelledByGroupForHandles = _props4.ariaLabelledByGroupForHandles,
+          ariaValueTextFormatterGroupForHandles = _props4.ariaValueTextFormatterGroupForHandles;
 
@@ -513,3 +513,6 @@
             return _this4.saveHandle(i, h);
-          }
+          },
+          ariaLabel: ariaLabelGroupForHandles[i],
+          ariaLabelledBy: ariaLabelledByGroupForHandles[i],
+          ariaValueTextFormatter: ariaValueTextFormatterGroupForHandles[i]
         });
@@ -577,3 +580,6 @@ });
   min: _propTypes2['default'].number,
-  max: _propTypes2['default'].number
+  max: _propTypes2['default'].number,
+  ariaLabelGroupForHandles: _propTypes2['default'].arrayOf(_propTypes2['default'].string),
+  ariaLabelledByGroupForHandles: _propTypes2['default'].arrayOf(_propTypes2['default'].string),
+  ariaValueTextFormatterGroupForHandles: _propTypes2['default'].arrayOf(_propTypes2['default'].func)
 };
@@ -584,9 +590,8 @@ Range.defaultProps = {
   pushable: false,
-  tabIndex: []
+  tabIndex: [],
+  ariaLabelGroupForHandles: [],
+  ariaLabelledByGroupForHandles: [],
+  ariaValueTextFormatterGroupForHandles: []
 };
-
-
-(0, _reactLifecyclesCompat.polyfill)(Range);
-
 exports['default'] = (0, _createSlider2['default'])(Range);
 module.exports = exports['default'];

lib/Slider.js

@@ -212,2 +212,5 @@ 'use strict';
           tabIndex = _props3.tabIndex,
+          ariaLabelForHandle = _props3.ariaLabelForHandle,
+          ariaLabelledByForHandle = _props3.ariaLabelledByForHandle,
+          ariaValueTextFormatterForHandle = _props3.ariaValueTextFormatterForHandle,
           min = _props3.min,
@@ -235,2 +238,5 @@ max = _props3.max,
         tabIndex: tabIndex,
+        ariaLabel: ariaLabelForHandle,
+        ariaLabelledBy: ariaLabelledByForHandle,
+        ariaValueTextFormatter: ariaValueTextFormatterForHandle,
         style: handleStyle[0] || handleStyle,
@@ -267,5 +273,8 @@ ref: function ref(h) {
   min: _propTypes2['default'].number,
-  max: _propTypes2['default'].number
+  max: _propTypes2['default'].number,
+  ariaLabelForHandle: _propTypes2['default'].string,
+  ariaLabelledByForHandle: _propTypes2['default'].string,
+  ariaValueTextFormatterForHandle: _propTypes2['default'].func
 };
 exports['default'] = (0, _createSlider2['default'])(Slider);
 module.exports = exports['default'];

package.json

 {
   "name": "rc-slider",
-  "version": "8.7.1",
+  "version": "9.0.0-alpha.0",
   "description": "Slider UI component for React",
@@ -85,5 +85,4 @@ "keywords": [
     "prop-types": "^15.5.4",
-    "rc-tooltip": "^3.7.0",
+    "rc-tooltip": "^4.0.0-alpha.3",
     "rc-util": "^4.0.4",
-    "react-lifecycles-compat": "^3.0.4",
     "shallowequal": "^1.1.0",
@@ -90,0 +89,0 @@ "warning": "^4.0.3"

README.md

@@ -128,2 +128,5 @@ # rc-slider
 | tabIndex | number | `0` | Set the tabIndex of the slider handle. |
+| ariaLabelForHandle | string | - | Set the `aria-label` attribute on the slider handle.  |
+| ariaLabelledByForHandle | string | - | Set the `aria-labelledby` attribute on the slider handle. |
+| ariaValueTextFormatterForHandle | (value) => string | - | A function to set the `aria-valuetext` attribute on the slider handle. It receives the current value of the slider and returns a formatted string describing the value. See [WAI-ARIA Authoring Practices 1.1](https://www.w3.org/TR/wai-aria-practices-1.1/#slider) for more information. |
 
@@ -137,2 +140,5 @@ ### Range
 | tabIndex | number[] | `[0, 0]` | Set the tabIndex of each handle. |
+| ariaLabelGroupForHandles | Array[string] | - | Set the `aria-label` attribute on each handle. |
+| ariaLabelledByGroupForHandles | Array[string] | - | Set the `aria-labelledby` attribute on each handle. |
+| ariaValueTextFormatterGroupForHandles | Array[(value) => string] | - | A function to set the `aria-valuetext` attribute on each handle. It receives the current value of the slider and returns a formatted string describing the value. See [WAI-ARIA Authoring Practices 1.1](https://www.w3.org/TR/wai-aria-practices-1.1/#slider) for more information. |
 | count | number | `1` | Determine how many ranges to render, and multiple handles will be rendered (number + 1). |
@@ -139,0 +145,0 @@ | allowCross | boolean | `true` | `allowCross` could be set as `true` to allow those handles to cross. |

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

1138673

increased by0.93%

Dependency count

7

decreased by-12.5%

Lines of code

13868

increased by0.69%

Number of lines in readme file

170

increased by3.66%

Worsened metrics

Number of low quality alerts

2

increased by100%

Dependency changes

• + Added@babel/runtime@7.26.0(transitive)

• + Addedrc-align@4.0.15(transitive)

• + Addedrc-motion@1.1.2(transitive)

• + Addedrc-tooltip@4.2.3(transitive)

• + Addedrc-trigger@4.4.3(transitive)

• + Addedrc-util@5.43.0(transitive)

• + Addedreact@16.14.018.3.1(transitive)

• + Addedreact-dom@16.14.018.3.1(transitive)

• + Addedreact-is@18.3.1(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)

• + Addedresize-observer-polyfill@1.5.1(transitive)

• + Addedscheduler@0.19.10.23.2(transitive)

• - Removedreact-lifecycles-compat@^3.0.4

• - Removedcomponent-classes@1.2.6(transitive)

• - Removedcomponent-indexof@0.0.3(transitive)

• - Removedcss-animation@1.6.1(transitive)

• - Removedrc-align@2.4.5(transitive)

• - Removedrc-animate@2.11.1(transitive)

• - Removedrc-tooltip@3.7.3(transitive)

• - Removedrc-trigger@2.6.5(transitive)

• Updatedrc-tooltip@^4.0.0-alpha.3