react-input-range
Advanced tools
Comparing version 0.2.0 to 0.2.2
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.InputRange = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){ | ||
(function (global){ | ||
'use strict'; | ||
@@ -32,3 +33,3 @@ | ||
var _react = require('react'); | ||
var _react = (typeof window !== "undefined" ? window['React'] : typeof global !== "undefined" ? global['React'] : null); | ||
@@ -414,3 +415,4 @@ var _react2 = _interopRequireDefault(_react); | ||
},{"InputRangePropType":2,"InputRangeSlider":3,"InputRangeTrack":4,"InputRangeUtil":5,"InputRangeValueTransformer":6,"react":"react"}],2:[function(require,module,exports){ | ||
}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) | ||
},{"InputRangePropType":2,"InputRangeSlider":3,"InputRangeTrack":4,"InputRangeUtil":5,"InputRangeValueTransformer":6}],2:[function(require,module,exports){ | ||
'use strict'; | ||
@@ -457,2 +459,3 @@ | ||
},{"InputRangeUtil":5}],3:[function(require,module,exports){ | ||
(function (global){ | ||
'use strict'; | ||
@@ -474,3 +477,3 @@ | ||
var _react = require('react'); | ||
var _react = (typeof window !== "undefined" ? window['React'] : typeof global !== "undefined" ? global['React'] : null); | ||
@@ -606,3 +609,5 @@ var _react2 = _interopRequireDefault(_react); | ||
},{"InputRangeUtil":5,"react":"react"}],4:[function(require,module,exports){ | ||
}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) | ||
},{"InputRangeUtil":5}],4:[function(require,module,exports){ | ||
(function (global){ | ||
'use strict'; | ||
@@ -624,3 +629,3 @@ | ||
var _react = require('react'); | ||
var _react = (typeof window !== "undefined" ? window['React'] : typeof global !== "undefined" ? global['React'] : null); | ||
@@ -720,3 +725,4 @@ var _react2 = _interopRequireDefault(_react); | ||
},{"InputRangeUtil":5,"react":"react"}],5:[function(require,module,exports){ | ||
}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) | ||
},{"InputRangeUtil":5}],5:[function(require,module,exports){ | ||
'use strict'; | ||
@@ -723,0 +729,0 @@ |
@@ -1,1 +0,1 @@ | ||
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.InputRange=e()}}(function(){return function e(t,n,a){function r(i,u){if(!n[i]){if(!t[i]){var s="function"==typeof require&&require;if(!u&&s)return s(i,!0);if(o)return o(i,!0);var l=new Error("Cannot find module '"+i+"'");throw l.code="MODULE_NOT_FOUND",l}var p=n[i]={exports:{}};t[i][0].call(p.exports,function(e){var n=t[i][1][e];return r(n?n:e)},p,p.exports,e,t,n,a)}return n[i].exports}for(var o="function"==typeof require&&require,i=0;i<a.length;i++)r(a[i]);return r}({1:[function(e,t,n){"use strict";function a(e){return e&&e.__esModule?e:{"default":e}}function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function u(e,t,n){return Math.abs(t-n)>=e.props.step}function s(e,t){return t===e.refs.inputRangeSliderMin?"min":"max"}function l(e,t){if(e.isMultiValue){var n=x.distanceTo(t,e.state.positions.min),a=x.distanceTo(t,e.state.positions.max);if(a>n)return"min"}return"max"}function p(e){return e.isMultiValue?["max","min"]:["max"]}Object.defineProperty(n,"__esModule",{value:!0});var c=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),f=function(e,t,n){for(var a=!0;a;){var r=e,o=t,i=n;u=l=s=void 0,a=!1,null===r&&(r=Function.prototype);var u=Object.getOwnPropertyDescriptor(r,o);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(r);if(null===l)return void 0;e=l,t=o,n=i,a=!0}},m=e("InputRangeSlider"),d=a(m),v=e("InputRangeTrack"),h=a(v),y=e("InputRangeValueTransformer"),b=a(y),g=e("react"),P=a(g),x=e("InputRangeUtil"),k=e("InputRangePropType"),w={LEFT_ARROW:37,RIGHT_ARROW:39},M=function(e){function t(e){o(this,t),f(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e);var n={percentages:{min:0,max:0},positions:{min:{x:0,y:0},max:{x:0,y:0}},values:{min:0,max:0}};this.state=n,this.valueTransformer=new b["default"](this),this.isMultiValue=this.props.hasOwnProperty("values"),x.autobind(["handleSliderMouseMove","handleSliderKeyDown","handleTrackMouseDown"],this)}return i(t,e),c(t,[{key:"componentDidMount",value:function(){this.setPositionsByProps(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setPositionsByProps(e)}},{key:"componentWillUpdate",value:function(){if(this.props.onChange){var e=this.state.values.max;this.isMultiValue&&(e=this.state.values),this.props.onChange(this,e)}}},{key:"setPositions",value:function(e){var t={min:this.valueTransformer.valueFromPosition(e.min),max:this.valueTransformer.valueFromPosition(e.max)},n={min:this.valueTransformer.stepValueFromValue(t.min),max:this.valueTransformer.stepValueFromValue(t.max)},a={min:this.valueTransformer.positionFromValue(n.min),max:this.valueTransformer.positionFromValue(n.max)},r={min:this.valueTransformer.percentageFromPosition(a.min),max:this.valueTransformer.percentageFromPosition(a.max)},o=u(this,n.min,this.state.values.min)||u(this,n.max,this.state.values.max),i=!this.isMultiValue||n.min<n.max,s=o&&i;if(s){var l={percentages:r,positions:a,values:n};this.setState(l)}}},{key:"setPosition",value:function(e,t){var n=e&&e.props.type||l(this,t),a=x.extend({},this.state.positions,r({},n,t));this.setPositions(a)}},{key:"setPositionByValue",value:function(e,t){var n=x.clamp(t,this.props.minValue,this.props.maxValue),a=this.valueTransformer.positionFromValue(n);this.setPosition(e,a)}},{key:"setPositionsByValues",value:function(e){var t={min:x.clamp(e.min,this.props.minValue,this.props.maxValue),max:x.clamp(e.max,this.props.minValue,this.props.maxValue)},n={min:this.valueTransformer.positionFromValue(t.min),max:this.valueTransformer.positionFromValue(t.max)};this.setPositions(n)}},{key:"setPositionsByProps",value:function(e){this.isMultiValue?this.setPositionsByValues(e.values):this.setPositionByValue(this.refs.inputRangeSliderMax,e.value)}},{key:"incrementValue",value:function(e){var t=s(this,e),n=this.state.values[t]+this.props.step;this.setPositionByValue(e,n)}},{key:"decrementValue",value:function(e){var t=s(this,e),n=this.state.values[t]-this.props.step;this.setPositionByValue(e,n)}},{key:"handleSliderMouseMove",value:function(e,t){var n=this.valueTransformer.positionFromEvent(t);this.setPosition(e,n)}},{key:"handleSliderKeyDown",value:function(e,t){switch(t.keyCode){case w.LEFT_ARROW:this.decrementValue(e);break;case w.RIGHT_ARROW:this.incrementValue(e)}}},{key:"handleTrackMouseDown",value:function(e,t){this.setPosition(null,t)}},{key:"renderSliders",value:function(){var e=[],t=p(this),n=!0,a=!1,r=void 0;try{for(var o,i=t[Symbol.iterator]();!(n=(o=i.next()).done);n=!0){var u=o.value,s=this.state.values[u],l=this.state.percentages[u],c="inputRangeSlider"+x.captialize(u),f=this.props,m=f.maxValue,v=f.minValue;"min"===u?m=this.state.values.max:v=this.state.values.min;var h=P["default"].createElement(d["default"],{key:u,maxValue:m,minValue:v,onSliderKeyDown:this.handleSliderKeyDown,onSliderMouseMove:this.handleSliderMouseMove,percentage:l,ref:c,type:u,value:s});e.push(h)}}catch(y){a=!0,r=y}finally{try{!n&&i["return"]&&i["return"]()}finally{if(a)throw r}}return e}},{key:"renderHiddenInputs",value:function(){var e=[],t=p(this),n=!0,a=!1,r=void 0;try{for(var o,i=t[Symbol.iterator]();!(n=(o=i.next()).done);n=!0){var u=o.value,s=this.isMultiValue?""+this.props.name+x.captialize(u):this.props.name;P["default"].createElement("input",{type:"hidden",name:s})}}catch(l){a=!0,r=l}finally{try{!n&&i["return"]&&i["return"]()}finally{if(a)throw r}}return e}},{key:"render",value:function(){return P["default"].createElement("div",{ref:"inputRange",className:"InputRange"},P["default"].createElement("span",{className:"InputRange-label InputRange-label--min"},P["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.minValue)),P["default"].createElement(h["default"],{ref:"inputRangeTrack",percentages:this.state.percentages,onTrackMouseDown:this.handleTrackMouseDown},this.renderSliders()),P["default"].createElement("span",{className:"InputRange-label InputRange-label--max"},P["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.maxValue)),this.renderHiddenInputs())}},{key:"trackClientRect",get:function(){var e=this.refs.inputRangeTrack;return e&&e.clientRect}}]),t}(P["default"].Component);M.propTypes={ariaLabelledby:P["default"].PropTypes.string,maxValue:k.maxMinValuePropType,minValue:k.maxMinValuePropType,name:P["default"].PropTypes.string,onChange:P["default"].PropTypes.func,step:P["default"].PropTypes.number,value:k.maxMinValuePropType,values:k.maxMinValuePropType},M.defaultProps={minValue:0,maxValue:10,value:0,step:1},n["default"]=M,t.exports=n["default"]},{InputRangePropType:2,InputRangeSlider:3,InputRangeTrack:4,InputRangeUtil:5,InputRangeValueTransformer:6,react:"react"}],2:[function(e,t,n){"use strict";function a(e){return"number"==typeof e}function r(e){var t=e.maxValue,n=e.minValue,r=e.value,i=e.values;return a(r)?r||o.objectOf(i,a)?n>=t?new Error("`minValue` must be smaller than `maxValue`"):n>=t?new Error("`maxValue` must be larger than `minValue`"):n>r||r>t?new Error("`value` must be within `minValue` and `maxValue`"):void 0:new Error("`values` must be an object of numbers"):new Error("`value` must be a number")}Object.defineProperty(n,"__esModule",{value:!0}),n.maxMinValuePropType=r;var o=e("InputRangeUtil")},{InputRangeUtil:5}],3:[function(e,t,n){"use strict";function a(e){return e&&e.__esModule?e:{"default":e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),u=function(e,t,n){for(var a=!0;a;){var r=e,o=t,i=n;u=l=s=void 0,a=!1,null===r&&(r=Function.prototype);var u=Object.getOwnPropertyDescriptor(r,o);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(r);if(null===l)return void 0;e=l,t=o,n=i,a=!0}},s=e("react"),l=a(s),p=e("InputRangeUtil"),c=function(e){function t(e){r(this,t),u(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={},p.autobind(["handleClick","handleMouseDown","handleMouseUp","handleMouseMove","handleKeyDown"],this)}return o(t,e),i(t,[{key:"componentDidMount",value:function(){this.setPosition(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setPosition(e)}},{key:"setPosition",value:function(e){var t=100*(e.percentage||0),n={position:"absolute",left:t+"%"},a=p.extend({},this.state.style,n);this.setState({style:a})}},{key:"handleMouseDown",value:function(){var e=this.document;e.addEventListener("mousemove",this.handleMouseMove),e.addEventListener("mouseup",this.handleMouseUp)}},{key:"handleMouseUp",value:function(){var e=this.document;e.removeEventListener("mousemove",this.handleMouseMove),e.removeEventListener("mouseup",this.handleMouseUp)}},{key:"handleClick",value:function(e){e.preventDefault()}},{key:"handleMouseMove",value:function(e){this.props.onSliderMouseMove(this,e)}},{key:"handleKeyDown",value:function(e){this.props.onSliderKeyDown(this,e)}},{key:"render",value:function(){var e=this.state.style||{};return l["default"].createElement("span",{className:"InputRange-sliderContainer",style:e},l["default"].createElement("span",{className:"InputRange-label InputRange-label--value"},l["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.value)),l["default"].createElement("a",{"aria-labelledby":this.props.ariaLabelledby,"aria-valuemax":this.props.maxValue,"aria-valuemin":this.props.minValue,"aria-valuenow":this.props.value,className:"InputRange-slider",draggable:"false",href:"#",onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseDown:this.handleMouseDown,role:"slider"}))}},{key:"document",get:function(){var e=l["default"].findDOMNode(this),t=e.ownerDocument;return t}}]),t}(l["default"].Component);c.propTypes={ariaLabelledby:l["default"].PropTypes.string,maxValue:l["default"].PropTypes.number,minValue:l["default"].PropTypes.number,onSliderKeyDown:l["default"].PropTypes.func.isRequired,onSliderMouseMove:l["default"].PropTypes.func.isRequired,percentage:l["default"].PropTypes.number.isRequired,type:l["default"].PropTypes.string.isRequired,value:l["default"].PropTypes.number.isRequired},n["default"]=c,t.exports=n["default"]},{InputRangeUtil:5,react:"react"}],4:[function(e,t,n){"use strict";function a(e){return e&&e.__esModule?e:{"default":e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),u=function(e,t,n){for(var a=!0;a;){var r=e,o=t,i=n;u=l=s=void 0,a=!1,null===r&&(r=Function.prototype);var u=Object.getOwnPropertyDescriptor(r,o);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(r);if(null===l)return void 0;e=l,t=o,n=i,a=!0}},s=e("react"),l=a(s),p=e("InputRangeUtil"),c=function(e){function t(e){r(this,t),u(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={},p.autobind(["handleMouseDown"],this)}return o(t,e),i(t,[{key:"componentDidMount",value:function(){this.setActiveTrackWidth(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setActiveTrackWidth(e)}},{key:"setActiveTrackWidth",value:function(e){var t=100*(e.percentages.max-e.percentages.min)+"%",n=100*e.percentages.min+"%",a={left:n,width:t},r=p.extend({},this.state.activeTrackStyle,a);this.setState({activeTrackStyle:r})}},{key:"handleMouseDown",value:function(e){var t=this.clientRect,n=e.clientX,a={x:n-t.left,y:0};this.props.onTrackMouseDown(this,a)}},{key:"render",value:function(){var e=this.state.activeTrackStyle||{};return l["default"].createElement("div",{onMouseDown:this.handleMouseDown,className:"InputRange-track InputRange-track--container"},l["default"].createElement("div",{style:e,className:"InputRange-track InputRange-track--active"}),this.props.children)}},{key:"clientRect",get:function(){var e=l["default"].findDOMNode(this),t=e.getClientRects()[0];return t}}]),t}(l["default"].Component);c.propTypes={children:l["default"].PropTypes.node,onTrackMouseDown:l["default"].PropTypes.func.isRequired,percentages:l["default"].PropTypes.objectOf(l["default"].PropTypes.number).isRequired},n["default"]=c,t.exports=n["default"]},{InputRangeUtil:5,react:"react"}],5:[function(e,t,n){"use strict";function a(e,t,n){return Math.min(Math.max(e,t),n)}function r(e){var t=Array.prototype.slice.call(arguments,1);return t.forEach(function(t){if(t){var n=Object.keys(t);n.forEach(function(n){e[n]=t[n]})}}),e}function o(){return r.apply(Object,arguments)}function i(e){return e.charAt(0).toUpperCase()+e.slice(1)}function u(e,t){return Math.sqrt(Math.pow(t.x-e.x,2)+Math.pow(t.y-e.y,2))}function s(e){return"number"==typeof e}function l(e,t){if(!Array.isArray(e))return!1;for(var n=0,a=e.length;a>n;n++)if(!t(e[n]))return!1;return!0}function p(e,t,n){if("object"!=typeof e)return!1;for(var a=n||Object.keys(e),r=0,o=a.length;o>r;r++){var i=a[r];if(!t(e[i]))return!1}return!0}function c(e,t){e.forEach(function(e){t[e]=t[e].bind(t)})}Object.defineProperty(n,"__esModule",{value:!0});var f={arrayOf:l,autobind:c,captialize:i,clamp:a,distanceTo:u,extend:o,isNumber:s,objectOf:p};n["default"]=f,t.exports=n["default"]},{}],6:[function(e,t,n){"use strict";function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(n,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),o=e("InputRangeUtil"),i=function(){function e(t){a(this,e),this.component=t}return r(e,[{key:"valueFromPosition",value:function(e){var t=this.percentageFromPosition(e),n=this.component.props.maxValue-this.component.props.minValue,a=this.component.props.minValue+n*t;return a}},{key:"positionFromValue",value:function(e){var t=this.component.trackClientRect.width,n=this.percentageFromValue(e),a=n*t;return{x:a,y:0}}},{key:"positionFromEvent",value:function(e){var t=this.component.trackClientRect,n=t.width,a={x:o.clamp(e.clientX-t.left,0,n),y:0};return a}},{key:"percentageFromPosition",value:function(e){var t=this.component.trackClientRect.width,n=e.x/t;return n||0}},{key:"percentageFromValue",value:function(e){var t=o.clamp(e,this.component.props.minValue,this.component.props.maxValue),n=this.component.props.maxValue-this.component.props.minValue,a=(t-this.component.props.minValue)/n;return a||0}},{key:"stepValueFromValue",value:function(e){return Math.round(e/this.component.props.step)*this.component.props.step}}]),e}();n["default"]=i,t.exports=n["default"]},{InputRangeUtil:5}]},{},[1])(1)}); | ||
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.InputRange=e()}}(function(){return function e(t,n,a){function o(i,u){if(!n[i]){if(!t[i]){var s="function"==typeof require&&require;if(!u&&s)return s(i,!0);if(r)return r(i,!0);var l=new Error("Cannot find module '"+i+"'");throw l.code="MODULE_NOT_FOUND",l}var p=n[i]={exports:{}};t[i][0].call(p.exports,function(e){var n=t[i][1][e];return o(n?n:e)},p,p.exports,e,t,n,a)}return n[i].exports}for(var r="function"==typeof require&&require,i=0;i<a.length;i++)o(a[i]);return o}({1:[function(e,t,n){(function(a){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}function s(e,t,n){return Math.abs(t-n)>=e.props.step}function l(e,t){return t===e.refs.inputRangeSliderMin?"min":"max"}function p(e,t){if(e.isMultiValue){var n=x.distanceTo(t,e.state.positions.min),a=x.distanceTo(t,e.state.positions.max);if(a>n)return"min"}return"max"}function c(e){return e.isMultiValue?["max","min"]:["max"]}Object.defineProperty(n,"__esModule",{value:!0});var f=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),d=function(e,t,n){for(var a=!0;a;){var o=e,r=t,i=n;u=l=s=void 0,a=!1,null===o&&(o=Function.prototype);var u=Object.getOwnPropertyDescriptor(o,r);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(o);if(null===l)return void 0;e=l,t=r,n=i,a=!0}},m=e("InputRangeSlider"),h=o(m),v=e("InputRangeTrack"),y=o(v),b=e("InputRangeValueTransformer"),g=o(b),w="undefined"!=typeof window?window.React:"undefined"!=typeof a?a.React:null,P=o(w),x=e("InputRangeUtil"),k=e("InputRangePropType"),R={LEFT_ARROW:37,RIGHT_ARROW:39},M=function(e){function t(e){i(this,t),d(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e);var n={percentages:{min:0,max:0},positions:{min:{x:0,y:0},max:{x:0,y:0}},values:{min:0,max:0}};this.state=n,this.valueTransformer=new g["default"](this),this.isMultiValue=this.props.hasOwnProperty("values"),x.autobind(["handleSliderMouseMove","handleSliderKeyDown","handleTrackMouseDown"],this)}return u(t,e),f(t,[{key:"componentDidMount",value:function(){this.setPositionsByProps(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setPositionsByProps(e)}},{key:"componentWillUpdate",value:function(){if(this.props.onChange){var e=this.state.values.max;this.isMultiValue&&(e=this.state.values),this.props.onChange(this,e)}}},{key:"setPositions",value:function(e){var t={min:this.valueTransformer.valueFromPosition(e.min),max:this.valueTransformer.valueFromPosition(e.max)},n={min:this.valueTransformer.stepValueFromValue(t.min),max:this.valueTransformer.stepValueFromValue(t.max)},a={min:this.valueTransformer.positionFromValue(n.min),max:this.valueTransformer.positionFromValue(n.max)},o={min:this.valueTransformer.percentageFromPosition(a.min),max:this.valueTransformer.percentageFromPosition(a.max)},r=s(this,n.min,this.state.values.min)||s(this,n.max,this.state.values.max),i=!this.isMultiValue||n.min<n.max,u=r&&i;if(u){var l={percentages:o,positions:a,values:n};this.setState(l)}}},{key:"setPosition",value:function(e,t){var n=e&&e.props.type||p(this,t),a=x.extend({},this.state.positions,r({},n,t));this.setPositions(a)}},{key:"setPositionByValue",value:function(e,t){var n=x.clamp(t,this.props.minValue,this.props.maxValue),a=this.valueTransformer.positionFromValue(n);this.setPosition(e,a)}},{key:"setPositionsByValues",value:function(e){var t={min:x.clamp(e.min,this.props.minValue,this.props.maxValue),max:x.clamp(e.max,this.props.minValue,this.props.maxValue)},n={min:this.valueTransformer.positionFromValue(t.min),max:this.valueTransformer.positionFromValue(t.max)};this.setPositions(n)}},{key:"setPositionsByProps",value:function(e){this.isMultiValue?this.setPositionsByValues(e.values):this.setPositionByValue(this.refs.inputRangeSliderMax,e.value)}},{key:"incrementValue",value:function(e){var t=l(this,e),n=this.state.values[t]+this.props.step;this.setPositionByValue(e,n)}},{key:"decrementValue",value:function(e){var t=l(this,e),n=this.state.values[t]-this.props.step;this.setPositionByValue(e,n)}},{key:"handleSliderMouseMove",value:function(e,t){var n=this.valueTransformer.positionFromEvent(t);this.setPosition(e,n)}},{key:"handleSliderKeyDown",value:function(e,t){switch(t.keyCode){case R.LEFT_ARROW:this.decrementValue(e);break;case R.RIGHT_ARROW:this.incrementValue(e)}}},{key:"handleTrackMouseDown",value:function(e,t){this.setPosition(null,t)}},{key:"renderSliders",value:function(){var e=[],t=c(this),n=!0,a=!1,o=void 0;try{for(var r,i=t[Symbol.iterator]();!(n=(r=i.next()).done);n=!0){var u=r.value,s=this.state.values[u],l=this.state.percentages[u],p="inputRangeSlider"+x.captialize(u),f=this.props,d=f.maxValue,m=f.minValue;"min"===u?d=this.state.values.max:m=this.state.values.min;var v=P["default"].createElement(h["default"],{key:u,maxValue:d,minValue:m,onSliderKeyDown:this.handleSliderKeyDown,onSliderMouseMove:this.handleSliderMouseMove,percentage:l,ref:p,type:u,value:s});e.push(v)}}catch(y){a=!0,o=y}finally{try{!n&&i["return"]&&i["return"]()}finally{if(a)throw o}}return e}},{key:"renderHiddenInputs",value:function(){var e=[],t=c(this),n=!0,a=!1,o=void 0;try{for(var r,i=t[Symbol.iterator]();!(n=(r=i.next()).done);n=!0){var u=r.value,s=this.isMultiValue?""+this.props.name+x.captialize(u):this.props.name;P["default"].createElement("input",{type:"hidden",name:s})}}catch(l){a=!0,o=l}finally{try{!n&&i["return"]&&i["return"]()}finally{if(a)throw o}}return e}},{key:"render",value:function(){return P["default"].createElement("div",{ref:"inputRange",className:"InputRange"},P["default"].createElement("span",{className:"InputRange-label InputRange-label--min"},P["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.minValue)),P["default"].createElement(y["default"],{ref:"inputRangeTrack",percentages:this.state.percentages,onTrackMouseDown:this.handleTrackMouseDown},this.renderSliders()),P["default"].createElement("span",{className:"InputRange-label InputRange-label--max"},P["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.maxValue)),this.renderHiddenInputs())}},{key:"trackClientRect",get:function(){var e=this.refs.inputRangeTrack;return e&&e.clientRect}}]),t}(P["default"].Component);M.propTypes={ariaLabelledby:P["default"].PropTypes.string,maxValue:k.maxMinValuePropType,minValue:k.maxMinValuePropType,name:P["default"].PropTypes.string,onChange:P["default"].PropTypes.func,step:P["default"].PropTypes.number,value:k.maxMinValuePropType,values:k.maxMinValuePropType},M.defaultProps={minValue:0,maxValue:10,value:0,step:1},n["default"]=M,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{InputRangePropType:2,InputRangeSlider:3,InputRangeTrack:4,InputRangeUtil:5,InputRangeValueTransformer:6}],2:[function(e,t,n){"use strict";function a(e){return"number"==typeof e}function o(e){var t=e.maxValue,n=e.minValue,o=e.value,i=e.values;return a(o)?o||r.objectOf(i,a)?n>=t?new Error("`minValue` must be smaller than `maxValue`"):n>=t?new Error("`maxValue` must be larger than `minValue`"):n>o||o>t?new Error("`value` must be within `minValue` and `maxValue`"):void 0:new Error("`values` must be an object of numbers"):new Error("`value` must be a number")}Object.defineProperty(n,"__esModule",{value:!0}),n.maxMinValuePropType=o;var r=e("InputRangeUtil")},{InputRangeUtil:5}],3:[function(e,t,n){(function(a){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var u=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),s=function(e,t,n){for(var a=!0;a;){var o=e,r=t,i=n;u=l=s=void 0,a=!1,null===o&&(o=Function.prototype);var u=Object.getOwnPropertyDescriptor(o,r);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(o);if(null===l)return void 0;e=l,t=r,n=i,a=!0}},l="undefined"!=typeof window?window.React:"undefined"!=typeof a?a.React:null,p=o(l),c=e("InputRangeUtil"),f=function(e){function t(e){r(this,t),s(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={},c.autobind(["handleClick","handleMouseDown","handleMouseUp","handleMouseMove","handleKeyDown"],this)}return i(t,e),u(t,[{key:"componentDidMount",value:function(){this.setPosition(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setPosition(e)}},{key:"setPosition",value:function(e){var t=100*(e.percentage||0),n={position:"absolute",left:t+"%"},a=c.extend({},this.state.style,n);this.setState({style:a})}},{key:"handleMouseDown",value:function(){var e=this.document;e.addEventListener("mousemove",this.handleMouseMove),e.addEventListener("mouseup",this.handleMouseUp)}},{key:"handleMouseUp",value:function(){var e=this.document;e.removeEventListener("mousemove",this.handleMouseMove),e.removeEventListener("mouseup",this.handleMouseUp)}},{key:"handleClick",value:function(e){e.preventDefault()}},{key:"handleMouseMove",value:function(e){this.props.onSliderMouseMove(this,e)}},{key:"handleKeyDown",value:function(e){this.props.onSliderKeyDown(this,e)}},{key:"render",value:function(){var e=this.state.style||{};return p["default"].createElement("span",{className:"InputRange-sliderContainer",style:e},p["default"].createElement("span",{className:"InputRange-label InputRange-label--value"},p["default"].createElement("span",{className:"InputRange-labelContainer"},this.props.value)),p["default"].createElement("a",{"aria-labelledby":this.props.ariaLabelledby,"aria-valuemax":this.props.maxValue,"aria-valuemin":this.props.minValue,"aria-valuenow":this.props.value,className:"InputRange-slider",draggable:"false",href:"#",onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseDown:this.handleMouseDown,role:"slider"}))}},{key:"document",get:function(){var e=p["default"].findDOMNode(this),t=e.ownerDocument;return t}}]),t}(p["default"].Component);f.propTypes={ariaLabelledby:p["default"].PropTypes.string,maxValue:p["default"].PropTypes.number,minValue:p["default"].PropTypes.number,onSliderKeyDown:p["default"].PropTypes.func.isRequired,onSliderMouseMove:p["default"].PropTypes.func.isRequired,percentage:p["default"].PropTypes.number.isRequired,type:p["default"].PropTypes.string.isRequired,value:p["default"].PropTypes.number.isRequired},n["default"]=f,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{InputRangeUtil:5}],4:[function(e,t,n){(function(a){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(n,"__esModule",{value:!0});var u=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),s=function(e,t,n){for(var a=!0;a;){var o=e,r=t,i=n;u=l=s=void 0,a=!1,null===o&&(o=Function.prototype);var u=Object.getOwnPropertyDescriptor(o,r);if(void 0!==u){if("value"in u)return u.value;var s=u.get;return void 0===s?void 0:s.call(i)}var l=Object.getPrototypeOf(o);if(null===l)return void 0;e=l,t=r,n=i,a=!0}},l="undefined"!=typeof window?window.React:"undefined"!=typeof a?a.React:null,p=o(l),c=e("InputRangeUtil"),f=function(e){function t(e){r(this,t),s(Object.getPrototypeOf(t.prototype),"constructor",this).call(this,e),this.state={},c.autobind(["handleMouseDown"],this)}return i(t,e),u(t,[{key:"componentDidMount",value:function(){this.setActiveTrackWidth(this.props)}},{key:"componentWillReceiveProps",value:function(e){this.setActiveTrackWidth(e)}},{key:"setActiveTrackWidth",value:function(e){var t=100*(e.percentages.max-e.percentages.min)+"%",n=100*e.percentages.min+"%",a={left:n,width:t},o=c.extend({},this.state.activeTrackStyle,a);this.setState({activeTrackStyle:o})}},{key:"handleMouseDown",value:function(e){var t=this.clientRect,n=e.clientX,a={x:n-t.left,y:0};this.props.onTrackMouseDown(this,a)}},{key:"render",value:function(){var e=this.state.activeTrackStyle||{};return p["default"].createElement("div",{onMouseDown:this.handleMouseDown,className:"InputRange-track InputRange-track--container"},p["default"].createElement("div",{style:e,className:"InputRange-track InputRange-track--active"}),this.props.children)}},{key:"clientRect",get:function(){var e=p["default"].findDOMNode(this),t=e.getClientRects()[0];return t}}]),t}(p["default"].Component);f.propTypes={children:p["default"].PropTypes.node,onTrackMouseDown:p["default"].PropTypes.func.isRequired,percentages:p["default"].PropTypes.objectOf(p["default"].PropTypes.number).isRequired},n["default"]=f,t.exports=n["default"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{InputRangeUtil:5}],5:[function(e,t,n){"use strict";function a(e,t,n){return Math.min(Math.max(e,t),n)}function o(e){var t=Array.prototype.slice.call(arguments,1);return t.forEach(function(t){if(t){var n=Object.keys(t);n.forEach(function(n){e[n]=t[n]})}}),e}function r(){return o.apply(Object,arguments)}function i(e){return e.charAt(0).toUpperCase()+e.slice(1)}function u(e,t){return Math.sqrt(Math.pow(t.x-e.x,2)+Math.pow(t.y-e.y,2))}function s(e){return"number"==typeof e}function l(e,t){if(!Array.isArray(e))return!1;for(var n=0,a=e.length;a>n;n++)if(!t(e[n]))return!1;return!0}function p(e,t,n){if("object"!=typeof e)return!1;for(var a=n||Object.keys(e),o=0,r=a.length;r>o;o++){var i=a[o];if(!t(e[i]))return!1}return!0}function c(e,t){e.forEach(function(e){t[e]=t[e].bind(t)})}Object.defineProperty(n,"__esModule",{value:!0});var f={arrayOf:l,autobind:c,captialize:i,clamp:a,distanceTo:u,extend:r,isNumber:s,objectOf:p};n["default"]=f,t.exports=n["default"]},{}],6:[function(e,t,n){"use strict";function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(n,"__esModule",{value:!0});var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),r=e("InputRangeUtil"),i=function(){function e(t){a(this,e),this.component=t}return o(e,[{key:"valueFromPosition",value:function(e){var t=this.percentageFromPosition(e),n=this.component.props.maxValue-this.component.props.minValue,a=this.component.props.minValue+n*t;return a}},{key:"positionFromValue",value:function(e){var t=this.component.trackClientRect.width,n=this.percentageFromValue(e),a=n*t;return{x:a,y:0}}},{key:"positionFromEvent",value:function(e){var t=this.component.trackClientRect,n=t.width,a={x:r.clamp(e.clientX-t.left,0,n),y:0};return a}},{key:"percentageFromPosition",value:function(e){var t=this.component.trackClientRect.width,n=e.x/t;return n||0}},{key:"percentageFromValue",value:function(e){var t=r.clamp(e,this.component.props.minValue,this.component.props.maxValue),n=this.component.props.maxValue-this.component.props.minValue,a=(t-this.component.props.minValue)/n;return a||0}},{key:"stepValueFromValue",value:function(e){return Math.round(e/this.component.props.step)*this.component.props.step}}]),e}();n["default"]=i,t.exports=n["default"]},{InputRangeUtil:5}]},{},[1])(1)}); |
{ | ||
"name": "react-input-range", | ||
"version": "0.2.0", | ||
"version": "0.2.2", | ||
"description": "React component for inputting numeric values within a range", | ||
@@ -28,2 +28,3 @@ "keywords": [ | ||
"browserify": "^11.0.0", | ||
"browserify-shim": "^3.8.10", | ||
"del": "^1.2.0", | ||
@@ -67,2 +68,10 @@ "eslint": "^1.0.0", | ||
}, | ||
"browserify": { | ||
"transform": [ | ||
"browserify-shim" | ||
] | ||
}, | ||
"browserify-shim": { | ||
"react": "global:React" | ||
}, | ||
"files": [ | ||
@@ -69,0 +78,0 @@ "dist/", |
@@ -5,2 +5,5 @@ # react-input-range | ||
## Demo | ||
A CodePen demo is available [here](http://codepen.io/davidchin/full/GpNvqw/). | ||
## Installation | ||
@@ -7,0 +10,0 @@ |
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
57599
813
62
40