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