iput
Version:
an IP input component like windows
2 lines • 11.7 kB
JavaScript
(()=>{var e={426:(e,t,n)=>{"use strict";n.d(t,{Z:()=>c});var r=n(537),o=n.n(r),a=n(645),i=n.n(a)()(o());i.push([e.id,".react-ip-input {\n display: inline-block;\n border: 1px solid #c2c3c9;\n border-radius: 4px;\n padding: 5px 8px;\n}\n\n.react-ip-input .react-ip-input__item {\n display: inline-block;\n}\n\n.react-ip-input.has-error {\n border-color: #a94442;\n box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);\n}\n\n.react-ip-input input {\n width: 30px;\n border: none;\n outline: none;\n text-align: center;\n}\n","",{version:3,sources:["webpack://./src/style.css"],names:[],mappings:"AAAA;EACE,qBAAqB;EACrB,yBAAyB;EACzB,kBAAkB;EAClB,gBAAgB;AAClB;;AAEA;EACE,qBAAqB;AACvB;;AAEA;EACE,qBAAqB;EACrB,+CAA+C;AACjD;;AAEA;EACE,WAAW;EACX,YAAY;EACZ,aAAa;EACb,kBAAkB;AACpB",sourcesContent:[".react-ip-input {\n display: inline-block;\n border: 1px solid #c2c3c9;\n border-radius: 4px;\n padding: 5px 8px;\n}\n\n.react-ip-input .react-ip-input__item {\n display: inline-block;\n}\n\n.react-ip-input.has-error {\n border-color: #a94442;\n box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);\n}\n\n.react-ip-input input {\n width: 30px;\n border: none;\n outline: none;\n text-align: center;\n}\n"],sourceRoot:""}]);const c=i},645:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",r=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),r&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),r&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,r,o,a){"string"==typeof e&&(e=[[null,e,void 0]]);var i={};if(r)for(var c=0;c<this.length;c++){var u=this[c][0];null!=u&&(i[u]=!0)}for(var s=0;s<e.length;s++){var p=[].concat(e[s]);r&&i[p[0]]||(void 0!==a&&(void 0===p[5]||(p[1]="@layer".concat(p[5].length>0?" ".concat(p[5]):""," {").concat(p[1],"}")),p[5]=a),n&&(p[2]?(p[1]="@media ".concat(p[2]," {").concat(p[1],"}"),p[2]=n):p[2]=n),o&&(p[4]?(p[1]="@supports (".concat(p[4],") {").concat(p[1],"}"),p[4]=o):p[4]="".concat(o)),t.push(p))}},t}},537:e=>{"use strict";e.exports=function(e){var t=e[1],n=e[3];if(!n)return t;if("function"==typeof btoa){var r=btoa(unescape(encodeURIComponent(JSON.stringify(n)))),o="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(r),a="/*# ".concat(o," */"),i=n.sources.map((function(e){return"/*# sourceURL=".concat(n.sourceRoot||"").concat(e," */")}));return[t].concat(i).concat([a]).join("\n")}return[t].join("\n")}},703:(e,t,n)=>{"use strict";var r=n(414);function o(){}function a(){}a.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,a,i){if(i!==r){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}}function t(){return e}e.isRequired=e;var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:a,resetWarningCache:o};return n.PropTypes=n,n}},697:(e,t,n)=>{e.exports=n(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},379:e=>{"use strict";var t=[];function n(e){for(var n=-1,r=0;r<t.length;r++)if(t[r].identifier===e){n=r;break}return n}function r(e,r){for(var a={},i=[],c=0;c<e.length;c++){var u=e[c],s=r.base?u[0]+r.base:u[0],p=a[s]||0,l="".concat(s," ").concat(p);a[s]=p+1;var f=n(l),d={css:u[1],media:u[2],sourceMap:u[3],supports:u[4],layer:u[5]};if(-1!==f)t[f].references++,t[f].updater(d);else{var y=o(d,r);r.byIndex=c,t.splice(c,0,{identifier:l,updater:y,references:1})}i.push(l)}return i}function o(e,t){var n=t.domAPI(t);return n.update(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap&&t.supports===e.supports&&t.layer===e.layer)return;n.update(e=t)}else n.remove()}}e.exports=function(e,o){var a=r(e=e||[],o=o||{});return function(e){e=e||[];for(var i=0;i<a.length;i++){var c=n(a[i]);t[c].references--}for(var u=r(e,o),s=0;s<a.length;s++){var p=n(a[s]);0===t[p].references&&(t[p].updater(),t.splice(p,1))}a=u}}},569:e=>{"use strict";var t={};e.exports=function(e,n){var r=function(e){if(void 0===t[e]){var n=document.querySelector(e);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}t[e]=n}return t[e]}(e);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");r.appendChild(n)}},216:e=>{"use strict";e.exports=function(e){var t=document.createElement("style");return e.setAttributes(t,e.attributes),e.insert(t,e.options),t}},565:(e,t,n)=>{"use strict";e.exports=function(e){var t=n.nc;t&&e.setAttribute("nonce",t)}},795:e=>{"use strict";e.exports=function(e){var t=e.insertStyleElement(e);return{update:function(n){!function(e,t,n){var r="";n.supports&&(r+="@supports (".concat(n.supports,") {")),n.media&&(r+="@media ".concat(n.media," {"));var o=void 0!==n.layer;o&&(r+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),r+=n.css,o&&(r+="}"),n.media&&(r+="}"),n.supports&&(r+="}");var a=n.sourceMap;a&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),t.styleTagTransform(r,e,t.options)}(t,e,n)},remove:function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(t)}}}},589:e=>{"use strict";e.exports=function(e,t){if(t.styleSheet)t.styleSheet.cssText=e;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(e))}}}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var a=t[r]={id:r,exports:{}};return e[r](a,a.exports,n),a.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";n.r(r),n.d(r,{default:()=>k});const e=require("react");var t=n.n(e),o=n(697),a=n.n(o);function i(e){var t,n,r,o,a,i={};return e.setSelectionRange?(i.begin=e.selectionStart,i.end=e.selectionEnd,i.result=e.value.substring(i.begin,i.end)):document.selection&&("input"===e.tagName.toLowerCase()?(t=document.selection.createRange(),(n=e.createTextRange()).collapse(!0),n.select(),(r=document.selection.createRange()).setEndPoint("EndToEnd",t),i.begin=r.text.length-t.text.length,i.end=r.text.length,i.result=t.text,t.select()):"textarea"===e.tagName.toLowerCase()&&((a=(o=document.selection.createRange()).duplicate()).moveToElementText(e),a.setEndPoint("EndToEnd",o),i.begin=a.text.length-o.text.length,i.end=a.text.length,i.result=o.text)),e.focus(),i}function c(e){return e=parseInt(e),!isNaN(e)&&e>=0&&e<=255}var u=n(379),s=n.n(u),p=n(795),l=n.n(p),f=n(569),d=n.n(f),y=n(565),v=n.n(y),h=n(216),b=n.n(h),m=n(589),g=n.n(m),A=n(426),x={};function C(e){return C="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},C(e)}function E(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function w(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function O(e,t){return O=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},O(e,t)}function P(e,t){if(t&&("object"===C(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return T(e)}function T(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function _(e){return _=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},_(e)}function S(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}x.styleTagTransform=g(),x.setAttributes=v(),x.insert=d().bind(null,"head"),x.domAPI=l(),x.insertStyleElement=b(),s()(A.Z,x),A.Z&&A.Z.locals&&A.Z.locals;var k=function(e){!function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&O(e,t)}(s,e);var n,r,o,a,u=(o=s,a=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=_(o);if(a){var n=_(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return P(this,e)});function s(){var e;E(this,s);for(var t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return S(T(e=u.call.apply(u,[this].concat(n))),"state",{value:[]}),e}return n=s,(r=[{key:"componentDidMount",value:function(){var e=this.props.defaultValue;Array.isArray(e)||(e=e.split(".")),this.setState({value:e})}},{key:"handleChange",value:function(e,t){var n=this,r=parseInt(e.target.value);if(isNaN(e.target.value))return e.preventDefault();""===e.target.value||c(r)||(r=255);var o=this.state.value;o[t]=r,this.setState({value:o},(function(){return n.onPropsChange()})),!isNaN(r)&&3===String(r).length&&t<3&&this["_input-".concat(t+1)].focus()}},{key:"handleKeyDown",value:function(e,t){var n=t;(37===e.keyCode||8===e.keyCode)&&0===i(e.target).end&&t>0&&(n=t-1),39===e.keyCode&&i(e.target).end===e.target.value.length&&t<3&&(n=t+1),110!==e.keyCode&&190!==e.keyCode||(e.preventDefault(),t<3&&(n=t+1)),this["_input-".concat(n)].focus()}},{key:"handlePaste",value:function(e,t){var n=this;if(e.clipboardData&&e.clipboardData.getData){var r=e.clipboardData.getData("text/plain");if(r){var o=r.split(".").map((function(e){return parseInt(e)}));if(o.length===4-t&&o.every(c)){var a=this.state.value;return o.forEach((function(e,n){a[t+n]=e})),this.setState({value:a},(function(){return n.onPropsChange()})),e.preventDefault()}}}}},{key:"onPropsChange",value:function(){var e=this.state.value.map((function(e){return isNaN(e)?"":e})).join(".");return this.props.onChange(e)}},{key:"render",value:function(){var e=this,n=this.state.value,r=n.map((function(e){return isNaN(e)?"":e})).join("."),o=["react-ip-input",this.props.className,this.props.isError(r)?"has-error":""].join(" ");return t().createElement("div",{className:o},n.map((function(n,r){return t().createElement("div",{className:"react-ip-input__item",key:r},t().createElement("input",{ref:function(t){return e["_input-".concat(r)]=t},type:"text",value:isNaN(n)?"":n,onChange:function(t){return e.handleChange(t,r)},onKeyDown:function(t){return e.handleKeyDown(t,r)},onPaste:function(t){return e.handlePaste(t,r)}}),3!==r&&t().createElement("i",null,"."))})))}}])&&w(n.prototype,r),Object.defineProperty(n,"prototype",{writable:!1}),s}(t().Component);S(k,"defaultProps",{className:"",defaultValue:"...",isError:function(){return!1},onChange:function(){}}),S(k,"propTypes",{className:a().string,defaultValue:a().string||a().array,isError:a().func,onChange:a().func})})(),module.exports=r})();
//# sourceMappingURL=iput.js.map