react-switch
Advanced tools
Comparing version 3.0.3 to 3.0.4
@@ -1,3 +0,3 @@ | ||
import React, { Component } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
var React = require('react'); | ||
var PropTypes = require('prop-types'); | ||
@@ -120,5 +120,5 @@ /* | ||
var ReactSwitch = (function (Component$$1) { | ||
var ReactSwitch = (function (Component) { | ||
function ReactSwitch(props) { | ||
Component$$1.call(this, props); | ||
Component.call(this, props); | ||
var height = props.height; | ||
@@ -151,4 +151,4 @@ var width = props.width; | ||
if ( Component$$1 ) ReactSwitch.__proto__ = Component$$1; | ||
ReactSwitch.prototype = Object.create( Component$$1 && Component$$1.prototype ); | ||
if ( Component ) ReactSwitch.__proto__ = Component; | ||
ReactSwitch.prototype = Object.create( Component && Component.prototype ); | ||
ReactSwitch.prototype.constructor = ReactSwitch; | ||
@@ -423,3 +423,3 @@ | ||
return ReactSwitch; | ||
}(Component)); | ||
}(React.Component)); | ||
ReactSwitch.propTypes = { | ||
@@ -460,2 +460,2 @@ checked: PropTypes.bool.isRequired, | ||
export default ReactSwitch; | ||
module.exports = ReactSwitch; |
@@ -1,1 +0,1 @@ | ||
var React=require("react"),PropTypes=require("prop-types"),uncheckedIcon=React.createElement("svg",{viewBox:"-2 -5 14 20",height:"100%",width:"100%",style:{position:"absolute",top:0}},React.createElement("path",{d:"M9.9 2.12L7.78 0 4.95 2.828 2.12 0 0 2.12l2.83 2.83L0 7.776 2.123 9.9 4.95 7.07 7.78 9.9 9.9 7.776 7.072 4.95 9.9 2.12",fill:"#fff",fillRule:"evenodd"})),checkedIcon=React.createElement("svg",{height:"100%",width:"100%",viewBox:"-2 -5 17 21",style:{position:"absolute",top:0}},React.createElement("path",{d:"M11.264 0L5.26 6.004 2.103 2.847 0 4.95l5.26 5.26 8.108-8.107L11.264 0",fill:"#fff",fillRule:"evenodd"}));function createBackgroundColor(t,i,o,s,e){var n=(t-o)/(i-o);if(0===n)return s;if(1===n)return e;for(var r="#",h=1;h<6;h+=2){var a=parseInt(s.substr(h,2),16),l=parseInt(e.substr(h,2),16),c=Math.round((1-n)*a+n*l).toString(16);1===c.length&&(c="0"+c),r+=c}return r}function convertShorthandColor(t){if(7===t.length)return t;for(var i="#",o=1;o<4;o+=1)i+=t[o]+t[o];return i}function getBackgroundColor(t,i,o,s,e){return createBackgroundColor(t,i,o,convertShorthandColor(s),convertShorthandColor(e))}var hexColorPropType=function(t,i,o){var s=t[i];return"string"!=typeof s||"#"!==s[0]||4!==s.length&&7!==s.length?new Error("Invalid prop '"+i+"' supplied to '"+o+"'. '"+i+"' has to be either a 3-digit or 6-digit hex-color string. Valid examples: '#abc', '#123456'"):null},ReactSwitch=function(e){function t(t){e.call(this,t);var i=t.height,o=t.width,s=t.checked;this.t=t.handleDiameter||i-2,this.i=Math.max(o-i,o-(i+this.t)/2),this.o=Math.max(0,(i-this.t)/2),this.state={s:s?this.i:this.o},this.e=this.e.bind(this),this.n=this.n.bind(this),this.r=this.r.bind(this),this.h=this.h.bind(this),this.a=this.a.bind(this),this.l=this.l.bind(this),this.c=this.c.bind(this),this.u=this.u.bind(this),this.p=this.p.bind(this)}return e&&(t.__proto__=e),((t.prototype=Object.create(e&&e.prototype)).constructor=t).prototype.componentWillReceiveProps=function(t){this.setState({s:t.checked?this.i:this.o})},t.prototype.f=function(t){this.setState({g:t,y:!0})},t.prototype.b=function(t){var i=Math.min(this.i,Math.max(this.o,(this.props.checked?this.i:this.o)+t-this.state.g));this.setState({s:i,v:!0})},t.prototype.T=function(t){var i=this.state,o=i.s,s=this.props,e=s.checked,n=s.onChange,r=s.id;return i.v?e?(this.i+this.o)/2<o?void this.setState({s:this.i,v:!1,y:!1}):(this.setState({v:!1,y:!1}),void n(!1,t,r)):void(o<(this.i+this.o)/2?this.setState({s:this.o,v:!1,y:!1}):(this.setState({v:!1,y:!1}),n(!0,t,r))):(this.setState({y:!1}),void n(!e,t,r))},t.prototype.e=function(t){"number"==typeof t.button&&0!==t.button||(this.f(t.clientX),window.addEventListener("mousemove",this.n),window.addEventListener("mouseup",this.r))},t.prototype.n=function(t){t.preventDefault(),this.b(t.clientX)},t.prototype.r=function(t){this.T(t),window.removeEventListener("mousemove",this.n),window.removeEventListener("mouseup",this.r)},t.prototype.h=function(t){this.f(t.touches[0].clientX)},t.prototype.a=function(t){this.b(t.touches[0].clientX)},t.prototype.l=function(t){t.preventDefault(),this.T(t)},t.prototype.c=function(){this.setState({y:!1})},t.prototype.u=function(t){var i=this.props;(0,i.onChange)(!i.checked,t,i.id)},t.prototype.p=function(t){var i=this.props,o=i.checked,s=i.onChange,e=i.id;32!==t.keyCode&&13!==t.keyCode||this.state.v||(t.preventDefault(),s(!o,t,e))},t.prototype.render=function(){var t=this,i=this.props,o=i.checked,s=i.disabled,e=i.className,n=i.offColor,r=i.onColor,h=i.offHandleColor,a=i.onHandleColor,l=i.checkedIcon,c=i.uncheckedIcon,u=i.boxShadow,p=i.activeBoxShadow,d=i.height,f=i.width,g=i.id,y=i["aria-labelledby"],b=i["aria-label"],v=this.state,T=v.s,w=v.v,k=v.y,C={position:"relative",display:"inline-block",textAlign:"left",opacity:s?.5:1,borderRadius:d/2,WebkitTransition:"opacity 0.25s",MozTransition:"opacity 0.25s",transition:"opacity 0.25s",touchAction:"none",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitUserSelect:"none",MozUserSelect:"none",msUserSelect:"none",userSelect:"none"},P={height:d,width:f,margin:Math.max(0,(this.t-d)/2),position:"relative",background:getBackgroundColor(T,this.i,this.o,n,r),borderRadius:d/2,cursor:s?"default":"pointer",WebkitTransition:w?null:"background 0.25s",MozTransition:w?null:"background 0.25s",transition:w?null:"background 0.25s"},x={height:d,width:Math.min(1.5*d,f-(this.t+d)/2+1),position:"relative",opacity:(T-this.o)/(this.i-this.o),pointerEvents:"none",WebkitTransition:w?null:"opacity 0.25s",MozTransition:w?null:"opacity 0.25s",transition:w?null:"opacity 0.25s"},m={height:d,width:Math.min(1.5*d,f-(this.t+d)/2+1),position:"absolute",opacity:1-(T-this.o)/(this.i-this.o),right:0,top:0,pointerEvents:"none",WebkitTransition:w?null:"opacity 0.25s",MozTransition:w?null:"opacity 0.25s",transition:w?null:"opacity 0.25s"},R={height:this.t,width:this.t,background:getBackgroundColor(T,this.i,this.o,h,a),cursor:s?"default":"pointer",display:"inline-block",borderRadius:"50%",position:"absolute",transform:"translateX("+T+"px)",top:Math.max(0,(d-this.t)/2),outline:0,boxShadow:k?p:u,border:0,WebkitTransition:w?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s",MozTransition:w?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s",transition:w?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s"};return React.createElement("div",{className:e,style:C},React.createElement("div",{className:"react-switch-bg",style:P,onClick:s?null:this.u},l&&React.createElement("div",{style:x},l),c&&React.createElement("div",{style:m},c)),React.createElement("div",{className:"react-switch-handle",role:"checkbox",tabIndex:s?null:0,onMouseDown:s?null:this.e,onTouchStart:s?null:this.h,onTouchMove:s?null:this.a,onTouchEnd:s?null:this.l,onTouchCancel:s?null:this.c,onKeyDown:this.p,onFocus:function(){return t.setState({y:!0})},onBlur:function(){return t.setState({y:!1})},style:R,id:g,"aria-checked":o,"aria-disabled":s,"aria-labelledby":y,"aria-label":b}))},t}(React.Component);"production"!==process.env.NODE_ENV&&(ReactSwitch.propTypes={checked:PropTypes.bool.isRequired,onChange:PropTypes.func.isRequired,disabled:PropTypes.bool,offColor:hexColorPropType,onColor:hexColorPropType,offHandleColor:hexColorPropType,onHandleColor:hexColorPropType,handleDiameter:PropTypes.number,uncheckedIcon:PropTypes.oneOfType([PropTypes.bool,PropTypes.element]),checkedIcon:PropTypes.oneOfType([PropTypes.bool,PropTypes.element]),boxShadow:PropTypes.string,activeBoxShadow:PropTypes.string,height:PropTypes.number,width:PropTypes.number,className:PropTypes.string,id:PropTypes.string,"aria-labelledby":PropTypes.string,"aria-label":PropTypes.string}),ReactSwitch.defaultProps={disabled:!1,offColor:"#888",onColor:"#080",offHandleColor:"#fff",onHandleColor:"#fff",uncheckedIcon:uncheckedIcon,checkedIcon:checkedIcon,boxShadow:null,activeBoxShadow:"0 0 2px 3px #3bf",height:28,width:56},module.exports=ReactSwitch; | ||
var React=require("react"),uncheckedIcon=React.createElement("svg",{viewBox:"-2 -5 14 20",height:"100%",width:"100%",style:{position:"absolute",top:0}},React.createElement("path",{d:"M9.9 2.12L7.78 0 4.95 2.828 2.12 0 0 2.12l2.83 2.83L0 7.776 2.123 9.9 4.95 7.07 7.78 9.9 9.9 7.776 7.072 4.95 9.9 2.12",fill:"#fff",fillRule:"evenodd"})),checkedIcon=React.createElement("svg",{height:"100%",width:"100%",viewBox:"-2 -5 17 21",style:{position:"absolute",top:0}},React.createElement("path",{d:"M11.264 0L5.26 6.004 2.103 2.847 0 4.95l5.26 5.26 8.108-8.107L11.264 0",fill:"#fff",fillRule:"evenodd"}));function createBackgroundColor(t,i,o,s,n){var h=(t-o)/(i-o);if(0===h)return s;if(1===h)return n;for(var e="#",a=1;a<6;a+=2){var r=parseInt(s.substr(a,2),16),l=parseInt(n.substr(a,2),16),c=Math.round((1-h)*r+h*l).toString(16);1===c.length&&(c="0"+c),e+=c}return e}function convertShorthandColor(t){if(7===t.length)return t;for(var i="#",o=1;o<4;o+=1)i+=t[o]+t[o];return i}function getBackgroundColor(t,i,o,s,n){return createBackgroundColor(t,i,o,convertShorthandColor(s),convertShorthandColor(n))}var ReactSwitch=function(n){function t(t){n.call(this,t);var i=t.height,o=t.width,s=t.checked;this.t=t.handleDiameter||i-2,this.i=Math.max(o-i,o-(i+this.t)/2),this.o=Math.max(0,(i-this.t)/2),this.state={s:s?this.i:this.o},this.n=this.n.bind(this),this.h=this.h.bind(this),this.e=this.e.bind(this),this.a=this.a.bind(this),this.r=this.r.bind(this),this.l=this.l.bind(this),this.c=this.c.bind(this),this.u=this.u.bind(this),this.f=this.f.bind(this)}return n&&(t.__proto__=n),((t.prototype=Object.create(n&&n.prototype)).constructor=t).prototype.componentWillReceiveProps=function(t){this.setState({s:t.checked?this.i:this.o})},t.prototype.g=function(t){this.setState({p:t,b:!0})},t.prototype.v=function(t){var i=Math.min(this.i,Math.max(this.o,(this.props.checked?this.i:this.o)+t-this.state.p));this.setState({s:i,k:!0})},t.prototype.w=function(t){var i=this.state,o=i.s,s=this.props,n=s.checked,h=s.onChange,e=s.id;return i.k?n?(this.i+this.o)/2<o?void this.setState({s:this.i,k:!1,b:!1}):(this.setState({k:!1,b:!1}),void h(!1,t,e)):void(o<(this.i+this.o)/2?this.setState({s:this.o,k:!1,b:!1}):(this.setState({k:!1,b:!1}),h(!0,t,e))):(this.setState({b:!1}),void h(!n,t,e))},t.prototype.n=function(t){"number"==typeof t.button&&0!==t.button||(this.g(t.clientX),window.addEventListener("mousemove",this.h),window.addEventListener("mouseup",this.e))},t.prototype.h=function(t){t.preventDefault(),this.v(t.clientX)},t.prototype.e=function(t){this.w(t),window.removeEventListener("mousemove",this.h),window.removeEventListener("mouseup",this.e)},t.prototype.a=function(t){this.g(t.touches[0].clientX)},t.prototype.r=function(t){this.v(t.touches[0].clientX)},t.prototype.l=function(t){t.preventDefault(),this.w(t)},t.prototype.c=function(){this.setState({b:!1})},t.prototype.u=function(t){var i=this.props;(0,i.onChange)(!i.checked,t,i.id)},t.prototype.f=function(t){var i=this.props,o=i.checked,s=i.onChange,n=i.id;32!==t.keyCode&&13!==t.keyCode||this.state.k||(t.preventDefault(),s(!o,t,n))},t.prototype.render=function(){var t=this,i=this.props,o=i.checked,s=i.disabled,n=i.className,h=i.offColor,e=i.onColor,a=i.offHandleColor,r=i.onHandleColor,l=i.checkedIcon,c=i.uncheckedIcon,u=i.boxShadow,d=i.activeBoxShadow,f=i.height,g=i.width,p=i.id,b=i["aria-labelledby"],v=i["aria-label"],k=this.state,w=k.s,y=k.k,$=k.b,M={position:"relative",display:"inline-block",textAlign:"left",opacity:s?.5:1,borderRadius:f/2,WebkitTransition:"opacity 0.25s",MozTransition:"opacity 0.25s",transition:"opacity 0.25s",touchAction:"none",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitUserSelect:"none",MozUserSelect:"none",msUserSelect:"none",userSelect:"none"},R={height:f,width:g,margin:Math.max(0,(this.t-f)/2),position:"relative",background:getBackgroundColor(w,this.i,this.o,h,e),borderRadius:f/2,cursor:s?"default":"pointer",WebkitTransition:y?null:"background 0.25s",MozTransition:y?null:"background 0.25s",transition:y?null:"background 0.25s"},m={height:f,width:Math.min(1.5*f,g-(this.t+f)/2+1),position:"relative",opacity:(w-this.o)/(this.i-this.o),pointerEvents:"none",WebkitTransition:y?null:"opacity 0.25s",MozTransition:y?null:"opacity 0.25s",transition:y?null:"opacity 0.25s"},C={height:f,width:Math.min(1.5*f,g-(this.t+f)/2+1),position:"absolute",opacity:1-(w-this.o)/(this.i-this.o),right:0,top:0,pointerEvents:"none",WebkitTransition:y?null:"opacity 0.25s",MozTransition:y?null:"opacity 0.25s",transition:y?null:"opacity 0.25s"},T={height:this.t,width:this.t,background:getBackgroundColor(w,this.i,this.o,a,r),cursor:s?"default":"pointer",display:"inline-block",borderRadius:"50%",position:"absolute",transform:"translateX("+w+"px)",top:Math.max(0,(f-this.t)/2),outline:0,boxShadow:$?d:u,border:0,WebkitTransition:y?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s",MozTransition:y?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s",transition:y?null:"background-color 0.25s, transform 0.25s, box-shadow 0.15s"};return React.createElement("div",{className:n,style:M},React.createElement("div",{className:"react-switch-bg",style:R,onClick:s?null:this.u},l&&React.createElement("div",{style:m},l),c&&React.createElement("div",{style:C},c)),React.createElement("div",{className:"react-switch-handle",role:"checkbox",tabIndex:s?null:0,onMouseDown:s?null:this.n,onTouchStart:s?null:this.a,onTouchMove:s?null:this.r,onTouchEnd:s?null:this.l,onTouchCancel:s?null:this.c,onKeyDown:this.f,onFocus:function(){return t.setState({b:!0})},onBlur:function(){return t.setState({b:!1})},style:T,id:p,"aria-checked":o,"aria-disabled":s,"aria-labelledby":b,"aria-label":v}))},t}(React.Component);ReactSwitch.defaultProps={disabled:!1,offColor:"#888",onColor:"#080",offHandleColor:"#fff",onHandleColor:"#fff",uncheckedIcon:uncheckedIcon,checkedIcon:checkedIcon,boxShadow:null,activeBoxShadow:"0 0 2px 3px #3bf",height:28,width:56},module.exports=ReactSwitch; |
{ | ||
"name": "react-switch", | ||
"version": "3.0.3", | ||
"version": "3.0.4", | ||
"description": "Draggable toggle-switch component for react", | ||
@@ -5,0 +5,0 @@ "main": "index.js", |
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
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
1
2
46200
9
595