essy-react-controls - npm Package Compare versions

Comparing version 1.1.3 to 1.1.4

index.js

		@@ -1,1 +0,1 @@
		(()=>{"use strict";var e={n:t=>{var n=t&&t.__esModule?()=>t.default:()=>t;return e.d(n,{a:n}),n},d:(t,n)=>{for(var a in n)e.o(n,a)&&!e.o(t,a)&&Object.defineProperty(t,a,{enumerable:!0,get:n[a]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Button:()=>m,ButtonGroup:()=>p,ButtonSplit:()=>b,Checkbox:()=>h,Input:()=>f,InputBasic:()=>y,RadioButton:()=>g,RadioButtonGroup:()=>v,Slider:()=>E,SpikeLoader:()=>d,SpikeLoaderMask:()=>k,Toggle:()=>N});const n=require("react");var a=e.n(n);const l=require("prop-types");var s=e.n(l);const o=require("essy-util-ui"),i=require("essy-util-misc"),r=require("essy-react-icons"),c={small:8,medium:10,large:12};function d({small:e,medium:t,text:n,white:l}){const s=c[e?"small":t?"medium":"large"];return a().createElement("div",{className:(0,o.classNames)("erc-spike-loader",e&&"small",t&&"medium",l&&"white")},n.length?a().createElement("div",{className:"erc-spike-loader-text"},n):null,a().createElement("div",{className:"erc-spike-loader-icon"},(0,i.getArray)(s).map(((e,t)=>a().createElement("div",{key:t})))))}function u(){return u=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},u.apply(this,arguments)}function m({active:e,btnRef:t,children:n,classNames:l,disabled:s,disabledClass:c,icon:m,iconSize:p,id:b,loading:h,onClick:f,small:y,style:g,text:v,title:E,xsmall:k}){l=(Array.isArray(l)?l:l.split(/\s+/)).filter((e=>"string"==typeof e));const N={className:(0,o.classNames)("erc-btn",e&&"active",c&&"disabled",h&&"loader",y&&"sm",k&&"x-sm",...l),disabled:s\|\|h,onClick:c?i.fnIdentity:f,...t&&{ref:t},...b&&{id:b},...g&&{style:g},...E&&{title:E}};return a().createElement("button",N,function(){const e=[];if(h)return a().createElement(d,u({key:"0"},y?{small:y}:{medium:!0}));if(m)if(a().isValidElement(m))e.push(m);else{const t=p\|\|(y?[12,12]:[16,16]);e.push(a().createElement(r.Icon,{key:"1",height:t[1],icon:m,width:t[0]}))}if(v&&e.push(a().createElement("span",{key:"2",className:"text"},v)),l.includes("arrow"))e.push(a().createElement("span",{key:"3",className:"arrow"}));else if(n)return n;return e}())}function p({onClick:e,options:t,value:n}){const l=t.some((e=>!!e.labelAbove));return n=Array.isArray(n)?n:[n],a().createElement("div",{className:"erc-btn-group"+(l?" labels":"")},t.map(((t,l)=>a().createElement(m,{key:l,classNames:["border",n.includes(t.value)?"primary":"secondary"],border:!0,onClick:()=>e(t.value)},t.label,t.labelAbove&&a().createElement("span",{className:"erc-btn-group-label"},t.labelAbove)))))}function b({className:e,disabled:t,disabledBtn:l,icon:s,iconSize:i,items:r,onClick:c,onClickItem:d,small:u,text:p}){const b=(0,n.useRef)(null),[h,f]=(0,n.useState)(!1),[y,g]=(0,n.useState)(0);function v(e){e.target.closest(".erc-btn-split")\|\|E()}function E(){f(!1),document.removeEventListener("click",v)}return(0,n.useEffect)((()=>{const e=b.current.getBoundingClientRect();g(e.height)}),[e,s,i,u,p]),a().createElement("div",{className:(0,o.classNames)("erc-btn-split",u&&"sm")},a().createElement("div",{className:"btns",ref:b},a().createElement(m,{classNames:e,disabled:t\|\|l,icon:s,iconSize:i,onClick:()=>{E(),c()},small:u,text:p}),a().createElement(m,{classNames:e?[e,"arrow"]:"arrow",disabled:t,onClick:function(){h?E():(f(!0),document.addEventListener("click",v,!1))},small:u})),h&&a().createElement("div",{className:"erc-btn-split-menu",style:{top:y}},r.map(((e,t)=>a().createElement("div",{key:t,className:"erc-btn-split-item",onClick:()=>function(e,t){E(),d(e,t)}(e,t)},e)))))}function h({checked:e,children:t,className:n,disabled:l,indeterminate:s,onChange:i}){return a().createElement("label",{className:(0,o.classNames)("erc-checkbox",l&&"disabled",n),disabled:l},a().createElement("input",{className:"erc-checkbox-default",checked:e,disabled:l,onChange:e=>i(e.target.checked),ref:e=>e&&(e.indeterminate=!!s),type:"checkbox"}),a().createElement("span",{className:"erc-checkbox-custom"}),a().createElement("span",{className:"erc-checkbox-content"},t))}function f({autoComplete:e,disabled:t,focusOnMount:l,inputRef:s,invalid:i,label:c,note:d,onBlur:u,onChange:m,onFocus:p,onKeyDown:b,passwordShow:h,textarea:f,type:y,validator:g,value:v}){s=s\|\|(0,n.useRef)();const[E,k]=(0,n.useState)(!1),[N,C]=(0,n.useState)(!1),w=c.replace(/\s/g,""),R={disabled:t,id:"erc-text-input-"+w,name:w,onBlur:()=>x(!1),onChange:e=>m(e.target.value),onFocus:()=>x(!0),onKeyDown:b,type:N?"text":y,ref:s,value:v,...!e&&{autoComplete:"off"}};function x(e){e\|\|u(),k(e),p(e)}return(0,n.useEffect)((()=>{l&&s.current.focus()}),[]),a().createElement("div",{className:(0,o.classNames)("erc-input",t&&"disabled",E&&"focused",i&&!E&&"invalid",f&&"textarea",v.length&&"value")},a().createElement("label",{htmlFor:R.id},c),f?a().createElement("textarea",R):a().createElement("input",R),h&&v.length?a().createElement("div",{className:"icon-wrap",onClick:()=>C(!N)},a().createElement(r.Icon,{className:N?"active":"inactive",height:20,icon:r.icons.EyeIcon,width:20})):null,!E&&a().createElement("div",{className:"invalid",dangerouslySetInnerHTML:{__html:i\|\|" "}}),d.length?a().createElement("div",{className:"note"},d):null)}function y({autoComplete:e,disabled:t,focusOnMount:l,inputRef:s,invalid:i,label:r,note:c,onBlur:d,onChange:u,onFocus:m,onKeyDown:p,placeholder:b,small:h,textarea:f,type:y,value:g}){s=s\|\|(0,n.useRef)();const[v,E]=(0,n.useState)(!1),k={disabled:t,name:b?b.replace(/\s/g,""):"noname",onBlur:e=>N(e,!1),onChange:e=>u(e.target.value),onFocus:e=>N(e,!0),onKeyDown:p,placeholder:b,ref:s,type:y,value:g,...!e&&{autoComplete:"off"}};function N(e,t){t\|\|d(e),E(t),m(t)}return(0,n.useEffect)((()=>{l&&s.current.focus()}),[]),a().createElement("div",{className:(0,o.classNames)("erc-input-basic",h&&"sm",i&&!v&&"invalid",r&&"label")},r&&a().createElement("label",null,r),f?a().createElement("textarea",k):a().createElement("input",k),!v&&"string"==typeof i&&a().createElement("div",{className:"invalid"},i),c.length?a().createElement("div",{className:"note"},c):null)}function g({checked:e,children:t,disabled:n,onChange:l}){return a().createElement("label",{className:(0,o.classNames)("erc-radio",n&&"disabled"),disabled:n},a().createElement("input",{className:"erc-radio-default",checked:e,disabled:n,onChange:e=>l(e.target.checked),type:"radio"}),a().createElement("span",{className:"erc-radio-custom"}),a().createElement("span",{className:"erc-radio-content"},t))}function v({className:e,disabled:t,onChange:n,options:l,value:s}){return a().createElement("div",{className:(0,o.classNames)("erc-radio-group",e&&e)},l.map(((e,l)=>a().createElement(g,{key:l,checked:e.value===s,disabled:t,onChange:t=>n(e.value)},e.label))))}d.defaultProps={medium:!1,small:!1,text:"",white:!1},d.propTypes={medium:s().bool,small:s().bool,text:s().string,white:s().bool},m.defaultProps={active:!1,classNames:[],disabled:!1,icon:!1,onClick:i.fnIdentity,small:!1,xsmall:!1},m.propTypes={active:s().bool,btnRef:s().object,classNames:s().oneOfType([s().string,s().array]),disabled:s().bool,disabledClass:s().bool,icon:s().oneOfType([s().object,s().bool]),iconSize:s().array,id:s().string,loading:s().bool,onClick:s().func,small:s().bool,style:s().object,text:s().string,title:s().string,xsmall:s().bool},p.propTypes={onClick:s().func.isRequired,options:s().array.isRequired,value:s().oneOfType([s().array,s().number,s().string]).isRequired},b.defaultProps={disabled:!1,disabledBtn:!1,icon:!1,iconSize:[16,16],small:!1},b.propTypes={className:s().string,disabled:s().bool,disabledBtn:s().bool,icon:s().oneOfType([s().object,s().bool]),iconSize:s().array,items:s().array.isRequired,onClick:s().func.isRequired,onClickItem:s().func.isRequired,small:s().bool,text:s().string},h.defaultProps={disabled:!1},h.propTypes={checked:s().bool.isRequired,className:s().string,disabled:s().bool,indeterminate:s().bool,onChange:s().func.isRequired},f.defaultProps={autoComplete:!0,disabled:!1,invalid:!1,note:"",onBlur:i.fnNoOp,onFocus:i.fnNoOp,onKeyDown:i.fnNoOp,passwordShow:!1,textarea:!1,type:"text",validator:i.fnNoOp},f.propTypes={autoComplete:s().bool,disabled:s().bool,focusOnMount:s().bool,invalid:s().oneOfType([s().bool,s().string]),inputRef:s().object,label:s().string.isRequired,note:s().string,onBlur:s().func,onChange:s().func.isRequired,onFocus:s().func,onKeyDown:s().func,passwordShow:s().bool,textarea:s().bool,type:s().string,validator:s().func,value:s().string.isRequired},y.defaultProps={autoComplete:!0,disabled:!1,invalid:!1,note:"",onBlur:i.fnNoOp,onFocus:i.fnNoOp,onKeyDown:i.fnNoOp,placeholder:"",type:"text"},y.propTypes={autoComplete:s().bool,disabled:s().bool,focusOnMount:s().bool,inputRef:s().object,invalid:s().oneOfType([s().bool,s().string]),label:s().string,note:s().string,onBlur:s().func,onChange:s().func.isRequired,onFocus:s().func,onKeyDown:s().func,placeholder:s().string,small:s().bool,textarea:s().bool,type:s().string,value:s().string.isRequired},g.defaultProps={disabled:!1},g.propTypes={checked:s().bool.isRequired,disabled:s().bool,onChange:s().func.isRequired},v.propTypes={className:s().string,disabled:s().bool,onChange:s().func.isRequired,options:s().array.isRequired,value:s().oneOfType([s().number,s().string,s().bool]).isRequired};class E extends a().Component{constructor(e){super(e),this.state={knobWidth:0,styleBg:{},styleFill:{},width:0},this.handleClickRail=this.handleClickRail.bind(this),this.handleMouseDownKnob=this.handleMouseDownKnob.bind(this),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this)}componentDidMount(){const e=this.sliderEl.offsetWidth,t=this.knobEl.offsetWidth,n=t/2,a=t-2;this.setState({knobWidth:t,styleBg:{borderRadius:n,height:a},styleFill:{borderBottomLeftRadius:n,borderTopLeftRadius:n,height:a},width:e})}handleClickRail(e){this.props.onChangeValue(this.valueFromX(e.pageX-this.sliderEl.getBoundingClientRect().left+this.state.knobWidth/2-window.scrollX))}handleMouseDownKnob(e){this.offsetX=e.pageX-e.target.offsetLeft-window.scrollX-this.state.knobWidth/2,document.addEventListener("mousemove",this.handleMouseMove,!1),document.addEventListener("mouseup",this.handleMouseUp,!1)}handleMouseMove(e){this.props.onChangeValue(this.valueFromX(e.pageX-this.offsetX))}handleMouseUp(){document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)}valueFromX(e){const t=this.props.domain;return e<=0?t[0]:e>=this.state.width?t[1]:t[0]+e/this.state.width(t[1]-t[0])}render(){const{knobWidth:e,styleBg:t,styleFill:n,width:l}=this.state,{disabled:s,domain:o,value:r}=this.props,c=(l-e)r/(o[1]-o[0]);return a().createElement("div",{className:"erc-slider"+(s?" disabled":""),ref:e=>this.sliderEl=e,onClick:s?i.fnIdentity:this.handleClickRail},a().createElement("div",{className:"erc-slider-bg",style:t}),a().createElement("div",{className:"erc-slider-fill",style:{...n,width:c<1?0:c+e/2}}),a().createElement("div",{className:"erc-slider-knob",style:{left:c},ref:e=>this.knobEl=e,onMouseDown:s?i.fnIdentity:this.handleMouseDownKnob}))}}function k(e){return a().createElement("div",{className:"erc-spike-loader-mask"},a().createElement(d,e))}function N({disabled:e,error:t,large:n,on:l,onClick:s,text:i,white:r}){return a().createElement("div",{className:(0,o.classNames)("erc-toggle",l&&"on",n&&"large",t&&"error",r&&"white",e&&"disabled"),onClick:e?()=>{}:s},a().createElement("div",{className:"track"},a().createElement("div",{className:"knob"})),a().createElement("div",{className:"text",dangerouslySetInnerHTML:{__html:i}}))}E.defaultProps={disabled:!1,domain:[0,1]},E.propTypes={disabled:s().bool,domain:s().array,onChangeValue:s().func.isRequired,value:s().number.isRequired},N.defaultProps={disabled:!1,error:!1,large:!1,on:!1,onClick:i.fnIdentity,text:"",white:!1},N.propTypes={disabled:s().bool,error:s().bool,large:s().bool,on:s().bool,onClick:s().func,text:s().string,white:s().bool},module.exports=t})();
		(()=>{"use strict";var e={n:t=>{var n=t&&t.__esModule?()=>t.default:()=>t;return e.d(n,{a:n}),n},d:(t,n)=>{for(var a in n)e.o(n,a)&&!e.o(t,a)&&Object.defineProperty(t,a,{enumerable:!0,get:n[a]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Button:()=>m,ButtonGroup:()=>p,ButtonSplit:()=>b,Checkbox:()=>h,Input:()=>f,InputBasic:()=>y,RadioButton:()=>g,RadioButtonGroup:()=>v,Slider:()=>E,SpikeLoader:()=>d,SpikeLoaderMask:()=>k,Toggle:()=>N});const n=require("react");var a=e.n(n);const l=require("prop-types");var s=e.n(l);const o=require("essy-util-ui"),i=require("essy-util-misc"),r=require("essy-react-icons"),c={small:8,medium:10,large:12};function d({small:e,medium:t,text:n,white:l}){const s=c[e?"small":t?"medium":"large"];return a().createElement("div",{className:(0,o.classNames)("erc-spike-loader",e&&"small",t&&"medium",l&&"white")},n.length?a().createElement("div",{className:"erc-spike-loader-text"},n):null,a().createElement("div",{className:"erc-spike-loader-icon"},(0,i.getArray)(s).map(((e,t)=>a().createElement("div",{key:t})))))}function u(){return u=Object.assign\|\|function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},u.apply(this,arguments)}function m({active:e,btnRef:t,children:n,classNames:l,disabled:s,disabledClass:c,icon:m,iconSize:p,id:b,loading:h,onClick:f,small:y,style:g,text:v,title:E,xsmall:k}){l=(Array.isArray(l)?l:l.split(/\s+/)).filter((e=>"string"==typeof e));const N={className:(0,o.classNames)("erc-btn",e&&"active",c&&"disabled",h&&"loader",y&&"sm",k&&"x-sm",...l),disabled:s\|\|h,onClick:c?i.fnIdentity:f,...t&&{ref:t},...b&&{id:b},...g&&{style:g},...E&&{title:E}};return a().createElement("button",N,function(){const e=[];if(h)return a().createElement(d,u({key:"0"},y?{small:y}:{medium:!0}));if(m)if(a().isValidElement(m))e.push(m);else{const t=p\|\|(y?[12,12]:[16,16]);e.push(a().createElement(r.Icon,{key:"1",height:t[1],icon:m,width:t[0]}))}if(v&&e.push(a().createElement("span",{key:"2",className:"text"},v)),l.includes("arrow"))e.push(a().createElement("span",{key:"3",className:"arrow"}));else if(n)return n;return e}())}function p({onClick:e,options:t,value:n}){const l=t.some((e=>!!e.labelAbove));return n=Array.isArray(n)?n:[n],a().createElement("div",{className:"erc-btn-group"+(l?" labels":"")},t.map(((t,l)=>a().createElement(m,{key:l,classNames:["border",n.includes(t.value)?"primary":"secondary"],border:!0,onClick:()=>e(t.value)},t.label,t.labelAbove&&a().createElement("span",{className:"erc-btn-group-label"},t.labelAbove)))))}function b({className:e,disabled:t,disabledBtn:l,icon:s,iconSize:i,items:r,onClick:c,onClickItem:d,small:u,text:p}){const b=(0,n.useRef)(null),[h,f]=(0,n.useState)(!1),[y,g]=(0,n.useState)(0);function v(e){e.target.closest(".erc-btn-split")\|\|E()}function E(){f(!1),document.removeEventListener("click",v)}return(0,n.useEffect)((()=>{const e=b.current.getBoundingClientRect();g(e.height)}),[e,s,i,u,p]),a().createElement("div",{className:(0,o.classNames)("erc-btn-split",u&&"sm")},a().createElement("div",{className:"btns",ref:b},a().createElement(m,{classNames:e,disabled:t\|\|l,icon:s,iconSize:i,onClick:()=>{E(),c()},small:u,text:p}),a().createElement(m,{classNames:e?[e,"arrow"]:"arrow",disabled:t,onClick:function(){h?E():(f(!0),document.addEventListener("click",v,!1))},small:u})),h&&a().createElement("div",{className:"erc-btn-split-menu",style:{top:y}},r.map(((e,t)=>a().createElement("div",{key:t,className:"erc-btn-split-item",onClick:()=>function(e,t){E(),d(e,t)}(e,t)},e)))))}function h({checked:e,children:t,className:n,disabled:l,indeterminate:s,onChange:i}){return a().createElement("label",{className:(0,o.classNames)("erc-checkbox",l&&"disabled",n),disabled:l},a().createElement("input",{className:"erc-checkbox-default",checked:e,disabled:l,onChange:e=>i(e.target.checked),ref:e=>e&&(e.indeterminate=!!s),type:"checkbox"}),a().createElement("span",{className:"erc-checkbox-custom"}),a().createElement("span",{className:"erc-checkbox-content"},t))}function f({autoComplete:e,disabled:t,focusOnMount:l,inputRef:s,invalid:i,label:c,note:d,onBlur:u,onChange:m,onFocus:p,onKeyDown:b,passwordShow:h,textarea:f,type:y,validator:g,value:v}){s=s\|\|(0,n.useRef)();const[E,k]=(0,n.useState)(!1),[N,C]=(0,n.useState)(!1),w=c.replace(/\s/g,""),R={disabled:t,id:"erc-text-input-"+w,name:w,onBlur:()=>x(!1),onChange:e=>m(e.target.value),onFocus:()=>x(!0),onKeyDown:b,type:N?"text":y,ref:s,value:v,...!e&&{autoComplete:"off"}};function x(e){e\|\|u(),k(e),p(e)}return(0,n.useEffect)((()=>{l&&s.current.focus()}),[]),a().createElement("div",{className:(0,o.classNames)("erc-input",t&&"disabled",E&&"focused",i&&!E&&"invalid",f&&"textarea",v.length&&"value")},a().createElement("label",{htmlFor:R.id},c),f?a().createElement("textarea",R):a().createElement("input",R),h&&v.length?a().createElement("div",{className:"icon-wrap",onClick:()=>C(!N)},a().createElement(r.Icon,{className:N?"active":"inactive",height:20,icon:r.icons.EyeIcon,width:20})):null,!E&&a().createElement("div",{className:"invalid",dangerouslySetInnerHTML:{__html:i\|\|" "}}),d.length?a().createElement("div",{className:"note"},d):null)}function y({autoComplete:e,disabled:t,focusOnMount:l,inputRef:s,invalid:i,label:r,note:c,onBlur:d,onChange:u,onFocus:m,onKeyDown:p,placeholder:b,small:h,textarea:f,type:y,value:g}){s=s\|\|(0,n.useRef)();const[v,E]=(0,n.useState)(!1),k={disabled:t,name:b?b.replace(/\s/g,""):"noname",onBlur:()=>N(!1),onChange:e=>u(e.target.value),onFocus:()=>N(!0),onKeyDown:p,placeholder:b,ref:s,type:y,value:g,...!e&&{autoComplete:"off"}};function N(e){e\|\|d(),E(e),m(e)}return(0,n.useEffect)((()=>{l&&s.current.focus()}),[]),a().createElement("div",{className:(0,o.classNames)("erc-input-basic",h&&"sm",i&&!v&&"invalid",r&&"label")},r&&a().createElement("label",null,r),f?a().createElement("textarea",k):a().createElement("input",k),!v&&"string"==typeof i&&a().createElement("div",{className:"invalid"},i),c.length?a().createElement("div",{className:"note"},c):null)}function g({checked:e,children:t,disabled:n,onChange:l}){return a().createElement("label",{className:(0,o.classNames)("erc-radio",n&&"disabled"),disabled:n},a().createElement("input",{className:"erc-radio-default",checked:e,disabled:n,onChange:e=>l(e.target.checked),type:"radio"}),a().createElement("span",{className:"erc-radio-custom"}),a().createElement("span",{className:"erc-radio-content"},t))}function v({className:e,disabled:t,onChange:n,options:l,value:s}){return a().createElement("div",{className:(0,o.classNames)("erc-radio-group",e&&e)},l.map(((e,l)=>a().createElement(g,{key:l,checked:e.value===s,disabled:t,onChange:t=>n(e.value)},e.label))))}d.defaultProps={medium:!1,small:!1,text:"",white:!1},d.propTypes={medium:s().bool,small:s().bool,text:s().string,white:s().bool},m.defaultProps={active:!1,classNames:[],disabled:!1,icon:!1,onClick:i.fnIdentity,small:!1,xsmall:!1},m.propTypes={active:s().bool,btnRef:s().object,classNames:s().oneOfType([s().string,s().array]),disabled:s().bool,disabledClass:s().bool,icon:s().oneOfType([s().object,s().bool]),iconSize:s().array,id:s().string,loading:s().bool,onClick:s().func,small:s().bool,style:s().object,text:s().string,title:s().string,xsmall:s().bool},p.propTypes={onClick:s().func.isRequired,options:s().array.isRequired,value:s().oneOfType([s().array,s().number,s().string]).isRequired},b.defaultProps={disabled:!1,disabledBtn:!1,icon:!1,iconSize:[16,16],small:!1},b.propTypes={className:s().string,disabled:s().bool,disabledBtn:s().bool,icon:s().oneOfType([s().object,s().bool]),iconSize:s().array,items:s().array.isRequired,onClick:s().func.isRequired,onClickItem:s().func.isRequired,small:s().bool,text:s().string},h.defaultProps={disabled:!1},h.propTypes={checked:s().bool.isRequired,className:s().string,disabled:s().bool,indeterminate:s().bool,onChange:s().func.isRequired},f.defaultProps={autoComplete:!0,disabled:!1,invalid:!1,note:"",onBlur:i.fnNoOp,onFocus:i.fnNoOp,onKeyDown:i.fnNoOp,passwordShow:!1,textarea:!1,type:"text",validator:i.fnNoOp},f.propTypes={autoComplete:s().bool,disabled:s().bool,focusOnMount:s().bool,invalid:s().oneOfType([s().bool,s().string]),inputRef:s().object,label:s().string.isRequired,note:s().string,onBlur:s().func,onChange:s().func.isRequired,onFocus:s().func,onKeyDown:s().func,passwordShow:s().bool,textarea:s().bool,type:s().string,validator:s().func,value:s().string.isRequired},y.defaultProps={autoComplete:!0,disabled:!1,invalid:!1,note:"",onBlur:i.fnNoOp,onFocus:i.fnNoOp,onKeyDown:i.fnNoOp,placeholder:"",type:"text"},y.propTypes={autoComplete:s().bool,disabled:s().bool,focusOnMount:s().bool,inputRef:s().object,invalid:s().oneOfType([s().bool,s().string]),label:s().string,note:s().string,onBlur:s().func,onChange:s().func.isRequired,onFocus:s().func,onKeyDown:s().func,placeholder:s().string,small:s().bool,textarea:s().bool,type:s().string,value:s().string.isRequired},g.defaultProps={disabled:!1},g.propTypes={checked:s().bool.isRequired,disabled:s().bool,onChange:s().func.isRequired},v.propTypes={className:s().string,disabled:s().bool,onChange:s().func.isRequired,options:s().array.isRequired,value:s().oneOfType([s().number,s().string,s().bool]).isRequired};class E extends a().Component{constructor(e){super(e),this.state={knobWidth:0,styleBg:{},styleFill:{},width:0},this.handleClickRail=this.handleClickRail.bind(this),this.handleMouseDownKnob=this.handleMouseDownKnob.bind(this),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this)}componentDidMount(){const e=this.sliderEl.offsetWidth,t=this.knobEl.offsetWidth,n=t/2,a=t-2;this.setState({knobWidth:t,styleBg:{borderRadius:n,height:a},styleFill:{borderBottomLeftRadius:n,borderTopLeftRadius:n,height:a},width:e})}handleClickRail(e){this.props.onChangeValue(this.valueFromX(e.pageX-this.sliderEl.getBoundingClientRect().left+this.state.knobWidth/2-window.scrollX))}handleMouseDownKnob(e){this.offsetX=e.pageX-e.target.offsetLeft-window.scrollX-this.state.knobWidth/2,document.addEventListener("mousemove",this.handleMouseMove,!1),document.addEventListener("mouseup",this.handleMouseUp,!1)}handleMouseMove(e){this.props.onChangeValue(this.valueFromX(e.pageX-this.offsetX))}handleMouseUp(){document.removeEventListener("mousemove",this.handleMouseMove),document.removeEventListener("mouseup",this.handleMouseUp)}valueFromX(e){const t=this.props.domain;return e<=0?t[0]:e>=this.state.width?t[1]:t[0]+e/this.state.width(t[1]-t[0])}render(){const{knobWidth:e,styleBg:t,styleFill:n,width:l}=this.state,{disabled:s,domain:o,value:r}=this.props,c=(l-e)r/(o[1]-o[0]);return a().createElement("div",{className:"erc-slider"+(s?" disabled":""),ref:e=>this.sliderEl=e,onClick:s?i.fnIdentity:this.handleClickRail},a().createElement("div",{className:"erc-slider-bg",style:t}),a().createElement("div",{className:"erc-slider-fill",style:{...n,width:c<1?0:c+e/2}}),a().createElement("div",{className:"erc-slider-knob",style:{left:c},ref:e=>this.knobEl=e,onMouseDown:s?i.fnIdentity:this.handleMouseDownKnob}))}}function k(e){return a().createElement("div",{className:"erc-spike-loader-mask"},a().createElement(d,e))}function N({disabled:e,error:t,large:n,on:l,onClick:s,text:i,white:r}){return a().createElement("div",{className:(0,o.classNames)("erc-toggle",l&&"on",n&&"large",t&&"error",r&&"white",e&&"disabled"),onClick:e?()=>{}:s},a().createElement("div",{className:"track"},a().createElement("div",{className:"knob"})),a().createElement("div",{className:"text",dangerouslySetInnerHTML:{__html:i}}))}E.defaultProps={disabled:!1,domain:[0,1]},E.propTypes={disabled:s().bool,domain:s().array,onChangeValue:s().func.isRequired,value:s().number.isRequired},N.defaultProps={disabled:!1,error:!1,large:!1,on:!1,onClick:i.fnIdentity,text:"",white:!1},N.propTypes={disabled:s().bool,error:s().bool,large:s().bool,on:s().bool,onClick:s().func,text:s().string,white:s().bool},module.exports=t})();

package.json

		{
		"name": "essy-react-controls",
		"version": "1.1.3",
		"version": "1.1.4",
		"description": "React control components.",
		@@ -5,0 +5,0 @@ "main": "index.js",

essy-react-controls - npm Package Compare versions

New alerts

Fixed alerts

Worsened metrics