(self["webpackChunkdashboard_react"] = self["webpackChunkdashboard_react"] || []).push([["main-5a94f17d"],{ /***/ 2694: /***/ ((module, __unused_webpack_exports, __webpack_require__) => { "use strict"; /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ReactPropTypesSecret = __webpack_require__(6925); function emptyFunction() {} function emptyFunctionWithReset() {} emptyFunctionWithReset.resetWarningCache = emptyFunction; module.exports = function() { function shim(props, propName, componentName, location, propFullName, secret) { if (secret === ReactPropTypesSecret) { // It is still safe when called from React. return; } var err = 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' ); err.name = 'Invariant Violation'; throw err; }; shim.isRequired = shim; function getShim() { return shim; }; // Important! // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`. var ReactPropTypes = { array: shim, bigint: shim, bool: shim, func: shim, number: shim, object: shim, string: shim, symbol: shim, any: shim, arrayOf: getShim, element: shim, elementType: shim, instanceOf: getShim, node: shim, objectOf: getShim, oneOf: getShim, oneOfType: getShim, shape: getShim, exact: getShim, checkPropTypes: emptyFunctionWithReset, resetWarningCache: emptyFunction }; ReactPropTypes.PropTypes = ReactPropTypes; return ReactPropTypes; }; /***/ }), /***/ 5556: /***/ ((module, __unused_webpack_exports, __webpack_require__) => { /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ if (false) { var throwOnDirectAccess, ReactIs; } else { // By explicitly using `prop-types` you are opting into new production behavior. // http://fb.me/prop-types-in-prod module.exports = __webpack_require__(2694)(); } /***/ }), /***/ 6925: /***/ ((module) => { "use strict"; /** * Copyright (c) 2013-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; module.exports = ReactPropTypesSecret; /***/ }), /***/ 8323: /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; var __webpack_unused_export__; __webpack_unused_export__ = ({ value: true }); var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; __webpack_unused_export__ = load; __webpack_unused_export__ = loadAll; __webpack_unused_export__ = select; __webpack_unused_export__ = save; __webpack_unused_export__ = remove; __webpack_unused_export__ = setRawCookie; __webpack_unused_export__ = plugToRequest; var _cookie = __webpack_require__(2944); var _cookie2 = _interopRequireDefault(_cookie); var _objectAssign = __webpack_require__(5228); var _objectAssign2 = _interopRequireDefault(_objectAssign); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var IS_NODE = typeof document === 'undefined' || typeof process !== 'undefined' && "MISSING_ENV_VAR" && "production" === 'test'; var _rawCookie = {}; var _res = void 0; function _isResWritable() { return _res && !_res.headersSent; } function load(name, doNotParse) { var cookies = IS_NODE ? _rawCookie : _cookie2.default.parse(document.cookie); var cookieVal = cookies && cookies[name]; if (typeof doNotParse === 'undefined') { doNotParse = !cookieVal || cookieVal[0] !== '{' && cookieVal[0] !== '['; } if (!doNotParse) { try { cookieVal = JSON.parse(cookieVal); } catch (err) { // Not serialized object } } return cookieVal; } function loadAll(doNotParse) { var cookies = IS_NODE ? _rawCookie : _cookie2.default.parse(document.cookie); var cookieVal = cookies; if (typeof doNotParse === 'undefined') { doNotParse = !cookieVal || cookieVal[0] !== '{' && cookieVal[0] !== '['; } if (!doNotParse) { try { cookieVal = JSON.parse(cookieVal); } catch (err) { // Not serialized object } } return cookieVal; } function select(regex) { var cookies = IS_NODE ? _rawCookie : _cookie2.default.parse(document.cookie); if (!cookies) { return {}; } if (!regex) { return cookies; } return Object.keys(cookies).reduce(function (accumulator, name) { if (!regex.test(name)) { return accumulator; } var newCookie = {}; newCookie[name] = cookies[name]; return (0, _objectAssign2.default)({}, accumulator, newCookie); }, {}); } function save(name, val, opt) { _rawCookie[name] = val; // Allow you to work with cookies as objects. if ((typeof val === 'undefined' ? 'undefined' : _typeof(val)) === 'object') { _rawCookie[name] = JSON.stringify(val); } // Cookies only work in the browser if (!IS_NODE) { document.cookie = _cookie2.default.serialize(name, _rawCookie[name], opt); } if (_isResWritable() && _res.cookie) { _res.cookie(name, val, opt); } } function remove(name, opt) { delete _rawCookie[name]; if (typeof opt === 'undefined') { opt = {}; } else if (typeof opt === 'string') { // Will be deprecated in future versions opt = { path: opt }; } else { // Prevent mutation of opt below opt = (0, _objectAssign2.default)({}, opt); } if (typeof document !== 'undefined') { opt.expires = new Date(1970, 1, 1, 0, 0, 1); opt.maxAge = 0; document.cookie = _cookie2.default.serialize(name, '', opt); } if (_isResWritable() && _res.clearCookie) { _res.clearCookie(name, opt); } } function setRawCookie(rawCookie) { if (rawCookie) { _rawCookie = _cookie2.default.parse(rawCookie); } else { _rawCookie = {}; } } function plugToRequest(req, res) { if (req.cookie) { _rawCookie = req.cookie; } else if (req.cookies) { _rawCookie = req.cookies; } else if (req.headers && req.headers.cookie) { setRawCookie(req.headers.cookie); } else { _rawCookie = {}; } _res = res; return function unplug() { _res = null; _rawCookie = {}; }; } exports.Ay = { setRawCookie: setRawCookie, load: load, loadAll: loadAll, select: select, save: save, remove: remove, plugToRequest: plugToRequest }; /***/ }), /***/ 2944: /***/ ((__unused_webpack_module, exports) => { "use strict"; /*! * cookie * Copyright(c) 2012-2014 Roman Shtylman * Copyright(c) 2015 Douglas Christopher Wilson * MIT Licensed */ /** * Module exports. * @public */ exports.parse = parse; exports.serialize = serialize; /** * Module variables. * @private */ var decode = decodeURIComponent; var encode = encodeURIComponent; var pairSplitRegExp = /; */; /** * RegExp to match field-content in RFC 7230 sec 3.2 * * field-content = field-vchar [ 1*( SP / HTAB ) field-vchar ] * field-vchar = VCHAR / obs-text * obs-text = %x80-FF */ var fieldContentRegExp = /^[\u0009\u0020-\u007e\u0080-\u00ff]+$/; /** * Parse a cookie header. * * Parse the given cookie header string into an object * The object has the various cookies as keys(names) => values * * @param {string} str * @param {object} [options] * @return {object} * @public */ function parse(str, options) { if (typeof str !== 'string') { throw new TypeError('argument str must be a string'); } var obj = {} var opt = options || {}; var pairs = str.split(pairSplitRegExp); var dec = opt.decode || decode; for (var i = 0; i < pairs.length; i++) { var pair = pairs[i]; var eq_idx = pair.indexOf('='); // skip things that don't look like key=value if (eq_idx < 0) { continue; } var key = pair.substr(0, eq_idx).trim() var val = pair.substr(++eq_idx, pair.length).trim(); // quoted values if ('"' == val[0]) { val = val.slice(1, -1); } // only assign once if (undefined == obj[key]) { obj[key] = tryDecode(val, dec); } } return obj; } /** * Serialize data into a cookie header. * * Serialize the a name value pair into a cookie string suitable for * http headers. An optional options object specified cookie parameters. * * serialize('foo', 'bar', { httpOnly: true }) * => "foo=bar; httpOnly" * * @param {string} name * @param {string} val * @param {object} [options] * @return {string} * @public */ function serialize(name, val, options) { var opt = options || {}; var enc = opt.encode || encode; if (typeof enc !== 'function') { throw new TypeError('option encode is invalid'); } if (!fieldContentRegExp.test(name)) { throw new TypeError('argument name is invalid'); } var value = enc(val); if (value && !fieldContentRegExp.test(value)) { throw new TypeError('argument val is invalid'); } var str = name + '=' + value; if (null != opt.maxAge) { var maxAge = opt.maxAge - 0; if (isNaN(maxAge)) throw new Error('maxAge should be a Number'); str += '; Max-Age=' + Math.floor(maxAge); } if (opt.domain) { if (!fieldContentRegExp.test(opt.domain)) { throw new TypeError('option domain is invalid'); } str += '; Domain=' + opt.domain; } if (opt.path) { if (!fieldContentRegExp.test(opt.path)) { throw new TypeError('option path is invalid'); } str += '; Path=' + opt.path; } if (opt.expires) { if (typeof opt.expires.toUTCString !== 'function') { throw new TypeError('option expires is invalid'); } str += '; Expires=' + opt.expires.toUTCString(); } if (opt.httpOnly) { str += '; HttpOnly'; } if (opt.secure) { str += '; Secure'; } if (opt.sameSite) { var sameSite = typeof opt.sameSite === 'string' ? opt.sameSite.toLowerCase() : opt.sameSite; switch (sameSite) { case true: str += '; SameSite=Strict'; break; case 'lax': str += '; SameSite=Lax'; break; case 'strict': str += '; SameSite=Strict'; break; default: throw new TypeError('option sameSite is invalid'); } } return str; } /** * Try decoding a string using a decoding function. * * @param {string} str * @param {function} decode * @private */ function tryDecode(str, decode) { try { return decode(str); } catch (e) { return str; } } /***/ }), /***/ 2551: /***/ ((__unused_webpack_module, exports, __webpack_require__) => { "use strict"; /** * @license React * react-dom.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ /* Modernizr 3.0.0pre (Custom Build) | MIT */ var aa=__webpack_require__(6540),ca=__webpack_require__(9982);function p(a){for(var b="https://reactjs.org/docs/error-decoder.html?invariant="+a,c=1;cb}return!1}function v(a,b,c,d,e,f,g){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=e;this.mustUseProperty=c;this.propertyName=a;this.type=b;this.sanitizeURL=f;this.removeEmptyString=g}var z={}; "children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(a){z[a]=new v(a,0,!1,a,null,!1,!1)});[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(a){var b=a[0];z[b]=new v(b,1,!1,a[1],null,!1,!1)});["contentEditable","draggable","spellCheck","value"].forEach(function(a){z[a]=new v(a,2,!1,a.toLowerCase(),null,!1,!1)}); ["autoReverse","externalResourcesRequired","focusable","preserveAlpha"].forEach(function(a){z[a]=new v(a,2,!1,a,null,!1,!1)});"allowFullScreen async autoFocus autoPlay controls default defer disabled disablePictureInPicture disableRemotePlayback formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope".split(" ").forEach(function(a){z[a]=new v(a,3,!1,a.toLowerCase(),null,!1,!1)}); ["checked","multiple","muted","selected"].forEach(function(a){z[a]=new v(a,3,!0,a,null,!1,!1)});["capture","download"].forEach(function(a){z[a]=new v(a,4,!1,a,null,!1,!1)});["cols","rows","size","span"].forEach(function(a){z[a]=new v(a,6,!1,a,null,!1,!1)});["rowSpan","start"].forEach(function(a){z[a]=new v(a,5,!1,a.toLowerCase(),null,!1,!1)});var ra=/[\-:]([a-z])/g;function sa(a){return a[1].toUpperCase()} "accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach(function(a){var b=a.replace(ra, sa);z[b]=new v(b,1,!1,a,null,!1,!1)});"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type".split(" ").forEach(function(a){var b=a.replace(ra,sa);z[b]=new v(b,1,!1,a,"http://www.w3.org/1999/xlink",!1,!1)});["xml:base","xml:lang","xml:space"].forEach(function(a){var b=a.replace(ra,sa);z[b]=new v(b,1,!1,a,"http://www.w3.org/XML/1998/namespace",!1,!1)});["tabIndex","crossOrigin"].forEach(function(a){z[a]=new v(a,1,!1,a.toLowerCase(),null,!1,!1)}); z.xlinkHref=new v("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1);["src","href","action","formAction"].forEach(function(a){z[a]=new v(a,1,!1,a.toLowerCase(),null,!0,!0)}); function ta(a,b,c,d){var e=z.hasOwnProperty(b)?z[b]:null;if(null!==e?0!==e.type:d||!(2h||e[g]!==f[h]){var k="\n"+e[g].replace(" at new "," at ");a.displayName&&k.includes("")&&(k=k.replace("",a.displayName));return k}while(1<=g&&0<=h)}break}}}finally{Na=!1,Error.prepareStackTrace=c}return(a=a?a.displayName||a.name:"")?Ma(a):""} function Pa(a){switch(a.tag){case 5:return Ma(a.type);case 16:return Ma("Lazy");case 13:return Ma("Suspense");case 19:return Ma("SuspenseList");case 0:case 2:case 15:return a=Oa(a.type,!1),a;case 11:return a=Oa(a.type.render,!1),a;case 1:return a=Oa(a.type,!0),a;default:return""}} function Qa(a){if(null==a)return null;if("function"===typeof a)return a.displayName||a.name||null;if("string"===typeof a)return a;switch(a){case ya:return"Fragment";case wa:return"Portal";case Aa:return"Profiler";case za:return"StrictMode";case Ea:return"Suspense";case Fa:return"SuspenseList"}if("object"===typeof a)switch(a.$$typeof){case Ca:return(a.displayName||"Context")+".Consumer";case Ba:return(a._context.displayName||"Context")+".Provider";case Da:var b=a.render;a=a.displayName;a||(a=b.displayName|| b.name||"",a=""!==a?"ForwardRef("+a+")":"ForwardRef");return a;case Ga:return b=a.displayName||null,null!==b?b:Qa(a.type)||"Memo";case Ha:b=a._payload;a=a._init;try{return Qa(a(b))}catch(c){}}return null} function Ra(a){var b=a.type;switch(a.tag){case 24:return"Cache";case 9:return(b.displayName||"Context")+".Consumer";case 10:return(b._context.displayName||"Context")+".Provider";case 18:return"DehydratedFragment";case 11:return a=b.render,a=a.displayName||a.name||"",b.displayName||(""!==a?"ForwardRef("+a+")":"ForwardRef");case 7:return"Fragment";case 5:return b;case 4:return"Portal";case 3:return"Root";case 6:return"Text";case 16:return Qa(b);case 8:return b===za?"StrictMode":"Mode";case 22:return"Offscreen"; case 12:return"Profiler";case 21:return"Scope";case 13:return"Suspense";case 19:return"SuspenseList";case 25:return"TracingMarker";case 1:case 0:case 17:case 2:case 14:case 15:if("function"===typeof b)return b.displayName||b.name||null;if("string"===typeof b)return b}return null}function Sa(a){switch(typeof a){case "boolean":case "number":case "string":case "undefined":return a;case "object":return a;default:return""}} function Ta(a){var b=a.type;return(a=a.nodeName)&&"input"===a.toLowerCase()&&("checkbox"===b||"radio"===b)} function Ua(a){var b=Ta(a)?"checked":"value",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=""+a[b];if(!a.hasOwnProperty(b)&&"undefined"!==typeof c&&"function"===typeof c.get&&"function"===typeof c.set){var e=c.get,f=c.set;Object.defineProperty(a,b,{configurable:!0,get:function(){return e.call(this)},set:function(a){d=""+a;f.call(this,a)}});Object.defineProperty(a,b,{enumerable:c.enumerable});return{getValue:function(){return d},setValue:function(a){d=""+a},stopTracking:function(){a._valueTracker= null;delete a[b]}}}}function Va(a){a._valueTracker||(a._valueTracker=Ua(a))}function Wa(a){if(!a)return!1;var b=a._valueTracker;if(!b)return!0;var c=b.getValue();var d="";a&&(d=Ta(a)?a.checked?"true":"false":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}function Xa(a){a=a||("undefined"!==typeof document?document:void 0);if("undefined"===typeof a)return null;try{return a.activeElement||a.body}catch(b){return a.body}} function Ya(a,b){var c=b.checked;return A({},b,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=c?c:a._wrapperState.initialChecked})}function Za(a,b){var c=null==b.defaultValue?"":b.defaultValue,d=null!=b.checked?b.checked:b.defaultChecked;c=Sa(null!=b.value?b.value:c);a._wrapperState={initialChecked:d,initialValue:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value}}function ab(a,b){b=b.checked;null!=b&&ta(a,"checked",b,!1)} function bb(a,b){ab(a,b);var c=Sa(b.value),d=b.type;if(null!=c)if("number"===d){if(0===c&&""===a.value||a.value!=c)a.value=""+c}else a.value!==""+c&&(a.value=""+c);else if("submit"===d||"reset"===d){a.removeAttribute("value");return}b.hasOwnProperty("value")?cb(a,b.type,c):b.hasOwnProperty("defaultValue")&&cb(a,b.type,Sa(b.defaultValue));null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)} function db(a,b,c){if(b.hasOwnProperty("value")||b.hasOwnProperty("defaultValue")){var d=b.type;if(!("submit"!==d&&"reset"!==d||void 0!==b.value&&null!==b.value))return;b=""+a._wrapperState.initialValue;c||b===a.value||(a.value=b);a.defaultValue=b}c=a.name;""!==c&&(a.name="");a.defaultChecked=!!a._wrapperState.initialChecked;""!==c&&(a.name=c)} function cb(a,b,c){if("number"!==b||Xa(a.ownerDocument)!==a)null==c?a.defaultValue=""+a._wrapperState.initialValue:a.defaultValue!==""+c&&(a.defaultValue=""+c)}var eb=Array.isArray; function fb(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e"+b.valueOf().toString()+"";for(b=mb.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild)}}); function ob(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b} var pb={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0, zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},qb=["Webkit","ms","Moz","O"];Object.keys(pb).forEach(function(a){qb.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);pb[b]=pb[a]})});function rb(a,b,c){return null==b||"boolean"===typeof b||""===b?"":c||"number"!==typeof b||0===b||pb.hasOwnProperty(a)&&pb[a]?(""+b).trim():b+"px"} function sb(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf("--"),e=rb(c,b[c],d);"float"===c&&(c="cssFloat");d?a.setProperty(c,e):a[c]=e}}var tb=A({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0}); function ub(a,b){if(b){if(tb[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML))throw Error(p(137,a));if(null!=b.dangerouslySetInnerHTML){if(null!=b.children)throw Error(p(60));if("object"!==typeof b.dangerouslySetInnerHTML||!("__html"in b.dangerouslySetInnerHTML))throw Error(p(61));}if(null!=b.style&&"object"!==typeof b.style)throw Error(p(62));}} function vb(a,b){if(-1===a.indexOf("-"))return"string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return!1;default:return!0}}var wb=null;function xb(a){a=a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}var yb=null,zb=null,Ab=null; function Bb(a){if(a=Cb(a)){if("function"!==typeof yb)throw Error(p(280));var b=a.stateNode;b&&(b=Db(b),yb(a.stateNode,a.type,b))}}function Eb(a){zb?Ab?Ab.push(a):Ab=[a]:zb=a}function Fb(){if(zb){var a=zb,b=Ab;Ab=zb=null;Bb(a);if(b)for(a=0;a>>=0;return 0===a?32:31-(pc(a)/qc|0)|0}var rc=64,sc=4194304; function tc(a){switch(a&-a){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return a&4194240;case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:return a&130023424;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 1073741824; default:return a}}function uc(a,b){var c=a.pendingLanes;if(0===c)return 0;var d=0,e=a.suspendedLanes,f=a.pingedLanes,g=c&268435455;if(0!==g){var h=g&~e;0!==h?d=tc(h):(f&=g,0!==f&&(d=tc(f)))}else g=c&~e,0!==g?d=tc(g):0!==f&&(d=tc(f));if(0===d)return 0;if(0!==b&&b!==d&&0===(b&e)&&(e=d&-d,f=b&-b,e>=f||16===e&&0!==(f&4194240)))return b;0!==(d&4)&&(d|=c&16);b=a.entangledLanes;if(0!==b)for(a=a.entanglements,b&=d;0c;c++)b.push(a);return b} function Ac(a,b,c){a.pendingLanes|=b;536870912!==b&&(a.suspendedLanes=0,a.pingedLanes=0);a=a.eventTimes;b=31-oc(b);a[b]=c}function Bc(a,b){var c=a.pendingLanes&~b;a.pendingLanes=b;a.suspendedLanes=0;a.pingedLanes=0;a.expiredLanes&=b;a.mutableReadLanes&=b;a.entangledLanes&=b;b=a.entanglements;var d=a.eventTimes;for(a=a.expirationTimes;0=be),ee=String.fromCharCode(32),fe=!1; function ge(a,b){switch(a){case "keyup":return-1!==$d.indexOf(b.keyCode);case "keydown":return 229!==b.keyCode;case "keypress":case "mousedown":case "focusout":return!0;default:return!1}}function he(a){a=a.detail;return"object"===typeof a&&"data"in a?a.data:null}var ie=!1;function je(a,b){switch(a){case "compositionend":return he(b);case "keypress":if(32!==b.which)return null;fe=!0;return ee;case "textInput":return a=b.data,a===ee&&fe?null:a;default:return null}} function ke(a,b){if(ie)return"compositionend"===a||!ae&&ge(a,b)?(a=nd(),md=ld=kd=null,ie=!1,a):null;switch(a){case "paste":return null;case "keypress":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode}c=void 0}c=Je(c)}}function Le(a,b){return a&&b?a===b?!0:a&&3===a.nodeType?!1:b&&3===b.nodeType?Le(a,b.parentNode):"contains"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1} function Me(){for(var a=window,b=Xa();b instanceof a.HTMLIFrameElement;){try{var c="string"===typeof b.contentWindow.location.href}catch(d){c=!1}if(c)a=b.contentWindow;else break;b=Xa(a.document)}return b}function Ne(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&("text"===a.type||"search"===a.type||"tel"===a.type||"url"===a.type||"password"===a.type)||"textarea"===b||"true"===a.contentEditable)} function Oe(a){var b=Me(),c=a.focusedElem,d=a.selectionRange;if(b!==c&&c&&c.ownerDocument&&Le(c.ownerDocument.documentElement,c)){if(null!==d&&Ne(c))if(b=d.start,a=d.end,void 0===a&&(a=b),"selectionStart"in c)c.selectionStart=b,c.selectionEnd=Math.min(a,c.value.length);else if(a=(b=c.ownerDocument||document)&&b.defaultView||window,a.getSelection){a=a.getSelection();var e=c.textContent.length,f=Math.min(d.start,e);d=void 0===d.end?f:Math.min(d.end,e);!a.extend&&f>d&&(e=d,d=f,f=e);e=Ke(c,f);var g=Ke(c, d);e&&g&&(1!==a.rangeCount||a.anchorNode!==e.node||a.anchorOffset!==e.offset||a.focusNode!==g.node||a.focusOffset!==g.offset)&&(b=b.createRange(),b.setStart(e.node,e.offset),a.removeAllRanges(),f>d?(a.addRange(b),a.extend(g.node,g.offset)):(b.setEnd(g.node,g.offset),a.addRange(b)))}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});"function"===typeof c.focus&&c.focus();for(c=0;c=document.documentMode,Qe=null,Re=null,Se=null,Te=!1; function Ue(a,b,c){var d=c.window===c?c.document:9===c.nodeType?c:c.ownerDocument;Te||null==Qe||Qe!==Xa(d)||(d=Qe,"selectionStart"in d&&Ne(d)?d={start:d.selectionStart,end:d.selectionEnd}:(d=(d.ownerDocument&&d.ownerDocument.defaultView||window).getSelection(),d={anchorNode:d.anchorNode,anchorOffset:d.anchorOffset,focusNode:d.focusNode,focusOffset:d.focusOffset}),Se&&Ie(Se,d)||(Se=d,d=oe(Re,"onSelect"),0Tf||(a.current=Sf[Tf],Sf[Tf]=null,Tf--)}function G(a,b){Tf++;Sf[Tf]=a.current;a.current=b}var Vf={},H=Uf(Vf),Wf=Uf(!1),Xf=Vf;function Yf(a,b){var c=a.type.contextTypes;if(!c)return Vf;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e} function Zf(a){a=a.childContextTypes;return null!==a&&void 0!==a}function $f(){E(Wf);E(H)}function ag(a,b,c){if(H.current!==Vf)throw Error(p(168));G(H,b);G(Wf,c)}function bg(a,b,c){var d=a.stateNode;b=b.childContextTypes;if("function"!==typeof d.getChildContext)return c;d=d.getChildContext();for(var e in d)if(!(e in b))throw Error(p(108,Ra(a)||"Unknown",e));return A({},c,d)} function cg(a){a=(a=a.stateNode)&&a.__reactInternalMemoizedMergedChildContext||Vf;Xf=H.current;G(H,a);G(Wf,Wf.current);return!0}function dg(a,b,c){var d=a.stateNode;if(!d)throw Error(p(169));c?(a=bg(a,b,Xf),d.__reactInternalMemoizedMergedChildContext=a,E(Wf),E(H),G(H,a)):E(Wf);G(Wf,c)}var eg=null,fg=!1,gg=!1;function hg(a){null===eg?eg=[a]:eg.push(a)}function ig(a){fg=!0;hg(a)} function jg(){if(!gg&&null!==eg){gg=!0;var a=0,b=C;try{var c=eg;for(C=1;a>=g;e-=g;rg=1<<32-oc(b)+e|c<w?(x=u,u=null):x=u.sibling;var n=r(e,u,h[w],k);if(null===n){null===u&&(u=x);break}a&&u&&null===n.alternate&&b(e,u);g=f(n,g,w);null===m?l=n:m.sibling=n;m=n;u=x}if(w===h.length)return c(e,u),I&&tg(e,w),l;if(null===u){for(;ww?(x=m,m=null):x=m.sibling;var t=r(e,m,n.value,k);if(null===t){null===m&&(m=x);break}a&&m&&null===t.alternate&&b(e,m);g=f(t,g,w);null===u?l=t:u.sibling=t;u=t;m=x}if(n.done)return c(e, m),I&&tg(e,w),l;if(null===m){for(;!n.done;w++,n=h.next())n=q(e,n.value,k),null!==n&&(g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);I&&tg(e,w);return l}for(m=d(e,m);!n.done;w++,n=h.next())n=y(m,e,w,n.value,k),null!==n&&(a&&null!==n.alternate&&m.delete(null===n.key?w:n.key),g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);a&&m.forEach(function(a){return b(e,a)});I&&tg(e,w);return l}function J(a,d,f,h){"object"===typeof f&&null!==f&&f.type===ya&&null===f.key&&(f=f.props.children);if("object"===typeof f&&null!==f){switch(f.$$typeof){case va:a:{for(var k= f.key,l=d;null!==l;){if(l.key===k){k=f.type;if(k===ya){if(7===l.tag){c(a,l.sibling);d=e(l,f.props.children);d.return=a;a=d;break a}}else if(l.elementType===k||"object"===typeof k&&null!==k&&k.$$typeof===Ha&&Ng(k)===l.type){c(a,l.sibling);d=e(l,f.props);d.ref=Lg(a,l,f);d.return=a;a=d;break a}c(a,l);break}else b(a,l);l=l.sibling}f.type===ya?(d=Tg(f.props.children,a.mode,h,f.key),d.return=a,a=d):(h=Rg(f.type,f.key,f.props,null,a.mode,h),h.ref=Lg(a,d,f),h.return=a,a=h)}return g(a);case wa:a:{for(l=f.key;null!== d;){if(d.key===l)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[]);d.return=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=Sg(f,a.mode,h);d.return=a;a=d}return g(a);case Ha:return l=f._init,J(a,d,l(f._payload),h)}if(eb(f))return n(a,d,f,h);if(Ka(f))return t(a,d,f,h);Mg(a,f)}return"string"===typeof f&&""!==f||"number"===typeof f?(f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f),d.return=a,a=d): (c(a,d),d=Qg(f,a.mode,h),d.return=a,a=d),g(a)):c(a,d)}return J}var Ug=Og(!0),Vg=Og(!1),Wg=Uf(null),Xg=null,Yg=null,Zg=null;function $g(){Zg=Yg=Xg=null}function ah(a){var b=Wg.current;E(Wg);a._currentValue=b}function bh(a,b,c){for(;null!==a;){var d=a.alternate;(a.childLanes&b)!==b?(a.childLanes|=b,null!==d&&(d.childLanes|=b)):null!==d&&(d.childLanes&b)!==b&&(d.childLanes|=b);if(a===c)break;a=a.return}} function ch(a,b){Xg=a;Zg=Yg=null;a=a.dependencies;null!==a&&null!==a.firstContext&&(0!==(a.lanes&b)&&(dh=!0),a.firstContext=null)}function eh(a){var b=a._currentValue;if(Zg!==a)if(a={context:a,memoizedValue:b,next:null},null===Yg){if(null===Xg)throw Error(p(308));Yg=a;Xg.dependencies={lanes:0,firstContext:a}}else Yg=Yg.next=a;return b}var fh=null;function gh(a){null===fh?fh=[a]:fh.push(a)} function hh(a,b,c,d){var e=b.interleaved;null===e?(c.next=c,gh(b)):(c.next=e.next,e.next=c);b.interleaved=c;return ih(a,d)}function ih(a,b){a.lanes|=b;var c=a.alternate;null!==c&&(c.lanes|=b);c=a;for(a=a.return;null!==a;)a.childLanes|=b,c=a.alternate,null!==c&&(c.childLanes|=b),c=a,a=a.return;return 3===c.tag?c.stateNode:null}var jh=!1;function kh(a){a.updateQueue={baseState:a.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,interleaved:null,lanes:0},effects:null}} function lh(a,b){a=a.updateQueue;b.updateQueue===a&&(b.updateQueue={baseState:a.baseState,firstBaseUpdate:a.firstBaseUpdate,lastBaseUpdate:a.lastBaseUpdate,shared:a.shared,effects:a.effects})}function mh(a,b){return{eventTime:a,lane:b,tag:0,payload:null,callback:null,next:null}} function nh(a,b,c){var d=a.updateQueue;if(null===d)return null;d=d.shared;if(0!==(K&2)){var e=d.pending;null===e?b.next=b:(b.next=e.next,e.next=b);d.pending=b;return ih(a,c)}e=d.interleaved;null===e?(b.next=b,gh(d)):(b.next=e.next,e.next=b);d.interleaved=b;return ih(a,c)}function oh(a,b,c){b=b.updateQueue;if(null!==b&&(b=b.shared,0!==(c&4194240))){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c)}} function ph(a,b){var c=a.updateQueue,d=a.alternate;if(null!==d&&(d=d.updateQueue,c===d)){var e=null,f=null;c=c.firstBaseUpdate;if(null!==c){do{var g={eventTime:c.eventTime,lane:c.lane,tag:c.tag,payload:c.payload,callback:c.callback,next:null};null===f?e=f=g:f=f.next=g;c=c.next}while(null!==c);null===f?e=f=b:f=f.next=b}else e=f=b;c={baseState:d.baseState,firstBaseUpdate:e,lastBaseUpdate:f,shared:d.shared,effects:d.effects};a.updateQueue=c;return}a=c.lastBaseUpdate;null===a?c.firstBaseUpdate=b:a.next= b;c.lastBaseUpdate=b} function qh(a,b,c,d){var e=a.updateQueue;jh=!1;var f=e.firstBaseUpdate,g=e.lastBaseUpdate,h=e.shared.pending;if(null!==h){e.shared.pending=null;var k=h,l=k.next;k.next=null;null===g?f=l:g.next=l;g=k;var m=a.alternate;null!==m&&(m=m.updateQueue,h=m.lastBaseUpdate,h!==g&&(null===h?m.firstBaseUpdate=l:h.next=l,m.lastBaseUpdate=k))}if(null!==f){var q=e.baseState;g=0;m=l=k=null;h=f;do{var r=h.lane,y=h.eventTime;if((d&r)===r){null!==m&&(m=m.next={eventTime:y,lane:0,tag:h.tag,payload:h.payload,callback:h.callback, next:null});a:{var n=a,t=h;r=b;y=c;switch(t.tag){case 1:n=t.payload;if("function"===typeof n){q=n.call(y,q,r);break a}q=n;break a;case 3:n.flags=n.flags&-65537|128;case 0:n=t.payload;r="function"===typeof n?n.call(y,q,r):n;if(null===r||void 0===r)break a;q=A({},q,r);break a;case 2:jh=!0}}null!==h.callback&&0!==h.lane&&(a.flags|=64,r=e.effects,null===r?e.effects=[h]:r.push(h))}else y={eventTime:y,lane:r,tag:h.tag,payload:h.payload,callback:h.callback,next:null},null===m?(l=m=y,k=q):m=m.next=y,g|=r; h=h.next;if(null===h)if(h=e.shared.pending,null===h)break;else r=h,h=r.next,r.next=null,e.lastBaseUpdate=r,e.shared.pending=null}while(1);null===m&&(k=q);e.baseState=k;e.firstBaseUpdate=l;e.lastBaseUpdate=m;b=e.shared.interleaved;if(null!==b){e=b;do g|=e.lane,e=e.next;while(e!==b)}else null===f&&(e.shared.lanes=0);rh|=g;a.lanes=g;a.memoizedState=q}} function sh(a,b,c){a=b.effects;b.effects=null;if(null!==a)for(b=0;bc?c:4;a(!0);var d=Gh.transition;Gh.transition={};try{a(!1),b()}finally{C=c,Gh.transition=d}}function wi(){return Uh().memoizedState} function xi(a,b,c){var d=yi(a);c={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(zi(a))Ai(b,c);else if(c=hh(a,b,c,d),null!==c){var e=R();gi(c,a,d,e);Bi(c,b,d)}} function ii(a,b,c){var d=yi(a),e={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(zi(a))Ai(b,e);else{var f=a.alternate;if(0===a.lanes&&(null===f||0===f.lanes)&&(f=b.lastRenderedReducer,null!==f))try{var g=b.lastRenderedState,h=f(g,c);e.hasEagerState=!0;e.eagerState=h;if(He(h,g)){var k=b.interleaved;null===k?(e.next=e,gh(b)):(e.next=k.next,k.next=e);b.interleaved=e;return}}catch(l){}finally{}c=hh(a,b,e,d);null!==c&&(e=R(),gi(c,a,d,e),Bi(c,b,d))}} function zi(a){var b=a.alternate;return a===M||null!==b&&b===M}function Ai(a,b){Jh=Ih=!0;var c=a.pending;null===c?b.next=b:(b.next=c.next,c.next=b);a.pending=b}function Bi(a,b,c){if(0!==(c&4194240)){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c)}} var Rh={readContext:eh,useCallback:P,useContext:P,useEffect:P,useImperativeHandle:P,useInsertionEffect:P,useLayoutEffect:P,useMemo:P,useReducer:P,useRef:P,useState:P,useDebugValue:P,useDeferredValue:P,useTransition:P,useMutableSource:P,useSyncExternalStore:P,useId:P,unstable_isNewReconciler:!1},Oh={readContext:eh,useCallback:function(a,b){Th().memoizedState=[a,void 0===b?null:b];return a},useContext:eh,useEffect:mi,useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return ki(4194308, 4,pi.bind(null,b,a),c)},useLayoutEffect:function(a,b){return ki(4194308,4,a,b)},useInsertionEffect:function(a,b){return ki(4,2,a,b)},useMemo:function(a,b){var c=Th();b=void 0===b?null:b;a=a();c.memoizedState=[a,b];return a},useReducer:function(a,b,c){var d=Th();b=void 0!==c?c(b):b;d.memoizedState=d.baseState=b;a={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:a,lastRenderedState:b};d.queue=a;a=a.dispatch=xi.bind(null,M,a);return[d.memoizedState,a]},useRef:function(a){var b= Th();a={current:a};return b.memoizedState=a},useState:hi,useDebugValue:ri,useDeferredValue:function(a){return Th().memoizedState=a},useTransition:function(){var a=hi(!1),b=a[0];a=vi.bind(null,a[1]);Th().memoizedState=a;return[b,a]},useMutableSource:function(){},useSyncExternalStore:function(a,b,c){var d=M,e=Th();if(I){if(void 0===c)throw Error(p(407));c=c()}else{c=b();if(null===Q)throw Error(p(349));0!==(Hh&30)||di(d,b,c)}e.memoizedState=c;var f={value:c,getSnapshot:b};e.queue=f;mi(ai.bind(null,d, f,a),[a]);d.flags|=2048;bi(9,ci.bind(null,d,f,c,b),void 0,null);return c},useId:function(){var a=Th(),b=Q.identifierPrefix;if(I){var c=sg;var d=rg;c=(d&~(1<<32-oc(d)-1)).toString(32)+c;b=":"+b+"R"+c;c=Kh++;0\x3c/script>",a=a.removeChild(a.firstChild)): "string"===typeof d.is?a=g.createElement(c,{is:d.is}):(a=g.createElement(c),"select"===c&&(g=a,d.multiple?g.multiple=!0:d.size&&(g.size=d.size))):a=g.createElementNS(a,c);a[Of]=b;a[Pf]=d;zj(a,b,!1,!1);b.stateNode=a;a:{g=vb(c,d);switch(c){case "dialog":D("cancel",a);D("close",a);e=d;break;case "iframe":case "object":case "embed":D("load",a);e=d;break;case "video":case "audio":for(e=0;eGj&&(b.flags|=128,d=!0,Dj(f,!1),b.lanes=4194304)}else{if(!d)if(a=Ch(g),null!==a){if(b.flags|=128,d=!0,c=a.updateQueue,null!==c&&(b.updateQueue=c,b.flags|=4),Dj(f,!0),null===f.tail&&"hidden"===f.tailMode&&!g.alternate&&!I)return S(b),null}else 2*B()-f.renderingStartTime>Gj&&1073741824!==c&&(b.flags|=128,d=!0,Dj(f,!1),b.lanes=4194304);f.isBackwards?(g.sibling=b.child,b.child=g):(c=f.last,null!==c?c.sibling=g:b.child=g,f.last=g)}if(null!==f.tail)return b=f.tail,f.rendering= b,f.tail=b.sibling,f.renderingStartTime=B(),b.sibling=null,c=L.current,G(L,d?c&1|2:c&1),b;S(b);return null;case 22:case 23:return Hj(),d=null!==b.memoizedState,null!==a&&null!==a.memoizedState!==d&&(b.flags|=8192),d&&0!==(b.mode&1)?0!==(fj&1073741824)&&(S(b),b.subtreeFlags&6&&(b.flags|=8192)):S(b),null;case 24:return null;case 25:return null}throw Error(p(156,b.tag));} function Ij(a,b){wg(b);switch(b.tag){case 1:return Zf(b.type)&&$f(),a=b.flags,a&65536?(b.flags=a&-65537|128,b):null;case 3:return zh(),E(Wf),E(H),Eh(),a=b.flags,0!==(a&65536)&&0===(a&128)?(b.flags=a&-65537|128,b):null;case 5:return Bh(b),null;case 13:E(L);a=b.memoizedState;if(null!==a&&null!==a.dehydrated){if(null===b.alternate)throw Error(p(340));Ig()}a=b.flags;return a&65536?(b.flags=a&-65537|128,b):null;case 19:return E(L),null;case 4:return zh(),null;case 10:return ah(b.type._context),null;case 22:case 23:return Hj(), null;case 24:return null;default:return null}}var Jj=!1,U=!1,Kj="function"===typeof WeakSet?WeakSet:Set,V=null;function Lj(a,b){var c=a.ref;if(null!==c)if("function"===typeof c)try{c(null)}catch(d){W(a,b,d)}else c.current=null}function Mj(a,b,c){try{c()}catch(d){W(a,b,d)}}var Nj=!1; function Oj(a,b){Cf=dd;a=Me();if(Ne(a)){if("selectionStart"in a)var c={start:a.selectionStart,end:a.selectionEnd};else a:{c=(c=a.ownerDocument)&&c.defaultView||window;var d=c.getSelection&&c.getSelection();if(d&&0!==d.rangeCount){c=d.anchorNode;var e=d.anchorOffset,f=d.focusNode;d=d.focusOffset;try{c.nodeType,f.nodeType}catch(F){c=null;break a}var g=0,h=-1,k=-1,l=0,m=0,q=a,r=null;b:for(;;){for(var y;;){q!==c||0!==e&&3!==q.nodeType||(h=g+e);q!==f||0!==d&&3!==q.nodeType||(k=g+d);3===q.nodeType&&(g+= q.nodeValue.length);if(null===(y=q.firstChild))break;r=q;q=y}for(;;){if(q===a)break b;r===c&&++l===e&&(h=g);r===f&&++m===d&&(k=g);if(null!==(y=q.nextSibling))break;q=r;r=q.parentNode}q=y}c=-1===h||-1===k?null:{start:h,end:k}}else c=null}c=c||{start:0,end:0}}else c=null;Df={focusedElem:a,selectionRange:c};dd=!1;for(V=b;null!==V;)if(b=V,a=b.child,0!==(b.subtreeFlags&1028)&&null!==a)a.return=b,V=a;else for(;null!==V;){b=V;try{var n=b.alternate;if(0!==(b.flags&1024))switch(b.tag){case 0:case 11:case 15:break; case 1:if(null!==n){var t=n.memoizedProps,J=n.memoizedState,x=b.stateNode,w=x.getSnapshotBeforeUpdate(b.elementType===b.type?t:Ci(b.type,t),J);x.__reactInternalSnapshotBeforeUpdate=w}break;case 3:var u=b.stateNode.containerInfo;1===u.nodeType?u.textContent="":9===u.nodeType&&u.documentElement&&u.removeChild(u.documentElement);break;case 5:case 6:case 4:case 17:break;default:throw Error(p(163));}}catch(F){W(b,b.return,F)}a=b.sibling;if(null!==a){a.return=b.return;V=a;break}V=b.return}n=Nj;Nj=!1;return n} function Pj(a,b,c){var d=b.updateQueue;d=null!==d?d.lastEffect:null;if(null!==d){var e=d=d.next;do{if((e.tag&a)===a){var f=e.destroy;e.destroy=void 0;void 0!==f&&Mj(b,c,f)}e=e.next}while(e!==d)}}function Qj(a,b){b=b.updateQueue;b=null!==b?b.lastEffect:null;if(null!==b){var c=b=b.next;do{if((c.tag&a)===a){var d=c.create;c.destroy=d()}c=c.next}while(c!==b)}}function Rj(a){var b=a.ref;if(null!==b){var c=a.stateNode;switch(a.tag){case 5:a=c;break;default:a=c}"function"===typeof b?b(a):b.current=a}} function Sj(a){var b=a.alternate;null!==b&&(a.alternate=null,Sj(b));a.child=null;a.deletions=null;a.sibling=null;5===a.tag&&(b=a.stateNode,null!==b&&(delete b[Of],delete b[Pf],delete b[of],delete b[Qf],delete b[Rf]));a.stateNode=null;a.return=null;a.dependencies=null;a.memoizedProps=null;a.memoizedState=null;a.pendingProps=null;a.stateNode=null;a.updateQueue=null}function Tj(a){return 5===a.tag||3===a.tag||4===a.tag} function Uj(a){a:for(;;){for(;null===a.sibling;){if(null===a.return||Tj(a.return))return null;a=a.return}a.sibling.return=a.return;for(a=a.sibling;5!==a.tag&&6!==a.tag&&18!==a.tag;){if(a.flags&2)continue a;if(null===a.child||4===a.tag)continue a;else a.child.return=a,a=a.child}if(!(a.flags&2))return a.stateNode}} function Vj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?8===c.nodeType?c.parentNode.insertBefore(a,b):c.insertBefore(a,b):(8===c.nodeType?(b=c.parentNode,b.insertBefore(a,c)):(b=c,b.appendChild(a)),c=c._reactRootContainer,null!==c&&void 0!==c||null!==b.onclick||(b.onclick=Bf));else if(4!==d&&(a=a.child,null!==a))for(Vj(a,b,c),a=a.sibling;null!==a;)Vj(a,b,c),a=a.sibling} function Wj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?c.insertBefore(a,b):c.appendChild(a);else if(4!==d&&(a=a.child,null!==a))for(Wj(a,b,c),a=a.sibling;null!==a;)Wj(a,b,c),a=a.sibling}var X=null,Xj=!1;function Yj(a,b,c){for(c=c.child;null!==c;)Zj(a,b,c),c=c.sibling} function Zj(a,b,c){if(lc&&"function"===typeof lc.onCommitFiberUnmount)try{lc.onCommitFiberUnmount(kc,c)}catch(h){}switch(c.tag){case 5:U||Lj(c,b);case 6:var d=X,e=Xj;X=null;Yj(a,b,c);X=d;Xj=e;null!==X&&(Xj?(a=X,c=c.stateNode,8===a.nodeType?a.parentNode.removeChild(c):a.removeChild(c)):X.removeChild(c.stateNode));break;case 18:null!==X&&(Xj?(a=X,c=c.stateNode,8===a.nodeType?Kf(a.parentNode,c):1===a.nodeType&&Kf(a,c),bd(a)):Kf(X,c.stateNode));break;case 4:d=X;e=Xj;X=c.stateNode.containerInfo;Xj=!0; Yj(a,b,c);X=d;Xj=e;break;case 0:case 11:case 14:case 15:if(!U&&(d=c.updateQueue,null!==d&&(d=d.lastEffect,null!==d))){e=d=d.next;do{var f=e,g=f.destroy;f=f.tag;void 0!==g&&(0!==(f&2)?Mj(c,b,g):0!==(f&4)&&Mj(c,b,g));e=e.next}while(e!==d)}Yj(a,b,c);break;case 1:if(!U&&(Lj(c,b),d=c.stateNode,"function"===typeof d.componentWillUnmount))try{d.props=c.memoizedProps,d.state=c.memoizedState,d.componentWillUnmount()}catch(h){W(c,b,h)}Yj(a,b,c);break;case 21:Yj(a,b,c);break;case 22:c.mode&1?(U=(d=U)||null!== c.memoizedState,Yj(a,b,c),U=d):Yj(a,b,c);break;default:Yj(a,b,c)}}function ak(a){var b=a.updateQueue;if(null!==b){a.updateQueue=null;var c=a.stateNode;null===c&&(c=a.stateNode=new Kj);b.forEach(function(b){var d=bk.bind(null,a,b);c.has(b)||(c.add(b),b.then(d,d))})}} function ck(a,b){var c=b.deletions;if(null!==c)for(var d=0;de&&(e=g);d&=~f}d=e;d=B()-d;d=(120>d?120:480>d?480:1080>d?1080:1920>d?1920:3E3>d?3E3:4320>d?4320:1960*lk(d/1960))-d;if(10a?16:a;if(null===wk)var d=!1;else{a=wk;wk=null;xk=0;if(0!==(K&6))throw Error(p(331));var e=K;K|=4;for(V=a.current;null!==V;){var f=V,g=f.child;if(0!==(V.flags&16)){var h=f.deletions;if(null!==h){for(var k=0;kB()-fk?Kk(a,0):rk|=c);Dk(a,b)}function Yk(a,b){0===b&&(0===(a.mode&1)?b=1:(b=sc,sc<<=1,0===(sc&130023424)&&(sc=4194304)));var c=R();a=ih(a,b);null!==a&&(Ac(a,b,c),Dk(a,c))}function uj(a){var b=a.memoizedState,c=0;null!==b&&(c=b.retryLane);Yk(a,c)} function bk(a,b){var c=0;switch(a.tag){case 13:var d=a.stateNode;var e=a.memoizedState;null!==e&&(c=e.retryLane);break;case 19:d=a.stateNode;break;default:throw Error(p(314));}null!==d&&d.delete(b);Yk(a,c)}var Vk; Vk=function(a,b,c){if(null!==a)if(a.memoizedProps!==b.pendingProps||Wf.current)dh=!0;else{if(0===(a.lanes&c)&&0===(b.flags&128))return dh=!1,yj(a,b,c);dh=0!==(a.flags&131072)?!0:!1}else dh=!1,I&&0!==(b.flags&1048576)&&ug(b,ng,b.index);b.lanes=0;switch(b.tag){case 2:var d=b.type;ij(a,b);a=b.pendingProps;var e=Yf(b,H.current);ch(b,c);e=Nh(null,b,d,a,e,c);var f=Sh();b.flags|=1;"object"===typeof e&&null!==e&&"function"===typeof e.render&&void 0===e.$$typeof?(b.tag=1,b.memoizedState=null,b.updateQueue= null,Zf(d)?(f=!0,cg(b)):f=!1,b.memoizedState=null!==e.state&&void 0!==e.state?e.state:null,kh(b),e.updater=Ei,b.stateNode=e,e._reactInternals=b,Ii(b,d,a,c),b=jj(null,b,d,!0,f,c)):(b.tag=0,I&&f&&vg(b),Xi(null,b,e,c),b=b.child);return b;case 16:d=b.elementType;a:{ij(a,b);a=b.pendingProps;e=d._init;d=e(d._payload);b.type=d;e=b.tag=Zk(d);a=Ci(d,a);switch(e){case 0:b=cj(null,b,d,a,c);break a;case 1:b=hj(null,b,d,a,c);break a;case 11:b=Yi(null,b,d,a,c);break a;case 14:b=$i(null,b,d,Ci(d.type,a),c);break a}throw Error(p(306, d,""));}return b;case 0:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),cj(a,b,d,e,c);case 1:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),hj(a,b,d,e,c);case 3:a:{kj(b);if(null===a)throw Error(p(387));d=b.pendingProps;f=b.memoizedState;e=f.element;lh(a,b);qh(b,d,null,c);var g=b.memoizedState;d=g.element;if(f.isDehydrated)if(f={element:d,isDehydrated:!1,cache:g.cache,pendingSuspenseBoundaries:g.pendingSuspenseBoundaries,transitions:g.transitions},b.updateQueue.baseState= f,b.memoizedState=f,b.flags&256){e=Ji(Error(p(423)),b);b=lj(a,b,d,c,e);break a}else if(d!==e){e=Ji(Error(p(424)),b);b=lj(a,b,d,c,e);break a}else for(yg=Lf(b.stateNode.containerInfo.firstChild),xg=b,I=!0,zg=null,c=Vg(b,null,d,c),b.child=c;c;)c.flags=c.flags&-3|4096,c=c.sibling;else{Ig();if(d===e){b=Zi(a,b,c);break a}Xi(a,b,d,c)}b=b.child}return b;case 5:return Ah(b),null===a&&Eg(b),d=b.type,e=b.pendingProps,f=null!==a?a.memoizedProps:null,g=e.children,Ef(d,e)?g=null:null!==f&&Ef(d,f)&&(b.flags|=32), gj(a,b),Xi(a,b,g,c),b.child;case 6:return null===a&&Eg(b),null;case 13:return oj(a,b,c);case 4:return yh(b,b.stateNode.containerInfo),d=b.pendingProps,null===a?b.child=Ug(b,null,d,c):Xi(a,b,d,c),b.child;case 11:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),Yi(a,b,d,e,c);case 7:return Xi(a,b,b.pendingProps,c),b.child;case 8:return Xi(a,b,b.pendingProps.children,c),b.child;case 12:return Xi(a,b,b.pendingProps.children,c),b.child;case 10:a:{d=b.type._context;e=b.pendingProps;f=b.memoizedProps; g=e.value;G(Wg,d._currentValue);d._currentValue=g;if(null!==f)if(He(f.value,g)){if(f.children===e.children&&!Wf.current){b=Zi(a,b,c);break a}}else for(f=b.child,null!==f&&(f.return=b);null!==f;){var h=f.dependencies;if(null!==h){g=f.child;for(var k=h.firstContext;null!==k;){if(k.context===d){if(1===f.tag){k=mh(-1,c&-c);k.tag=2;var l=f.updateQueue;if(null!==l){l=l.shared;var m=l.pending;null===m?k.next=k:(k.next=m.next,m.next=k);l.pending=k}}f.lanes|=c;k=f.alternate;null!==k&&(k.lanes|=c);bh(f.return, c,b);h.lanes|=c;break}k=k.next}}else if(10===f.tag)g=f.type===b.type?null:f.child;else if(18===f.tag){g=f.return;if(null===g)throw Error(p(341));g.lanes|=c;h=g.alternate;null!==h&&(h.lanes|=c);bh(g,c,b);g=f.sibling}else g=f.child;if(null!==g)g.return=f;else for(g=f;null!==g;){if(g===b){g=null;break}f=g.sibling;if(null!==f){f.return=g.return;g=f;break}g=g.return}f=g}Xi(a,b,e.children,c);b=b.child}return b;case 9:return e=b.type,d=b.pendingProps.children,ch(b,c),e=eh(e),d=d(e),b.flags|=1,Xi(a,b,d,c), b.child;case 14:return d=b.type,e=Ci(d,b.pendingProps),e=Ci(d.type,e),$i(a,b,d,e,c);case 15:return bj(a,b,b.type,b.pendingProps,c);case 17:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),ij(a,b),b.tag=1,Zf(d)?(a=!0,cg(b)):a=!1,ch(b,c),Gi(b,d,e),Ii(b,d,e,c),jj(null,b,d,!0,a,c);case 19:return xj(a,b,c);case 22:return dj(a,b,c)}throw Error(p(156,b.tag));};function Fk(a,b){return ac(a,b)} function $k(a,b,c,d){this.tag=a;this.key=c;this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null;this.index=0;this.ref=null;this.pendingProps=b;this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null;this.mode=d;this.subtreeFlags=this.flags=0;this.deletions=null;this.childLanes=this.lanes=0;this.alternate=null}function Bg(a,b,c,d){return new $k(a,b,c,d)}function aj(a){a=a.prototype;return!(!a||!a.isReactComponent)} function Zk(a){if("function"===typeof a)return aj(a)?1:0;if(void 0!==a&&null!==a){a=a.$$typeof;if(a===Da)return 11;if(a===Ga)return 14}return 2} function Pg(a,b){var c=a.alternate;null===c?(c=Bg(a.tag,b,a.key,a.mode),c.elementType=a.elementType,c.type=a.type,c.stateNode=a.stateNode,c.alternate=a,a.alternate=c):(c.pendingProps=b,c.type=a.type,c.flags=0,c.subtreeFlags=0,c.deletions=null);c.flags=a.flags&14680064;c.childLanes=a.childLanes;c.lanes=a.lanes;c.child=a.child;c.memoizedProps=a.memoizedProps;c.memoizedState=a.memoizedState;c.updateQueue=a.updateQueue;b=a.dependencies;c.dependencies=null===b?null:{lanes:b.lanes,firstContext:b.firstContext}; c.sibling=a.sibling;c.index=a.index;c.ref=a.ref;return c} function Rg(a,b,c,d,e,f){var g=2;d=a;if("function"===typeof a)aj(a)&&(g=1);else if("string"===typeof a)g=5;else a:switch(a){case ya:return Tg(c.children,e,f,b);case za:g=8;e|=8;break;case Aa:return a=Bg(12,c,b,e|2),a.elementType=Aa,a.lanes=f,a;case Ea:return a=Bg(13,c,b,e),a.elementType=Ea,a.lanes=f,a;case Fa:return a=Bg(19,c,b,e),a.elementType=Fa,a.lanes=f,a;case Ia:return pj(c,e,f,b);default:if("object"===typeof a&&null!==a)switch(a.$$typeof){case Ba:g=10;break a;case Ca:g=9;break a;case Da:g=11; break a;case Ga:g=14;break a;case Ha:g=16;d=null;break a}throw Error(p(130,null==a?a:typeof a,""));}b=Bg(g,c,b,e);b.elementType=a;b.type=d;b.lanes=f;return b}function Tg(a,b,c,d){a=Bg(7,a,d,b);a.lanes=c;return a}function pj(a,b,c,d){a=Bg(22,a,d,b);a.elementType=Ia;a.lanes=c;a.stateNode={isHidden:!1};return a}function Qg(a,b,c){a=Bg(6,a,null,b);a.lanes=c;return a} function Sg(a,b,c){b=Bg(4,null!==a.children?a.children:[],a.key,b);b.lanes=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b} function al(a,b,c,d,e){this.tag=b;this.containerInfo=a;this.finishedWork=this.pingCache=this.current=this.pendingChildren=null;this.timeoutHandle=-1;this.callbackNode=this.pendingContext=this.context=null;this.callbackPriority=0;this.eventTimes=zc(0);this.expirationTimes=zc(-1);this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0;this.entanglements=zc(0);this.identifierPrefix=d;this.onRecoverableError=e;this.mutableSourceEagerHydrationData= null}function bl(a,b,c,d,e,f,g,h,k){a=new al(a,b,c,h,k);1===b?(b=1,!0===f&&(b|=8)):b=0;f=Bg(3,null,null,b);a.current=f;f.stateNode=a;f.memoizedState={element:d,isDehydrated:c,cache:null,transitions:null,pendingSuspenseBoundaries:null};kh(f);return a}function cl(a,b,c){var d=3 { "use strict"; var __webpack_unused_export__; var m = __webpack_require__(961); if (true) { exports.H = m.createRoot; __webpack_unused_export__ = m.hydrateRoot; } else { var i; } /***/ }), /***/ 961: /***/ ((module, __unused_webpack_exports, __webpack_require__) => { "use strict"; function checkDCE() { /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' || typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function' ) { return; } if (false) {} try { // Verify that the code above has been dead code eliminated (DCE'd). __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE); } catch (err) { // DevTools shouldn't crash React, no matter what. // We should still report in case we break this code. console.error(err); } } if (true) { // DCE check should happen before ReactDOM bundle executes so that // DevTools can report bad minification during injection. checkDCE(); module.exports = __webpack_require__(2551); } else {} /***/ }), /***/ 1530: /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; // EXPORTS __webpack_require__.d(__webpack_exports__, { VB: () => (/* binding */ useDropzone) }); // UNUSED EXPORTS: ErrorCode, default // EXTERNAL MODULE: ./node_modules/react/index.js var react = __webpack_require__(6540); // EXTERNAL MODULE: ./node_modules/prop-types/index.js var prop_types = __webpack_require__(5556); var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types); // EXTERNAL MODULE: ./node_modules/file-selector/dist/es5/index.js + 2 modules var es5 = __webpack_require__(4205); // EXTERNAL MODULE: ./node_modules/attr-accept/dist/es/index.js var es = __webpack_require__(9455); ;// CONCATENATED MODULE: ./node_modules/react-dropzone/dist/es/utils/index.js function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // Error codes var FILE_INVALID_TYPE = "file-invalid-type"; var FILE_TOO_LARGE = "file-too-large"; var FILE_TOO_SMALL = "file-too-small"; var TOO_MANY_FILES = "too-many-files"; var ErrorCode = { FileInvalidType: FILE_INVALID_TYPE, FileTooLarge: FILE_TOO_LARGE, FileTooSmall: FILE_TOO_SMALL, TooManyFiles: TOO_MANY_FILES }; // File Errors var getInvalidTypeRejectionErr = function getInvalidTypeRejectionErr(accept) { accept = Array.isArray(accept) && accept.length === 1 ? accept[0] : accept; var messageSuffix = Array.isArray(accept) ? "one of ".concat(accept.join(", ")) : accept; return { code: FILE_INVALID_TYPE, message: "File type must be ".concat(messageSuffix) }; }; var getTooLargeRejectionErr = function getTooLargeRejectionErr(maxSize) { return { code: FILE_TOO_LARGE, message: "File is larger than ".concat(maxSize, " ").concat(maxSize === 1 ? "byte" : "bytes") }; }; var getTooSmallRejectionErr = function getTooSmallRejectionErr(minSize) { return { code: FILE_TOO_SMALL, message: "File is smaller than ".concat(minSize, " ").concat(minSize === 1 ? "byte" : "bytes") }; }; var TOO_MANY_FILES_REJECTION = { code: TOO_MANY_FILES, message: "Too many files" }; // Firefox versions prior to 53 return a bogus MIME type for every file drag, so dragovers with // that MIME type will always be accepted function fileAccepted(file, accept) { var isAcceptable = file.type === "application/x-moz-file" || (0,es/* default */.A)(file, accept); return [isAcceptable, isAcceptable ? null : getInvalidTypeRejectionErr(accept)]; } function fileMatchSize(file, minSize, maxSize) { if (isDefined(file.size)) { if (isDefined(minSize) && isDefined(maxSize)) { if (file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)]; if (file.size < minSize) return [false, getTooSmallRejectionErr(minSize)]; } else if (isDefined(minSize) && file.size < minSize) return [false, getTooSmallRejectionErr(minSize)];else if (isDefined(maxSize) && file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)]; } return [true, null]; } function isDefined(value) { return value !== undefined && value !== null; } /** * * @param {object} options * @param {File[]} options.files * @param {string|string[]} [options.accept] * @param {number} [options.minSize] * @param {number} [options.maxSize] * @param {boolean} [options.multiple] * @param {number} [options.maxFiles] * @param {(f: File) => FileError|FileError[]|null} [options.validator] * @returns */ function allFilesAccepted(_ref) { var files = _ref.files, accept = _ref.accept, minSize = _ref.minSize, maxSize = _ref.maxSize, multiple = _ref.multiple, maxFiles = _ref.maxFiles, validator = _ref.validator; if (!multiple && files.length > 1 || multiple && maxFiles >= 1 && files.length > maxFiles) { return false; } return files.every(function (file) { var _fileAccepted = fileAccepted(file, accept), _fileAccepted2 = _slicedToArray(_fileAccepted, 1), accepted = _fileAccepted2[0]; var _fileMatchSize = fileMatchSize(file, minSize, maxSize), _fileMatchSize2 = _slicedToArray(_fileMatchSize, 1), sizeMatch = _fileMatchSize2[0]; var customErrors = validator ? validator(file) : null; return accepted && sizeMatch && !customErrors; }); } // React's synthetic events has event.isPropagationStopped, // but to remain compatibility with other libs (Preact) fall back // to check event.cancelBubble function isPropagationStopped(event) { if (typeof event.isPropagationStopped === "function") { return event.isPropagationStopped(); } else if (typeof event.cancelBubble !== "undefined") { return event.cancelBubble; } return false; } function isEvtWithFiles(event) { if (!event.dataTransfer) { return !!event.target && !!event.target.files; } // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/types // https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types#file return Array.prototype.some.call(event.dataTransfer.types, function (type) { return type === "Files" || type === "application/x-moz-file"; }); } function isKindFile(item) { return _typeof(item) === "object" && item !== null && item.kind === "file"; } // allow the entire document to be a drag target function onDocumentDragOver(event) { event.preventDefault(); } function isIe(userAgent) { return userAgent.indexOf("MSIE") !== -1 || userAgent.indexOf("Trident/") !== -1; } function isEdge(userAgent) { return userAgent.indexOf("Edge/") !== -1; } function isIeOrEdge() { var userAgent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.navigator.userAgent; return isIe(userAgent) || isEdge(userAgent); } /** * This is intended to be used to compose event handlers * They are executed in order until one of them calls `event.isPropagationStopped()`. * Note that the check is done on the first invoke too, * meaning that if propagation was stopped before invoking the fns, * no handlers will be executed. * * @param {Function} fns the event hanlder functions * @return {Function} the event handler to add to an element */ function composeEventHandlers() { for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) { fns[_key] = arguments[_key]; } return function (event) { for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) { args[_key2 - 1] = arguments[_key2]; } return fns.some(function (fn) { if (!isPropagationStopped(event) && fn) { fn.apply(void 0, [event].concat(args)); } return isPropagationStopped(event); }); }; } /** * canUseFileSystemAccessAPI checks if the [File System Access API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API) * is supported by the browser. * @returns {boolean} */ function canUseFileSystemAccessAPI() { return "showOpenFilePicker" in window; } /** * Convert the `{accept}` dropzone prop to the * `{types}` option for https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker * * @param {AcceptProp} accept * @returns {{accept: string[]}[]} */ function pickerOptionsFromAccept(accept) { if (isDefined(accept)) { var acceptForPicker = Object.entries(accept).filter(function (_ref2) { var _ref3 = _slicedToArray(_ref2, 2), mimeType = _ref3[0], ext = _ref3[1]; var ok = true; if (!isMIMEType(mimeType)) { console.warn("Skipped \"".concat(mimeType, "\" because it is not a valid MIME type. Check https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types for a list of valid MIME types.")); ok = false; } if (!Array.isArray(ext) || !ext.every(isExt)) { console.warn("Skipped \"".concat(mimeType, "\" because an invalid file extension was provided.")); ok = false; } return ok; }).reduce(function (agg, _ref4) { var _ref5 = _slicedToArray(_ref4, 2), mimeType = _ref5[0], ext = _ref5[1]; return _objectSpread(_objectSpread({}, agg), {}, _defineProperty({}, mimeType, ext)); }, {}); return [{ // description is required due to https://crbug.com/1264708 description: "Files", accept: acceptForPicker }]; } return accept; } /** * Convert the `{accept}` dropzone prop to an array of MIME types/extensions. * @param {AcceptProp} accept * @returns {string} */ function acceptPropAsAcceptAttr(accept) { if (isDefined(accept)) { return Object.entries(accept).reduce(function (a, _ref6) { var _ref7 = _slicedToArray(_ref6, 2), mimeType = _ref7[0], ext = _ref7[1]; return [].concat(_toConsumableArray(a), [mimeType], _toConsumableArray(ext)); }, []) // Silently discard invalid entries as pickerOptionsFromAccept warns about these .filter(function (v) { return isMIMEType(v) || isExt(v); }).join(","); } return undefined; } /** * Check if v is an exception caused by aborting a request (e.g window.showOpenFilePicker()). * * See https://developer.mozilla.org/en-US/docs/Web/API/DOMException. * @param {any} v * @returns {boolean} True if v is an abort exception. */ function isAbort(v) { return v instanceof DOMException && (v.name === "AbortError" || v.code === v.ABORT_ERR); } /** * Check if v is a security error. * * See https://developer.mozilla.org/en-US/docs/Web/API/DOMException. * @param {any} v * @returns {boolean} True if v is a security error. */ function isSecurityError(v) { return v instanceof DOMException && (v.name === "SecurityError" || v.code === v.SECURITY_ERR); } /** * Check if v is a MIME type string. * * See accepted format: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers. * * @param {string} v */ function isMIMEType(v) { return v === "audio/*" || v === "video/*" || v === "image/*" || v === "text/*" || /\w+\/[-+.\w]+/g.test(v); } /** * Check if v is a file extension. * @param {string} v */ function isExt(v) { return /^.*\.[\w]+$/.test(v); } /** * @typedef {Object.} AcceptProp */ /** * @typedef {object} FileError * @property {string} message * @property {ErrorCode|string} code */ /** * @typedef {"file-invalid-type"|"file-too-large"|"file-too-small"|"too-many-files"} ErrorCode */ ;// CONCATENATED MODULE: ./node_modules/react-dropzone/dist/es/index.js var _excluded = ["children"], _excluded2 = ["open"], _excluded3 = ["refKey", "role", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnter", "onDragOver", "onDragLeave", "onDrop"], _excluded4 = ["refKey", "onChange", "onClick"]; function es_toConsumableArray(arr) { return es_arrayWithoutHoles(arr) || es_iterableToArray(arr) || es_unsupportedIterableToArray(arr) || es_nonIterableSpread(); } function es_nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function es_iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } function es_arrayWithoutHoles(arr) { if (Array.isArray(arr)) return es_arrayLikeToArray(arr); } function es_slicedToArray(arr, i) { return es_arrayWithHoles(arr) || es_iterableToArrayLimit(arr, i) || es_unsupportedIterableToArray(arr, i) || es_nonIterableRest(); } function es_nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function es_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return es_arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return es_arrayLikeToArray(o, minLen); } function es_arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } function es_iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function es_arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } function es_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function es_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? es_ownKeys(Object(source), !0).forEach(function (key) { es_defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : es_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } function es_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } /* eslint prefer-template: 0 */ /** * Convenience wrapper component for the `useDropzone` hook * * ```jsx * * {({getRootProps, getInputProps}) => ( *
* *

Drag 'n' drop some files here, or click to select files

*
* )} *
* ``` */ var Dropzone = /*#__PURE__*/(0,react.forwardRef)(function (_ref, ref) { var children = _ref.children, params = _objectWithoutProperties(_ref, _excluded); var _useDropzone = useDropzone(params), open = _useDropzone.open, props = _objectWithoutProperties(_useDropzone, _excluded2); (0,react.useImperativeHandle)(ref, function () { return { open: open }; }, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element return /*#__PURE__*/react.createElement(react.Fragment, null, children(es_objectSpread(es_objectSpread({}, props), {}, { open: open }))); }); Dropzone.displayName = "Dropzone"; // Add default props for react-docgen var defaultProps = { disabled: false, getFilesFromEvent: es5/* fromEvent */.R, maxSize: Infinity, minSize: 0, multiple: true, maxFiles: 0, preventDropOnDocument: true, noClick: false, noKeyboard: false, noDrag: false, noDragEventsBubbling: false, validator: null, useFsAccessApi: true, autoFocus: false }; Dropzone.defaultProps = defaultProps; Dropzone.propTypes = { /** * Render function that exposes the dropzone state and prop getter fns * * @param {object} params * @param {Function} params.getRootProps Returns the props you should apply to the root drop container you render * @param {Function} params.getInputProps Returns the props you should apply to hidden file input you render * @param {Function} params.open Open the native file selection dialog * @param {boolean} params.isFocused Dropzone area is in focus * @param {boolean} params.isFileDialogActive File dialog is opened * @param {boolean} params.isDragActive Active drag is in progress * @param {boolean} params.isDragAccept Dragged files are accepted * @param {boolean} params.isDragReject Some dragged files are rejected * @param {File[]} params.acceptedFiles Accepted files * @param {FileRejection[]} params.fileRejections Rejected files and why they were rejected */ children: (prop_types_default()).func, /** * Set accepted file types. * Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information. * Keep in mind that mime type determination is not reliable across platforms. CSV files, * for example, are reported as text/plain under macOS but as application/vnd.ms-excel under * Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276). */ accept: prop_types_default().objectOf(prop_types_default().arrayOf((prop_types_default()).string)), /** * Allow drag 'n' drop (or selection from the file dialog) of multiple files */ multiple: (prop_types_default()).bool, /** * If false, allow dropped items to take over the current browser window */ preventDropOnDocument: (prop_types_default()).bool, /** * If true, disables click to open the native file selection dialog */ noClick: (prop_types_default()).bool, /** * If true, disables SPACE/ENTER to open the native file selection dialog. * Note that it also stops tracking the focus state. */ noKeyboard: (prop_types_default()).bool, /** * If true, disables drag 'n' drop */ noDrag: (prop_types_default()).bool, /** * If true, stops drag event propagation to parents */ noDragEventsBubbling: (prop_types_default()).bool, /** * Minimum file size (in bytes) */ minSize: (prop_types_default()).number, /** * Maximum file size (in bytes) */ maxSize: (prop_types_default()).number, /** * Maximum accepted number of files * The default value is 0 which means there is no limitation to how many files are accepted. */ maxFiles: (prop_types_default()).number, /** * Enable/disable the dropzone */ disabled: (prop_types_default()).bool, /** * Use this to provide a custom file aggregator * * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) */ getFilesFromEvent: (prop_types_default()).func, /** * Cb for when closing the file dialog with no selection */ onFileDialogCancel: (prop_types_default()).func, /** * Cb for when opening the file dialog */ onFileDialogOpen: (prop_types_default()).func, /** * Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API * to open the file picker instead of using an `` click event. */ useFsAccessApi: (prop_types_default()).bool, /** * Set to true to focus the root element on render */ autoFocus: (prop_types_default()).bool, /** * Cb for when the `dragenter` event occurs. * * @param {DragEvent} event */ onDragEnter: (prop_types_default()).func, /** * Cb for when the `dragleave` event occurs * * @param {DragEvent} event */ onDragLeave: (prop_types_default()).func, /** * Cb for when the `dragover` event occurs * * @param {DragEvent} event */ onDragOver: (prop_types_default()).func, /** * Cb for when the `drop` event occurs. * Note that this callback is invoked after the `getFilesFromEvent` callback is done. * * Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props. * `accept` must be a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) or a valid file extension. * If `multiple` is set to false and additional files are dropped, * all files besides the first will be rejected. * Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well. * * Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected. * If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props. * * `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server. * For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library: * * ```js * function onDrop(acceptedFiles) { * const req = request.post('/upload') * acceptedFiles.forEach(file => { * req.attach(file.name, file) * }) * req.end(callback) * } * ``` * * @param {File[]} acceptedFiles * @param {FileRejection[]} fileRejections * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) */ onDrop: (prop_types_default()).func, /** * Cb for when the `drop` event occurs. * Note that if no files are accepted, this callback is not invoked. * * @param {File[]} files * @param {(DragEvent|Event)} event */ onDropAccepted: (prop_types_default()).func, /** * Cb for when the `drop` event occurs. * Note that if no files are rejected, this callback is not invoked. * * @param {FileRejection[]} fileRejections * @param {(DragEvent|Event)} event */ onDropRejected: (prop_types_default()).func, /** * Cb for when there's some error from any of the promises. * * @param {Error} error */ onError: (prop_types_default()).func, /** * Custom validation function. It must return null if there's no errors. * @param {File} file * @returns {FileError|FileError[]|null} */ validator: (prop_types_default()).func }; /* harmony default export */ const dist_es = ((/* unused pure expression or super */ null && (Dropzone))); /** * A function that is invoked for the `dragenter`, * `dragover` and `dragleave` events. * It is not invoked if the items are not files (such as link, text, etc.). * * @callback dragCb * @param {DragEvent} event */ /** * A function that is invoked for the `drop` or input change event. * It is not invoked if the items are not files (such as link, text, etc.). * * @callback dropCb * @param {File[]} acceptedFiles List of accepted files * @param {FileRejection[]} fileRejections List of rejected files and why they were rejected * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) */ /** * A function that is invoked for the `drop` or input change event. * It is not invoked if the items are files (such as link, text, etc.). * * @callback dropAcceptedCb * @param {File[]} files List of accepted files that meet the given criteria * (`accept`, `multiple`, `minSize`, `maxSize`) * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) */ /** * A function that is invoked for the `drop` or input change event. * * @callback dropRejectedCb * @param {File[]} files List of rejected files that do not meet the given criteria * (`accept`, `multiple`, `minSize`, `maxSize`) * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) */ /** * A function that is used aggregate files, * in a asynchronous fashion, from drag or input change events. * * @callback getFilesFromEvent * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog) * @returns {(File[]|Promise)} */ /** * An object with the current dropzone state. * * @typedef {object} DropzoneState * @property {boolean} isFocused Dropzone area is in focus * @property {boolean} isFileDialogActive File dialog is opened * @property {boolean} isDragActive Active drag is in progress * @property {boolean} isDragAccept Dragged files are accepted * @property {boolean} isDragReject Some dragged files are rejected * @property {File[]} acceptedFiles Accepted files * @property {FileRejection[]} fileRejections Rejected files and why they were rejected */ /** * An object with the dropzone methods. * * @typedef {object} DropzoneMethods * @property {Function} getRootProps Returns the props you should apply to the root drop container you render * @property {Function} getInputProps Returns the props you should apply to hidden file input you render * @property {Function} open Open the native file selection dialog */ var initialState = { isFocused: false, isFileDialogActive: false, isDragActive: false, isDragAccept: false, isDragReject: false, acceptedFiles: [], fileRejections: [] }; /** * A React hook that creates a drag 'n' drop area. * * ```jsx * function MyDropzone(props) { * const {getRootProps, getInputProps} = useDropzone({ * onDrop: acceptedFiles => { * // do something with the File objects, e.g. upload to some server * } * }); * return ( *
* *

Drag and drop some files here, or click to select files

*
* ) * } * ``` * * @function useDropzone * * @param {object} props * @param {import("./utils").AcceptProp} [props.accept] Set accepted file types. * Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information. * Keep in mind that mime type determination is not reliable across platforms. CSV files, * for example, are reported as text/plain under macOS but as application/vnd.ms-excel under * Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276). * @param {boolean} [props.multiple=true] Allow drag 'n' drop (or selection from the file dialog) of multiple files * @param {boolean} [props.preventDropOnDocument=true] If false, allow dropped items to take over the current browser window * @param {boolean} [props.noClick=false] If true, disables click to open the native file selection dialog * @param {boolean} [props.noKeyboard=false] If true, disables SPACE/ENTER to open the native file selection dialog. * Note that it also stops tracking the focus state. * @param {boolean} [props.noDrag=false] If true, disables drag 'n' drop * @param {boolean} [props.noDragEventsBubbling=false] If true, stops drag event propagation to parents * @param {number} [props.minSize=0] Minimum file size (in bytes) * @param {number} [props.maxSize=Infinity] Maximum file size (in bytes) * @param {boolean} [props.disabled=false] Enable/disable the dropzone * @param {getFilesFromEvent} [props.getFilesFromEvent] Use this to provide a custom file aggregator * @param {Function} [props.onFileDialogCancel] Cb for when closing the file dialog with no selection * @param {boolean} [props.useFsAccessApi] Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API * to open the file picker instead of using an `` click event. * @param {boolean} autoFocus Set to true to auto focus the root element. * @param {Function} [props.onFileDialogOpen] Cb for when opening the file dialog * @param {dragCb} [props.onDragEnter] Cb for when the `dragenter` event occurs. * @param {dragCb} [props.onDragLeave] Cb for when the `dragleave` event occurs * @param {dragCb} [props.onDragOver] Cb for when the `dragover` event occurs * @param {dropCb} [props.onDrop] Cb for when the `drop` event occurs. * Note that this callback is invoked after the `getFilesFromEvent` callback is done. * * Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props. * `accept` must be an object with keys as a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) and the value an array of file extensions (optional). * If `multiple` is set to false and additional files are dropped, * all files besides the first will be rejected. * Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well. * * Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected. * If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props. * * `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server. * For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library: * * ```js * function onDrop(acceptedFiles) { * const req = request.post('/upload') * acceptedFiles.forEach(file => { * req.attach(file.name, file) * }) * req.end(callback) * } * ``` * @param {dropAcceptedCb} [props.onDropAccepted] * @param {dropRejectedCb} [props.onDropRejected] * @param {(error: Error) => void} [props.onError] * * @returns {DropzoneState & DropzoneMethods} */ function useDropzone() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var _defaultProps$props = es_objectSpread(es_objectSpread({}, defaultProps), props), accept = _defaultProps$props.accept, disabled = _defaultProps$props.disabled, getFilesFromEvent = _defaultProps$props.getFilesFromEvent, maxSize = _defaultProps$props.maxSize, minSize = _defaultProps$props.minSize, multiple = _defaultProps$props.multiple, maxFiles = _defaultProps$props.maxFiles, onDragEnter = _defaultProps$props.onDragEnter, onDragLeave = _defaultProps$props.onDragLeave, onDragOver = _defaultProps$props.onDragOver, onDrop = _defaultProps$props.onDrop, onDropAccepted = _defaultProps$props.onDropAccepted, onDropRejected = _defaultProps$props.onDropRejected, onFileDialogCancel = _defaultProps$props.onFileDialogCancel, onFileDialogOpen = _defaultProps$props.onFileDialogOpen, useFsAccessApi = _defaultProps$props.useFsAccessApi, autoFocus = _defaultProps$props.autoFocus, preventDropOnDocument = _defaultProps$props.preventDropOnDocument, noClick = _defaultProps$props.noClick, noKeyboard = _defaultProps$props.noKeyboard, noDrag = _defaultProps$props.noDrag, noDragEventsBubbling = _defaultProps$props.noDragEventsBubbling, onError = _defaultProps$props.onError, validator = _defaultProps$props.validator; var acceptAttr = (0,react.useMemo)(function () { return acceptPropAsAcceptAttr(accept); }, [accept]); var pickerTypes = (0,react.useMemo)(function () { return pickerOptionsFromAccept(accept); }, [accept]); var onFileDialogOpenCb = (0,react.useMemo)(function () { return typeof onFileDialogOpen === "function" ? onFileDialogOpen : noop; }, [onFileDialogOpen]); var onFileDialogCancelCb = (0,react.useMemo)(function () { return typeof onFileDialogCancel === "function" ? onFileDialogCancel : noop; }, [onFileDialogCancel]); /** * @constant * @type {React.MutableRefObject} */ var rootRef = (0,react.useRef)(null); var inputRef = (0,react.useRef)(null); var _useReducer = (0,react.useReducer)(reducer, initialState), _useReducer2 = es_slicedToArray(_useReducer, 2), state = _useReducer2[0], dispatch = _useReducer2[1]; var isFocused = state.isFocused, isFileDialogActive = state.isFileDialogActive; var fsAccessApiWorksRef = (0,react.useRef)(typeof window !== "undefined" && window.isSecureContext && useFsAccessApi && canUseFileSystemAccessAPI()); // Update file dialog active state when the window is focused on var onWindowFocus = function onWindowFocus() { // Execute the timeout only if the file dialog is opened in the browser if (!fsAccessApiWorksRef.current && isFileDialogActive) { setTimeout(function () { if (inputRef.current) { var files = inputRef.current.files; if (!files.length) { dispatch({ type: "closeDialog" }); onFileDialogCancelCb(); } } }, 300); } }; (0,react.useEffect)(function () { window.addEventListener("focus", onWindowFocus, false); return function () { window.removeEventListener("focus", onWindowFocus, false); }; }, [inputRef, isFileDialogActive, onFileDialogCancelCb, fsAccessApiWorksRef]); var dragTargetsRef = (0,react.useRef)([]); var onDocumentDrop = function onDocumentDrop(event) { if (rootRef.current && rootRef.current.contains(event.target)) { // If we intercepted an event for our instance, let it propagate down to the instance's onDrop handler return; } event.preventDefault(); dragTargetsRef.current = []; }; (0,react.useEffect)(function () { if (preventDropOnDocument) { document.addEventListener("dragover", onDocumentDragOver, false); document.addEventListener("drop", onDocumentDrop, false); } return function () { if (preventDropOnDocument) { document.removeEventListener("dragover", onDocumentDragOver); document.removeEventListener("drop", onDocumentDrop); } }; }, [rootRef, preventDropOnDocument]); // Auto focus the root when autoFocus is true (0,react.useEffect)(function () { if (!disabled && autoFocus && rootRef.current) { rootRef.current.focus(); } return function () {}; }, [rootRef, autoFocus, disabled]); var onErrCb = (0,react.useCallback)(function (e) { if (onError) { onError(e); } else { // Let the user know something's gone wrong if they haven't provided the onError cb. console.error(e); } }, [onError]); var onDragEnterCb = (0,react.useCallback)(function (event) { event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done event.persist(); stopPropagation(event); dragTargetsRef.current = [].concat(es_toConsumableArray(dragTargetsRef.current), [event.target]); if (isEvtWithFiles(event)) { Promise.resolve(getFilesFromEvent(event)).then(function (files) { if (isPropagationStopped(event) && !noDragEventsBubbling) { return; } var fileCount = files.length; var isDragAccept = fileCount > 0 && allFilesAccepted({ files: files, accept: acceptAttr, minSize: minSize, maxSize: maxSize, multiple: multiple, maxFiles: maxFiles, validator: validator }); var isDragReject = fileCount > 0 && !isDragAccept; dispatch({ isDragAccept: isDragAccept, isDragReject: isDragReject, isDragActive: true, type: "setDraggedFiles" }); if (onDragEnter) { onDragEnter(event); } }).catch(function (e) { return onErrCb(e); }); } }, [getFilesFromEvent, onDragEnter, onErrCb, noDragEventsBubbling, acceptAttr, minSize, maxSize, multiple, maxFiles, validator]); var onDragOverCb = (0,react.useCallback)(function (event) { event.preventDefault(); event.persist(); stopPropagation(event); var hasFiles = isEvtWithFiles(event); if (hasFiles && event.dataTransfer) { try { event.dataTransfer.dropEffect = "copy"; } catch (_unused) {} /* eslint-disable-line no-empty */ } if (hasFiles && onDragOver) { onDragOver(event); } return false; }, [onDragOver, noDragEventsBubbling]); var onDragLeaveCb = (0,react.useCallback)(function (event) { event.preventDefault(); event.persist(); stopPropagation(event); // Only deactivate once the dropzone and all children have been left var targets = dragTargetsRef.current.filter(function (target) { return rootRef.current && rootRef.current.contains(target); }); // Make sure to remove a target present multiple times only once // (Firefox may fire dragenter/dragleave multiple times on the same element) var targetIdx = targets.indexOf(event.target); if (targetIdx !== -1) { targets.splice(targetIdx, 1); } dragTargetsRef.current = targets; if (targets.length > 0) { return; } dispatch({ type: "setDraggedFiles", isDragActive: false, isDragAccept: false, isDragReject: false }); if (isEvtWithFiles(event) && onDragLeave) { onDragLeave(event); } }, [rootRef, onDragLeave, noDragEventsBubbling]); var setFiles = (0,react.useCallback)(function (files, event) { var acceptedFiles = []; var fileRejections = []; files.forEach(function (file) { var _fileAccepted = fileAccepted(file, acceptAttr), _fileAccepted2 = es_slicedToArray(_fileAccepted, 2), accepted = _fileAccepted2[0], acceptError = _fileAccepted2[1]; var _fileMatchSize = fileMatchSize(file, minSize, maxSize), _fileMatchSize2 = es_slicedToArray(_fileMatchSize, 2), sizeMatch = _fileMatchSize2[0], sizeError = _fileMatchSize2[1]; var customErrors = validator ? validator(file) : null; if (accepted && sizeMatch && !customErrors) { acceptedFiles.push(file); } else { var errors = [acceptError, sizeError]; if (customErrors) { errors = errors.concat(customErrors); } fileRejections.push({ file: file, errors: errors.filter(function (e) { return e; }) }); } }); if (!multiple && acceptedFiles.length > 1 || multiple && maxFiles >= 1 && acceptedFiles.length > maxFiles) { // Reject everything and empty accepted files acceptedFiles.forEach(function (file) { fileRejections.push({ file: file, errors: [TOO_MANY_FILES_REJECTION] }); }); acceptedFiles.splice(0); } dispatch({ acceptedFiles: acceptedFiles, fileRejections: fileRejections, type: "setFiles" }); if (onDrop) { onDrop(acceptedFiles, fileRejections, event); } if (fileRejections.length > 0 && onDropRejected) { onDropRejected(fileRejections, event); } if (acceptedFiles.length > 0 && onDropAccepted) { onDropAccepted(acceptedFiles, event); } }, [dispatch, multiple, acceptAttr, minSize, maxSize, maxFiles, onDrop, onDropAccepted, onDropRejected, validator]); var onDropCb = (0,react.useCallback)(function (event) { event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done event.persist(); stopPropagation(event); dragTargetsRef.current = []; if (isEvtWithFiles(event)) { Promise.resolve(getFilesFromEvent(event)).then(function (files) { if (isPropagationStopped(event) && !noDragEventsBubbling) { return; } setFiles(files, event); }).catch(function (e) { return onErrCb(e); }); } dispatch({ type: "reset" }); }, [getFilesFromEvent, setFiles, onErrCb, noDragEventsBubbling]); // Fn for opening the file dialog programmatically var openFileDialog = (0,react.useCallback)(function () { // No point to use FS access APIs if context is not secure // https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts#feature_detection if (fsAccessApiWorksRef.current) { dispatch({ type: "openDialog" }); onFileDialogOpenCb(); // https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker var opts = { multiple: multiple, types: pickerTypes }; window.showOpenFilePicker(opts).then(function (handles) { return getFilesFromEvent(handles); }).then(function (files) { setFiles(files, null); dispatch({ type: "closeDialog" }); }).catch(function (e) { // AbortError means the user canceled if (isAbort(e)) { onFileDialogCancelCb(e); dispatch({ type: "closeDialog" }); } else if (isSecurityError(e)) { fsAccessApiWorksRef.current = false; // CORS, so cannot use this API // Try using the input if (inputRef.current) { inputRef.current.value = null; inputRef.current.click(); } else { onErrCb(new Error("Cannot open the file picker because the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API is not supported and no was provided.")); } } else { onErrCb(e); } }); return; } if (inputRef.current) { dispatch({ type: "openDialog" }); onFileDialogOpenCb(); inputRef.current.value = null; inputRef.current.click(); } }, [dispatch, onFileDialogOpenCb, onFileDialogCancelCb, useFsAccessApi, setFiles, onErrCb, pickerTypes, multiple]); // Cb to open the file dialog when SPACE/ENTER occurs on the dropzone var onKeyDownCb = (0,react.useCallback)(function (event) { // Ignore keyboard events bubbling up the DOM tree if (!rootRef.current || !rootRef.current.isEqualNode(event.target)) { return; } if (event.key === " " || event.key === "Enter" || event.keyCode === 32 || event.keyCode === 13) { event.preventDefault(); openFileDialog(); } }, [rootRef, openFileDialog]); // Update focus state for the dropzone var onFocusCb = (0,react.useCallback)(function () { dispatch({ type: "focus" }); }, []); var onBlurCb = (0,react.useCallback)(function () { dispatch({ type: "blur" }); }, []); // Cb to open the file dialog when click occurs on the dropzone var onClickCb = (0,react.useCallback)(function () { if (noClick) { return; } // In IE11/Edge the file-browser dialog is blocking, therefore, use setTimeout() // to ensure React can handle state changes // See: https://github.com/react-dropzone/react-dropzone/issues/450 if (isIeOrEdge()) { setTimeout(openFileDialog, 0); } else { openFileDialog(); } }, [noClick, openFileDialog]); var composeHandler = function composeHandler(fn) { return disabled ? null : fn; }; var composeKeyboardHandler = function composeKeyboardHandler(fn) { return noKeyboard ? null : composeHandler(fn); }; var composeDragHandler = function composeDragHandler(fn) { return noDrag ? null : composeHandler(fn); }; var stopPropagation = function stopPropagation(event) { if (noDragEventsBubbling) { event.stopPropagation(); } }; var getRootProps = (0,react.useMemo)(function () { return function () { var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref2$refKey = _ref2.refKey, refKey = _ref2$refKey === void 0 ? "ref" : _ref2$refKey, role = _ref2.role, onKeyDown = _ref2.onKeyDown, onFocus = _ref2.onFocus, onBlur = _ref2.onBlur, onClick = _ref2.onClick, onDragEnter = _ref2.onDragEnter, onDragOver = _ref2.onDragOver, onDragLeave = _ref2.onDragLeave, onDrop = _ref2.onDrop, rest = _objectWithoutProperties(_ref2, _excluded3); return es_objectSpread(es_objectSpread(es_defineProperty({ onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)), onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)), onBlur: composeKeyboardHandler(composeEventHandlers(onBlur, onBlurCb)), onClick: composeHandler(composeEventHandlers(onClick, onClickCb)), onDragEnter: composeDragHandler(composeEventHandlers(onDragEnter, onDragEnterCb)), onDragOver: composeDragHandler(composeEventHandlers(onDragOver, onDragOverCb)), onDragLeave: composeDragHandler(composeEventHandlers(onDragLeave, onDragLeaveCb)), onDrop: composeDragHandler(composeEventHandlers(onDrop, onDropCb)), role: typeof role === "string" && role !== "" ? role : "presentation" }, refKey, rootRef), !disabled && !noKeyboard ? { tabIndex: 0 } : {}), rest); }; }, [rootRef, onKeyDownCb, onFocusCb, onBlurCb, onClickCb, onDragEnterCb, onDragOverCb, onDragLeaveCb, onDropCb, noKeyboard, noDrag, disabled]); var onInputElementClick = (0,react.useCallback)(function (event) { event.stopPropagation(); }, []); var getInputProps = (0,react.useMemo)(function () { return function () { var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, _ref3$refKey = _ref3.refKey, refKey = _ref3$refKey === void 0 ? "ref" : _ref3$refKey, onChange = _ref3.onChange, onClick = _ref3.onClick, rest = _objectWithoutProperties(_ref3, _excluded4); var inputProps = es_defineProperty({ accept: acceptAttr, multiple: multiple, type: "file", style: { display: "none" }, onChange: composeHandler(composeEventHandlers(onChange, onDropCb)), onClick: composeHandler(composeEventHandlers(onClick, onInputElementClick)), tabIndex: -1 }, refKey, inputRef); return es_objectSpread(es_objectSpread({}, inputProps), rest); }; }, [inputRef, accept, multiple, onDropCb, disabled]); return es_objectSpread(es_objectSpread({}, state), {}, { isFocused: isFocused && !disabled, getRootProps: getRootProps, getInputProps: getInputProps, rootRef: rootRef, inputRef: inputRef, open: composeHandler(openFileDialog) }); } /** * @param {DropzoneState} state * @param {{type: string} & DropzoneState} action * @returns {DropzoneState} */ function reducer(state, action) { /* istanbul ignore next */ switch (action.type) { case "focus": return es_objectSpread(es_objectSpread({}, state), {}, { isFocused: true }); case "blur": return es_objectSpread(es_objectSpread({}, state), {}, { isFocused: false }); case "openDialog": return es_objectSpread(es_objectSpread({}, initialState), {}, { isFileDialogActive: true }); case "closeDialog": return es_objectSpread(es_objectSpread({}, state), {}, { isFileDialogActive: false }); case "setDraggedFiles": return es_objectSpread(es_objectSpread({}, state), {}, { isDragActive: action.isDragActive, isDragAccept: action.isDragAccept, isDragReject: action.isDragReject }); case "setFiles": return es_objectSpread(es_objectSpread({}, state), {}, { acceptedFiles: action.acceptedFiles, fileRejections: action.fileRejections }); case "reset": return es_objectSpread({}, initialState); default: return state; } } function noop() {} /***/ }), /***/ 7946: /***/ (function(module, __unused_webpack_exports, __webpack_require__) { !function(e,t){ true?module.exports=t(__webpack_require__(6540)):0}("undefined"!=typeof self?self:this,(function(e){return o={},t.m=n=[function(t){t.exports=e},function(e,t,n){e.exports=n(2)()},function(e,t,n){"use strict";function o(){}function r(){}var i=n(3);r.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,r,a){if(a!==i){var c=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}var n={array:e.isRequired=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:r,resetWarningCache:o};return n.PropTypes=n}},function(e){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){"use strict";function o(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e)){var n=[],o=!0,r=!1,i=void 0;try{for(var a,c=e[Symbol.iterator]();!(o=(a=c.next()).done)&&(n.push(a.value),!t||n.length!==t);o=!0);}catch(e){r=!0,i=e}finally{try{o||null==c.return||c.return()}finally{if(r)throw i}}return n}}(e,t)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(n):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(e,t){null!=t&&t<=e.length||(t=e.length);for(var n=0,o=Array(t);n { "use strict"; /* harmony export */ __webpack_require__.d(__webpack_exports__, { /* harmony export */ FH: () => (/* binding */ useWatch), /* harmony export */ Op: () => (/* binding */ FormProvider), /* harmony export */ mN: () => (/* binding */ useForm), /* harmony export */ xW: () => (/* binding */ useFormContext) /* harmony export */ }); /* unused harmony exports Controller, Form, appendErrors, get, set, useController, useFieldArray, useFormState */ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6540); var isCheckBoxInput = (element) => element.type === 'checkbox'; var isDateObject = (value) => value instanceof Date; var isNullOrUndefined = (value) => value == null; const isObjectType = (value) => typeof value === 'object'; var isObject = (value) => !isNullOrUndefined(value) && !Array.isArray(value) && isObjectType(value) && !isDateObject(value); var getEventValue = (event) => isObject(event) && event.target ? isCheckBoxInput(event.target) ? event.target.checked : event.target.value : event; var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name; var isNameInFieldArray = (names, name) => names.has(getNodeParentName(name)); var isPlainObject = (tempObject) => { const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype; return (isObject(prototypeCopy) && prototypeCopy.hasOwnProperty('isPrototypeOf')); }; var isWeb = typeof window !== 'undefined' && typeof window.HTMLElement !== 'undefined' && typeof document !== 'undefined'; function cloneObject(data) { let copy; const isArray = Array.isArray(data); if (data instanceof Date) { copy = new Date(data); } else if (data instanceof Set) { copy = new Set(data); } else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) && (isArray || isObject(data))) { copy = isArray ? [] : {}; if (!isArray && !isPlainObject(data)) { copy = data; } else { for (const key in data) { if (data.hasOwnProperty(key)) { copy[key] = cloneObject(data[key]); } } } } else { return data; } return copy; } var compact = (value) => Array.isArray(value) ? value.filter(Boolean) : []; var isUndefined = (val) => val === undefined; var get = (object, path, defaultValue) => { if (!path || !isObject(object)) { return defaultValue; } const result = compact(path.split(/[,[\].]+?/)).reduce((result, key) => isNullOrUndefined(result) ? result : result[key], object); return isUndefined(result) || result === object ? isUndefined(object[path]) ? defaultValue : object[path] : result; }; var isBoolean = (value) => typeof value === 'boolean'; const EVENTS = { BLUR: 'blur', FOCUS_OUT: 'focusout', CHANGE: 'change', }; const VALIDATION_MODE = { onBlur: 'onBlur', onChange: 'onChange', onSubmit: 'onSubmit', onTouched: 'onTouched', all: 'all', }; const INPUT_VALIDATION_RULES = { max: 'max', min: 'min', maxLength: 'maxLength', minLength: 'minLength', pattern: 'pattern', required: 'required', validate: 'validate', }; const HookFormContext = react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); /** * This custom hook allows you to access the form context. useFormContext is intended to be used in deeply nested structures, where it would become inconvenient to pass the context as a prop. To be used with {@link FormProvider}. * * @remarks * [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi) * * @returns return all useForm methods * * @example * ```tsx * function App() { * const methods = useForm(); * const onSubmit = data => console.log(data); * * return ( * *
* * * *
* ); * } * * function NestedInput() { * const { register } = useFormContext(); // retrieve all hook methods * return ; * } * ``` */ const useFormContext = () => react__WEBPACK_IMPORTED_MODULE_0__.useContext(HookFormContext); /** * A provider component that propagates the `useForm` methods to all children components via [React Context](https://reactjs.org/docs/context.html) API. To be used with {@link useFormContext}. * * @remarks * [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi) * * @param props - all useForm methods * * @example * ```tsx * function App() { * const methods = useForm(); * const onSubmit = data => console.log(data); * * return ( * *
* * * *
* ); * } * * function NestedInput() { * const { register } = useFormContext(); // retrieve all hook methods * return ; * } * ``` */ const FormProvider = (props) => { const { children, ...data } = props; return (react__WEBPACK_IMPORTED_MODULE_0__.createElement(HookFormContext.Provider, { value: data }, children)); }; var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => { const result = { defaultValues: control._defaultValues, }; for (const key in formState) { Object.defineProperty(result, key, { get: () => { const _key = key; if (control._proxyFormState[_key] !== VALIDATION_MODE.all) { control._proxyFormState[_key] = !isRoot || VALIDATION_MODE.all; } localProxyFormState && (localProxyFormState[_key] = true); return formState[_key]; }, }); } return result; }; var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length; var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => { updateFormState(formStateData); const { name, ...formState } = formStateData; return (isEmptyObject(formState) || Object.keys(formState).length >= Object.keys(_proxyFormState).length || Object.keys(formState).find((key) => _proxyFormState[key] === (!isRoot || VALIDATION_MODE.all))); }; var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]); var shouldSubscribeByName = (name, signalName, exact) => !name || !signalName || name === signalName || convertToArrayPayload(name).some((currentName) => currentName && (exact ? currentName === signalName : currentName.startsWith(signalName) || signalName.startsWith(currentName))); function useSubscribe(props) { const _props = react__WEBPACK_IMPORTED_MODULE_0__.useRef(props); _props.current = props; react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { const subscription = !props.disabled && _props.current.subject && _props.current.subject.subscribe({ next: _props.current.next, }); return () => { subscription && subscription.unsubscribe(); }; }, [props.disabled]); } /** * This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application. * * @remarks * [API](https://react-hook-form.com/docs/useformstate) • [Demo](https://codesandbox.io/s/useformstate-75xly) * * @param props - include options on specify fields to subscribe. {@link UseFormStateReturn} * * @example * ```tsx * function App() { * const { register, handleSubmit, control } = useForm({ * defaultValues: { * firstName: "firstName" * }}); * const { dirtyFields } = useFormState({ * control * }); * const onSubmit = (data) => console.log(data); * * return ( *
* * {dirtyFields.firstName &&

Field is dirty.

} * *
* ); * } * ``` */ function useFormState(props) { const methods = useFormContext(); const { control = methods.control, disabled, name, exact } = props || {}; const [formState, updateFormState] = React.useState(control._formState); const _mounted = React.useRef(true); const _localProxyFormState = React.useRef({ isDirty: false, isLoading: false, dirtyFields: false, touchedFields: false, validatingFields: false, isValidating: false, isValid: false, errors: false, }); const _name = React.useRef(name); _name.current = name; useSubscribe({ disabled, next: (value) => _mounted.current && shouldSubscribeByName(_name.current, value.name, exact) && shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) && updateFormState({ ...control._formState, ...value, }), subject: control._subjects.state, }); React.useEffect(() => { _mounted.current = true; _localProxyFormState.current.isValid && control._updateValid(true); return () => { _mounted.current = false; }; }, [control]); return getProxyFormState(formState, control, _localProxyFormState.current, false); } var isString = (value) => typeof value === 'string'; var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => { if (isString(names)) { isGlobal && _names.watch.add(names); return get(formValues, names, defaultValue); } if (Array.isArray(names)) { return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName), get(formValues, fieldName))); } isGlobal && (_names.watchAll = true); return formValues; }; /** * Custom hook to subscribe to field change and isolate re-rendering at the component level. * * @remarks * * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e) * * @example * ```tsx * const { control } = useForm(); * const values = useWatch({ * name: "fieldName" * control, * }) * ``` */ function useWatch(props) { const methods = useFormContext(); const { control = methods.control, name, defaultValue, disabled, exact, } = props || {}; const _name = react__WEBPACK_IMPORTED_MODULE_0__.useRef(name); _name.current = name; useSubscribe({ disabled, subject: control._subjects.values, next: (formState) => { if (shouldSubscribeByName(_name.current, formState.name, exact)) { updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue))); } }, }); const [value, updateValue] = react__WEBPACK_IMPORTED_MODULE_0__.useState(control._getWatch(name, defaultValue)); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => control._removeUnmounted()); return value; } var isKey = (value) => /^\w*$/.test(value); var stringToPath = (input) => compact(input.replace(/["|']|\]/g, '').split(/\.|\[/)); var set = (object, path, value) => { let index = -1; const tempPath = isKey(path) ? [path] : stringToPath(path); const length = tempPath.length; const lastIndex = length - 1; while (++index < length) { const key = tempPath[index]; let newValue = value; if (index !== lastIndex) { const objValue = object[key]; newValue = isObject(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {}; } object[key] = newValue; object = object[key]; } return object; }; /** * Custom hook to work with controlled component, this function provide you with both form and field level state. Re-render is isolated at the hook level. * * @remarks * [API](https://react-hook-form.com/docs/usecontroller) • [Demo](https://codesandbox.io/s/usecontroller-0o8px) * * @param props - the path name to the form field value, and validation rules. * * @returns field properties, field and form state. {@link UseControllerReturn} * * @example * ```tsx * function Input(props) { * const { field, fieldState, formState } = useController(props); * return ( *
* *

{fieldState.isTouched && "Touched"}

*

{formState.isSubmitted ? "submitted" : ""}

*
* ); * } * ``` */ function useController(props) { const methods = useFormContext(); const { name, disabled, control = methods.control, shouldUnregister } = props; const isArrayField = isNameInFieldArray(control._names.array, name); const value = useWatch({ control, name, defaultValue: get(control._formValues, name, get(control._defaultValues, name, props.defaultValue)), exact: true, }); const formState = useFormState({ control, name, }); const _registerProps = React.useRef(control.register(name, { ...props.rules, value, ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}), })); React.useEffect(() => { const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister; const updateMounted = (name, value) => { const field = get(control._fields, name); if (field) { field._f.mount = value; } }; updateMounted(name, true); if (_shouldUnregisterField) { const value = cloneObject(get(control._options.defaultValues, name)); set(control._defaultValues, name, value); if (isUndefined(get(control._formValues, name))) { set(control._formValues, name, value); } } return () => { (isArrayField ? _shouldUnregisterField && !control._state.action : _shouldUnregisterField) ? control.unregister(name) : updateMounted(name, false); }; }, [name, control, isArrayField, shouldUnregister]); React.useEffect(() => { if (get(control._fields, name)) { control._updateDisabledField({ disabled, fields: control._fields, name, value: get(control._fields, name)._f.value, }); } }, [disabled, name, control]); return { field: { name, value, ...(isBoolean(disabled) || formState.disabled ? { disabled: formState.disabled || disabled } : {}), onChange: React.useCallback((event) => _registerProps.current.onChange({ target: { value: getEventValue(event), name: name, }, type: EVENTS.CHANGE, }), [name]), onBlur: React.useCallback(() => _registerProps.current.onBlur({ target: { value: get(control._formValues, name), name: name, }, type: EVENTS.BLUR, }), [name, control]), ref: (elm) => { const field = get(control._fields, name); if (field && elm) { field._f.ref = { focus: () => elm.focus(), select: () => elm.select(), setCustomValidity: (message) => elm.setCustomValidity(message), reportValidity: () => elm.reportValidity(), }; } }, }, formState, fieldState: Object.defineProperties({}, { invalid: { enumerable: true, get: () => !!get(formState.errors, name), }, isDirty: { enumerable: true, get: () => !!get(formState.dirtyFields, name), }, isTouched: { enumerable: true, get: () => !!get(formState.touchedFields, name), }, isValidating: { enumerable: true, get: () => !!get(formState.validatingFields, name), }, error: { enumerable: true, get: () => get(formState.errors, name), }, }), }; } /** * Component based on `useController` hook to work with controlled component. * * @remarks * [API](https://react-hook-form.com/docs/usecontroller/controller) • [Demo](https://codesandbox.io/s/react-hook-form-v6-controller-ts-jwyzw) • [Video](https://www.youtube.com/watch?v=N2UNk_UCVyA) * * @param props - the path name to the form field value, and validation rules. * * @returns provide field handler functions, field and form state. * * @example * ```tsx * function App() { * const { control } = useForm({ * defaultValues: { * test: "" * } * }); * * return ( *
* ( * <> * *

{formState.isSubmitted ? "submitted" : ""}

*

{fieldState.isTouched ? "touched" : ""}

* * )} * /> * * ); * } * ``` */ const Controller = (props) => props.render(useController(props)); const POST_REQUEST = 'post'; /** * Form component to manage submission. * * @param props - to setup submission detail. {@link FormProps} * * @returns form component or headless render prop. * * @example * ```tsx * function App() { * const { control, formState: { errors } } = useForm(); * * return ( *
* *

{errors?.root?.server && 'Server error'}

* *
* ); * } * ``` */ function Form(props) { const methods = useFormContext(); const [mounted, setMounted] = React.useState(false); const { control = methods.control, onSubmit, children, action, method = POST_REQUEST, headers, encType, onError, render, onSuccess, validateStatus, ...rest } = props; const submit = async (event) => { let hasError = false; let type = ''; await control.handleSubmit(async (data) => { const formData = new FormData(); let formDataJson = ''; try { formDataJson = JSON.stringify(data); } catch (_a) { } for (const name of control._names.mount) { formData.append(name, get(data, name)); } if (onSubmit) { await onSubmit({ data, event, method, formData, formDataJson, }); } if (action) { try { const shouldStringifySubmissionData = [ headers && headers['Content-Type'], encType, ].some((value) => value && value.includes('json')); const response = await fetch(action, { method, headers: { ...headers, ...(encType ? { 'Content-Type': encType } : {}), }, body: shouldStringifySubmissionData ? formDataJson : formData, }); if (response && (validateStatus ? !validateStatus(response.status) : response.status < 200 || response.status >= 300)) { hasError = true; onError && onError({ response }); type = String(response.status); } else { onSuccess && onSuccess({ response }); } } catch (error) { hasError = true; onError && onError({ error }); } } })(event); if (hasError && props.control) { props.control._subjects.state.next({ isSubmitSuccessful: false, }); props.control.setError('root.server', { type, }); } }; React.useEffect(() => { setMounted(true); }, []); return render ? (React.createElement(React.Fragment, null, render({ submit, }))) : (React.createElement("form", { noValidate: mounted, action: action, method: method, encType: encType, onSubmit: submit, ...rest }, children)); } var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria ? { ...errors[name], types: { ...(errors[name] && errors[name].types ? errors[name].types : {}), [type]: message || true, }, } : {}; var generateId = () => { const d = typeof performance === 'undefined' ? Date.now() : performance.now() * 1000; return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => { const r = (Math.random() * 16 + d) % 16 | 0; return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16); }); }; var getFocusFieldName = (name, index, options = {}) => options.shouldFocus || isUndefined(options.shouldFocus) ? options.focusName || `${name}.${isUndefined(options.focusIndex) ? index : options.focusIndex}.` : ''; var getValidationModes = (mode) => ({ isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit, isOnBlur: mode === VALIDATION_MODE.onBlur, isOnChange: mode === VALIDATION_MODE.onChange, isOnAll: mode === VALIDATION_MODE.all, isOnTouch: mode === VALIDATION_MODE.onTouched, }); var isWatched = (name, _names, isBlurEvent) => !isBlurEvent && (_names.watchAll || _names.watch.has(name) || [..._names.watch].some((watchName) => name.startsWith(watchName) && /^\.\w+/.test(name.slice(watchName.length)))); const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => { for (const key of fieldsNames || Object.keys(fields)) { const field = get(fields, key); if (field) { const { _f, ...currentField } = field; if (_f) { if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) { break; } else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) { break; } else { iterateFieldsByAction(currentField, action); } } else if (isObject(currentField)) { iterateFieldsByAction(currentField, action); } } } }; var updateFieldArrayRootError = (errors, error, name) => { const fieldArrayErrors = compact(get(errors, name)); set(fieldArrayErrors, 'root', error[name]); set(errors, name, fieldArrayErrors); return errors; }; var isFileInput = (element) => element.type === 'file'; var isFunction = (value) => typeof value === 'function'; var isHTMLElement = (value) => { if (!isWeb) { return false; } const owner = value ? value.ownerDocument : 0; return (value instanceof (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement)); }; var isMessage = (value) => isString(value); var isRadioInput = (element) => element.type === 'radio'; var isRegex = (value) => value instanceof RegExp; const defaultResult = { value: false, isValid: false, }; const validResult = { value: true, isValid: true }; var getCheckboxValue = (options) => { if (Array.isArray(options)) { if (options.length > 1) { const values = options .filter((option) => option && option.checked && !option.disabled) .map((option) => option.value); return { value: values, isValid: !!values.length }; } return options[0].checked && !options[0].disabled ? // @ts-expect-error expected to work in the browser options[0].attributes && !isUndefined(options[0].attributes.value) ? isUndefined(options[0].value) || options[0].value === '' ? validResult : { value: options[0].value, isValid: true } : validResult : defaultResult; } return defaultResult; }; const defaultReturn = { isValid: false, value: null, }; var getRadioValue = (options) => Array.isArray(options) ? options.reduce((previous, option) => option && option.checked && !option.disabled ? { isValid: true, value: option.value, } : previous, defaultReturn) : defaultReturn; function getValidateError(result, ref, type = 'validate') { if (isMessage(result) || (Array.isArray(result) && result.every(isMessage)) || (isBoolean(result) && !result)) { return { type, message: isMessage(result) ? result : '', ref, }; } } var getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData) ? validationData : { value: validationData, message: '', }; var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => { const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled, } = field._f; const inputValue = get(formValues, name); if (!mount || disabled) { return {}; } const inputRef = refs ? refs[0] : ref; const setCustomValidity = (message) => { if (shouldUseNativeValidation && inputRef.reportValidity) { inputRef.setCustomValidity(isBoolean(message) ? '' : message || ''); inputRef.reportValidity(); } }; const error = {}; const isRadio = isRadioInput(ref); const isCheckBox = isCheckBoxInput(ref); const isRadioOrCheckbox = isRadio || isCheckBox; const isEmpty = ((valueAsNumber || isFileInput(ref)) && isUndefined(ref.value) && isUndefined(inputValue)) || (isHTMLElement(ref) && ref.value === '') || inputValue === '' || (Array.isArray(inputValue) && !inputValue.length); const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error); const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => { const message = exceedMax ? maxLengthMessage : minLengthMessage; error[name] = { type: exceedMax ? maxType : minType, message, ref, ...appendErrorsCurry(exceedMax ? maxType : minType, message), }; }; if (isFieldArray ? !Array.isArray(inputValue) || !inputValue.length : required && ((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) || (isBoolean(inputValue) && !inputValue) || (isCheckBox && !getCheckboxValue(refs).isValid) || (isRadio && !getRadioValue(refs).isValid))) { const { value, message } = isMessage(required) ? { value: !!required, message: required } : getValueAndMessage(required); if (value) { error[name] = { type: INPUT_VALIDATION_RULES.required, message, ref: inputRef, ...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message), }; if (!validateAllFieldCriteria) { setCustomValidity(message); return error; } } } if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) { let exceedMax; let exceedMin; const maxOutput = getValueAndMessage(max); const minOutput = getValueAndMessage(min); if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) { const valueNumber = ref.valueAsNumber || (inputValue ? +inputValue : inputValue); if (!isNullOrUndefined(maxOutput.value)) { exceedMax = valueNumber > maxOutput.value; } if (!isNullOrUndefined(minOutput.value)) { exceedMin = valueNumber < minOutput.value; } } else { const valueDate = ref.valueAsDate || new Date(inputValue); const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time); const isTime = ref.type == 'time'; const isWeek = ref.type == 'week'; if (isString(maxOutput.value) && inputValue) { exceedMax = isTime ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value) : isWeek ? inputValue > maxOutput.value : valueDate > new Date(maxOutput.value); } if (isString(minOutput.value) && inputValue) { exceedMin = isTime ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value) : isWeek ? inputValue < minOutput.value : valueDate < new Date(minOutput.value); } } if (exceedMax || exceedMin) { getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min); if (!validateAllFieldCriteria) { setCustomValidity(error[name].message); return error; } } } if ((maxLength || minLength) && !isEmpty && (isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) { const maxLengthOutput = getValueAndMessage(maxLength); const minLengthOutput = getValueAndMessage(minLength); const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && inputValue.length > +maxLengthOutput.value; const exceedMin = !isNullOrUndefined(minLengthOutput.value) && inputValue.length < +minLengthOutput.value; if (exceedMax || exceedMin) { getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message); if (!validateAllFieldCriteria) { setCustomValidity(error[name].message); return error; } } } if (pattern && !isEmpty && isString(inputValue)) { const { value: patternValue, message } = getValueAndMessage(pattern); if (isRegex(patternValue) && !inputValue.match(patternValue)) { error[name] = { type: INPUT_VALIDATION_RULES.pattern, message, ref, ...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message), }; if (!validateAllFieldCriteria) { setCustomValidity(message); return error; } } } if (validate) { if (isFunction(validate)) { const result = await validate(inputValue, formValues); const validateError = getValidateError(result, inputRef); if (validateError) { error[name] = { ...validateError, ...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message), }; if (!validateAllFieldCriteria) { setCustomValidity(validateError.message); return error; } } } else if (isObject(validate)) { let validationResult = {}; for (const key in validate) { if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) { break; } const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key); if (validateError) { validationResult = { ...validateError, ...appendErrorsCurry(key, validateError.message), }; setCustomValidity(validateError.message); if (validateAllFieldCriteria) { error[name] = validationResult; } } } if (!isEmptyObject(validationResult)) { error[name] = { ref: inputRef, ...validationResult, }; if (!validateAllFieldCriteria) { return error; } } } } setCustomValidity(true); return error; }; var appendAt = (data, value) => [ ...data, ...convertToArrayPayload(value), ]; var fillEmptyArray = (value) => Array.isArray(value) ? value.map(() => undefined) : undefined; function insert(data, index, value) { return [ ...data.slice(0, index), ...convertToArrayPayload(value), ...data.slice(index), ]; } var moveArrayAt = (data, from, to) => { if (!Array.isArray(data)) { return []; } if (isUndefined(data[to])) { data[to] = undefined; } data.splice(to, 0, data.splice(from, 1)[0]); return data; }; var prependAt = (data, value) => [ ...convertToArrayPayload(value), ...convertToArrayPayload(data), ]; function removeAtIndexes(data, indexes) { let i = 0; const temp = [...data]; for (const index of indexes) { temp.splice(index - i, 1); i++; } return compact(temp).length ? temp : []; } var removeArrayAt = (data, index) => isUndefined(index) ? [] : removeAtIndexes(data, convertToArrayPayload(index).sort((a, b) => a - b)); var swapArrayAt = (data, indexA, indexB) => { [data[indexA], data[indexB]] = [data[indexB], data[indexA]]; }; function baseGet(object, updatePath) { const length = updatePath.slice(0, -1).length; let index = 0; while (index < length) { object = isUndefined(object) ? index++ : object[updatePath[index++]]; } return object; } function isEmptyArray(obj) { for (const key in obj) { if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) { return false; } } return true; } function unset(object, path) { const paths = Array.isArray(path) ? path : isKey(path) ? [path] : stringToPath(path); const childObject = paths.length === 1 ? object : baseGet(object, paths); const index = paths.length - 1; const key = paths[index]; if (childObject) { delete childObject[key]; } if (index !== 0 && ((isObject(childObject) && isEmptyObject(childObject)) || (Array.isArray(childObject) && isEmptyArray(childObject)))) { unset(object, paths.slice(0, -1)); } return object; } var updateAt = (fieldValues, index, value) => { fieldValues[index] = value; return fieldValues; }; /** * A custom hook that exposes convenient methods to perform operations with a list of dynamic inputs that need to be appended, updated, removed etc. • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) • [Video](https://youtu.be/4MrbfGSFY2A) * * @remarks * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) * * @param props - useFieldArray props * * @returns methods - functions to manipulate with the Field Arrays (dynamic inputs) {@link UseFieldArrayReturn} * * @example * ```tsx * function App() { * const { register, control, handleSubmit, reset, trigger, setError } = useForm({ * defaultValues: { * test: [] * } * }); * const { fields, append } = useFieldArray({ * control, * name: "test" * }); * * return ( *
console.log(data))}> * {fields.map((item, index) => ( * * ))} * * *
* ); * } * ``` */ function useFieldArray(props) { const methods = useFormContext(); const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props; const [fields, setFields] = React.useState(control._getFieldArray(name)); const ids = React.useRef(control._getFieldArray(name).map(generateId)); const _fieldIds = React.useRef(fields); const _name = React.useRef(name); const _actioned = React.useRef(false); _name.current = name; _fieldIds.current = fields; control._names.array.add(name); props.rules && control.register(name, props.rules); useSubscribe({ next: ({ values, name: fieldArrayName, }) => { if (fieldArrayName === _name.current || !fieldArrayName) { const fieldValues = get(values, _name.current); if (Array.isArray(fieldValues)) { setFields(fieldValues); ids.current = fieldValues.map(generateId); } } }, subject: control._subjects.array, }); const updateValues = React.useCallback((updatedFieldArrayValues) => { _actioned.current = true; control._updateFieldArray(name, updatedFieldArrayValues); }, [control, name]); const append = (value, options) => { const appendValue = convertToArrayPayload(cloneObject(value)); const updatedFieldArrayValues = appendAt(control._getFieldArray(name), appendValue); control._names.focus = getFocusFieldName(name, updatedFieldArrayValues.length - 1, options); ids.current = appendAt(ids.current, appendValue.map(generateId)); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, appendAt, { argA: fillEmptyArray(value), }); }; const prepend = (value, options) => { const prependValue = convertToArrayPayload(cloneObject(value)); const updatedFieldArrayValues = prependAt(control._getFieldArray(name), prependValue); control._names.focus = getFocusFieldName(name, 0, options); ids.current = prependAt(ids.current, prependValue.map(generateId)); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, prependAt, { argA: fillEmptyArray(value), }); }; const remove = (index) => { const updatedFieldArrayValues = removeArrayAt(control._getFieldArray(name), index); ids.current = removeArrayAt(ids.current, index); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, { argA: index, }); }; const insert$1 = (index, value, options) => { const insertValue = convertToArrayPayload(cloneObject(value)); const updatedFieldArrayValues = insert(control._getFieldArray(name), index, insertValue); control._names.focus = getFocusFieldName(name, index, options); ids.current = insert(ids.current, index, insertValue.map(generateId)); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, insert, { argA: index, argB: fillEmptyArray(value), }); }; const swap = (indexA, indexB) => { const updatedFieldArrayValues = control._getFieldArray(name); swapArrayAt(updatedFieldArrayValues, indexA, indexB); swapArrayAt(ids.current, indexA, indexB); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, swapArrayAt, { argA: indexA, argB: indexB, }, false); }; const move = (from, to) => { const updatedFieldArrayValues = control._getFieldArray(name); moveArrayAt(updatedFieldArrayValues, from, to); moveArrayAt(ids.current, from, to); updateValues(updatedFieldArrayValues); setFields(updatedFieldArrayValues); control._updateFieldArray(name, updatedFieldArrayValues, moveArrayAt, { argA: from, argB: to, }, false); }; const update = (index, value) => { const updateValue = cloneObject(value); const updatedFieldArrayValues = updateAt(control._getFieldArray(name), index, updateValue); ids.current = [...updatedFieldArrayValues].map((item, i) => !item || i === index ? generateId() : ids.current[i]); updateValues(updatedFieldArrayValues); setFields([...updatedFieldArrayValues]); control._updateFieldArray(name, updatedFieldArrayValues, updateAt, { argA: index, argB: updateValue, }, true, false); }; const replace = (value) => { const updatedFieldArrayValues = convertToArrayPayload(cloneObject(value)); ids.current = updatedFieldArrayValues.map(generateId); updateValues([...updatedFieldArrayValues]); setFields([...updatedFieldArrayValues]); control._updateFieldArray(name, [...updatedFieldArrayValues], (data) => data, {}, true, false); }; React.useEffect(() => { control._state.action = false; isWatched(name, control._names) && control._subjects.state.next({ ...control._formState, }); if (_actioned.current && (!getValidationModes(control._options.mode).isOnSubmit || control._formState.isSubmitted)) { if (control._options.resolver) { control._executeSchema([name]).then((result) => { const error = get(result.errors, name); const existingError = get(control._formState.errors, name); if (existingError ? (!error && existingError.type) || (error && (existingError.type !== error.type || existingError.message !== error.message)) : error && error.type) { error ? set(control._formState.errors, name, error) : unset(control._formState.errors, name); control._subjects.state.next({ errors: control._formState.errors, }); } }); } else { const field = get(control._fields, name); if (field && field._f && !(getValidationModes(control._options.reValidateMode).isOnSubmit && getValidationModes(control._options.mode).isOnSubmit)) { validateField(field, control._formValues, control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error) => !isEmptyObject(error) && control._subjects.state.next({ errors: updateFieldArrayRootError(control._formState.errors, error, name), })); } } } control._subjects.values.next({ name, values: { ...control._formValues }, }); control._names.focus && iterateFieldsByAction(control._fields, (ref, key) => { if (control._names.focus && key.startsWith(control._names.focus) && ref.focus) { ref.focus(); return 1; } return; }); control._names.focus = ''; control._updateValid(); _actioned.current = false; }, [fields, name, control]); React.useEffect(() => { !get(control._formValues, name) && control._updateFieldArray(name); return () => { (control._options.shouldUnregister || shouldUnregister) && control.unregister(name); }; }, [name, control, keyName, shouldUnregister]); return { swap: React.useCallback(swap, [updateValues, name, control]), move: React.useCallback(move, [updateValues, name, control]), prepend: React.useCallback(prepend, [updateValues, name, control]), append: React.useCallback(append, [updateValues, name, control]), remove: React.useCallback(remove, [updateValues, name, control]), insert: React.useCallback(insert$1, [updateValues, name, control]), update: React.useCallback(update, [updateValues, name, control]), replace: React.useCallback(replace, [updateValues, name, control]), fields: React.useMemo(() => fields.map((field, index) => ({ ...field, [keyName]: ids.current[index] || generateId(), })), [fields, keyName]), }; } var createSubject = () => { let _observers = []; const next = (value) => { for (const observer of _observers) { observer.next && observer.next(value); } }; const subscribe = (observer) => { _observers.push(observer); return { unsubscribe: () => { _observers = _observers.filter((o) => o !== observer); }, }; }; const unsubscribe = () => { _observers = []; }; return { get observers() { return _observers; }, next, subscribe, unsubscribe, }; }; var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value); function deepEqual(object1, object2) { if (isPrimitive(object1) || isPrimitive(object2)) { return object1 === object2; } if (isDateObject(object1) && isDateObject(object2)) { return object1.getTime() === object2.getTime(); } const keys1 = Object.keys(object1); const keys2 = Object.keys(object2); if (keys1.length !== keys2.length) { return false; } for (const key of keys1) { const val1 = object1[key]; if (!keys2.includes(key)) { return false; } if (key !== 'ref') { const val2 = object2[key]; if ((isDateObject(val1) && isDateObject(val2)) || (isObject(val1) && isObject(val2)) || (Array.isArray(val1) && Array.isArray(val2)) ? !deepEqual(val1, val2) : val1 !== val2) { return false; } } } return true; } var isMultipleSelect = (element) => element.type === `select-multiple`; var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref); var live = (ref) => isHTMLElement(ref) && ref.isConnected; var objectHasFunction = (data) => { for (const key in data) { if (isFunction(data[key])) { return true; } } return false; }; function markFieldsDirty(data, fields = {}) { const isParentNodeArray = Array.isArray(data); if (isObject(data) || isParentNodeArray) { for (const key in data) { if (Array.isArray(data[key]) || (isObject(data[key]) && !objectHasFunction(data[key]))) { fields[key] = Array.isArray(data[key]) ? [] : {}; markFieldsDirty(data[key], fields[key]); } else if (!isNullOrUndefined(data[key])) { fields[key] = true; } } } return fields; } function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) { const isParentNodeArray = Array.isArray(data); if (isObject(data) || isParentNodeArray) { for (const key in data) { if (Array.isArray(data[key]) || (isObject(data[key]) && !objectHasFunction(data[key]))) { if (isUndefined(formValues) || isPrimitive(dirtyFieldsFromValues[key])) { dirtyFieldsFromValues[key] = Array.isArray(data[key]) ? markFieldsDirty(data[key], []) : { ...markFieldsDirty(data[key]) }; } else { getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]); } } else { dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]); } } } return dirtyFieldsFromValues; } var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues)); var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value) ? value : valueAsNumber ? value === '' ? NaN : value ? +value : value : valueAsDate && isString(value) ? new Date(value) : setValueAs ? setValueAs(value) : value; function getFieldValue(_f) { const ref = _f.ref; if (_f.refs ? _f.refs.every((ref) => ref.disabled) : ref.disabled) { return; } if (isFileInput(ref)) { return ref.files; } if (isRadioInput(ref)) { return getRadioValue(_f.refs).value; } if (isMultipleSelect(ref)) { return [...ref.selectedOptions].map(({ value }) => value); } if (isCheckBoxInput(ref)) { return getCheckboxValue(_f.refs).value; } return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f); } var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => { const fields = {}; for (const name of fieldsNames) { const field = get(_fields, name); field && set(fields, name, field._f); } return { criteriaMode, names: [...fieldsNames], fields, shouldUseNativeValidation, }; }; var getRuleValue = (rule) => isUndefined(rule) ? rule : isRegex(rule) ? rule.source : isObject(rule) ? isRegex(rule.value) ? rule.value.source : rule.value : rule; var hasValidation = (options) => options.mount && (options.required || options.min || options.max || options.maxLength || options.minLength || options.pattern || options.validate); function schemaErrorLookup(errors, _fields, name) { const error = get(errors, name); if (error || isKey(name)) { return { error, name, }; } const names = name.split('.'); while (names.length) { const fieldName = names.join('.'); const field = get(_fields, fieldName); const foundError = get(errors, fieldName); if (field && !Array.isArray(field) && name !== fieldName) { return { name }; } if (foundError && foundError.type) { return { name: fieldName, error: foundError, }; } names.pop(); } return { name, }; } var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => { if (mode.isOnAll) { return false; } else if (!isSubmitted && mode.isOnTouch) { return !(isTouched || isBlurEvent); } else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) { return !isBlurEvent; } else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) { return isBlurEvent; } return true; }; var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name); const defaultOptions = { mode: VALIDATION_MODE.onSubmit, reValidateMode: VALIDATION_MODE.onChange, shouldFocusError: true, }; function createFormControl(props = {}) { let _options = { ...defaultOptions, ...props, }; let _formState = { submitCount: 0, isDirty: false, isLoading: isFunction(_options.defaultValues), isValidating: false, isSubmitted: false, isSubmitting: false, isSubmitSuccessful: false, isValid: false, touchedFields: {}, dirtyFields: {}, validatingFields: {}, errors: _options.errors || {}, disabled: _options.disabled || false, }; let _fields = {}; let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values) ? cloneObject(_options.defaultValues || _options.values) || {} : {}; let _formValues = _options.shouldUnregister ? {} : cloneObject(_defaultValues); let _state = { action: false, mount: false, watch: false, }; let _names = { mount: new Set(), unMount: new Set(), array: new Set(), watch: new Set(), }; let delayErrorCallback; let timer = 0; const _proxyFormState = { isDirty: false, dirtyFields: false, validatingFields: false, touchedFields: false, isValidating: false, isValid: false, errors: false, }; const _subjects = { values: createSubject(), array: createSubject(), state: createSubject(), }; const validationModeBeforeSubmit = getValidationModes(_options.mode); const validationModeAfterSubmit = getValidationModes(_options.reValidateMode); const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all; const debounce = (callback) => (wait) => { clearTimeout(timer); timer = setTimeout(callback, wait); }; const _updateValid = async (shouldUpdateValid) => { if (_proxyFormState.isValid || shouldUpdateValid) { const isValid = _options.resolver ? isEmptyObject((await _executeSchema()).errors) : await executeBuiltInValidation(_fields, true); if (isValid !== _formState.isValid) { _subjects.state.next({ isValid, }); } } }; const _updateIsValidating = (names, isValidating) => { if (_proxyFormState.isValidating || _proxyFormState.validatingFields) { (names || Array.from(_names.mount)).forEach((name) => { if (name) { isValidating ? set(_formState.validatingFields, name, isValidating) : unset(_formState.validatingFields, name); } }); _subjects.state.next({ validatingFields: _formState.validatingFields, isValidating: !isEmptyObject(_formState.validatingFields), }); } }; const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => { if (args && method) { _state.action = true; if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) { const fieldValues = method(get(_fields, name), args.argA, args.argB); shouldSetValues && set(_fields, name, fieldValues); } if (shouldUpdateFieldsAndState && Array.isArray(get(_formState.errors, name))) { const errors = method(get(_formState.errors, name), args.argA, args.argB); shouldSetValues && set(_formState.errors, name, errors); unsetEmptyArray(_formState.errors, name); } if (_proxyFormState.touchedFields && shouldUpdateFieldsAndState && Array.isArray(get(_formState.touchedFields, name))) { const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB); shouldSetValues && set(_formState.touchedFields, name, touchedFields); } if (_proxyFormState.dirtyFields) { _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues); } _subjects.state.next({ name, isDirty: _getDirty(name, values), dirtyFields: _formState.dirtyFields, errors: _formState.errors, isValid: _formState.isValid, }); } else { set(_formValues, name, values); } }; const updateErrors = (name, error) => { set(_formState.errors, name, error); _subjects.state.next({ errors: _formState.errors, }); }; const _setErrors = (errors) => { _formState.errors = errors; _subjects.state.next({ errors: _formState.errors, isValid: false, }); }; const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => { const field = get(_fields, name); if (field) { const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value); isUndefined(defaultValue) || (ref && ref.defaultChecked) || shouldSkipSetValueAs ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f)) : setFieldValue(name, defaultValue); _state.mount && _updateValid(); } }; const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => { let shouldUpdateField = false; let isPreviousDirty = false; const output = { name, }; const disabledField = !!(get(_fields, name) && get(_fields, name)._f.disabled); if (!isBlurEvent || shouldDirty) { if (_proxyFormState.isDirty) { isPreviousDirty = _formState.isDirty; _formState.isDirty = output.isDirty = _getDirty(); shouldUpdateField = isPreviousDirty !== output.isDirty; } const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue); isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name)); isCurrentFieldPristine || disabledField ? unset(_formState.dirtyFields, name) : set(_formState.dirtyFields, name, true); output.dirtyFields = _formState.dirtyFields; shouldUpdateField = shouldUpdateField || (_proxyFormState.dirtyFields && isPreviousDirty !== !isCurrentFieldPristine); } if (isBlurEvent) { const isPreviousFieldTouched = get(_formState.touchedFields, name); if (!isPreviousFieldTouched) { set(_formState.touchedFields, name, isBlurEvent); output.touchedFields = _formState.touchedFields; shouldUpdateField = shouldUpdateField || (_proxyFormState.touchedFields && isPreviousFieldTouched !== isBlurEvent); } } shouldUpdateField && shouldRender && _subjects.state.next(output); return shouldUpdateField ? output : {}; }; const shouldRenderByError = (name, isValid, error, fieldState) => { const previousFieldError = get(_formState.errors, name); const shouldUpdateValid = _proxyFormState.isValid && isBoolean(isValid) && _formState.isValid !== isValid; if (props.delayError && error) { delayErrorCallback = debounce(() => updateErrors(name, error)); delayErrorCallback(props.delayError); } else { clearTimeout(timer); delayErrorCallback = null; error ? set(_formState.errors, name, error) : unset(_formState.errors, name); } if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) || !isEmptyObject(fieldState) || shouldUpdateValid) { const updatedFormState = { ...fieldState, ...(shouldUpdateValid && isBoolean(isValid) ? { isValid } : {}), errors: _formState.errors, name, }; _formState = { ..._formState, ...updatedFormState, }; _subjects.state.next(updatedFormState); } }; const _executeSchema = async (name) => { _updateIsValidating(name, true); const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation)); _updateIsValidating(name); return result; }; const executeSchemaAndUpdateState = async (names) => { const { errors } = await _executeSchema(names); if (names) { for (const name of names) { const error = get(errors, name); error ? set(_formState.errors, name, error) : unset(_formState.errors, name); } } else { _formState.errors = errors; } return errors; }; const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = { valid: true, }) => { for (const name in fields) { const field = fields[name]; if (field) { const { _f, ...fieldValue } = field; if (_f) { const isFieldArrayRoot = _names.array.has(_f.name); _updateIsValidating([name], true); const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot); _updateIsValidating([name]); if (fieldError[_f.name]) { context.valid = false; if (shouldOnlyCheckValid) { break; } } !shouldOnlyCheckValid && (get(fieldError, _f.name) ? isFieldArrayRoot ? updateFieldArrayRootError(_formState.errors, fieldError, _f.name) : set(_formState.errors, _f.name, fieldError[_f.name]) : unset(_formState.errors, _f.name)); } fieldValue && (await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context)); } } return context.valid; }; const _removeUnmounted = () => { for (const name of _names.unMount) { const field = get(_fields, name); field && (field._f.refs ? field._f.refs.every((ref) => !live(ref)) : !live(field._f.ref)) && unregister(name); } _names.unMount = new Set(); }; const _getDirty = (name, data) => (name && data && set(_formValues, name, data), !deepEqual(getValues(), _defaultValues)); const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, { ...(_state.mount ? _formValues : isUndefined(defaultValue) ? _defaultValues : isString(names) ? { [names]: defaultValue } : defaultValue), }, isGlobal, defaultValue); const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : [])); const setFieldValue = (name, value, options = {}) => { const field = get(_fields, name); let fieldValue = value; if (field) { const fieldReference = field._f; if (fieldReference) { !fieldReference.disabled && set(_formValues, name, getFieldValueAs(value, fieldReference)); fieldValue = isHTMLElement(fieldReference.ref) && isNullOrUndefined(value) ? '' : value; if (isMultipleSelect(fieldReference.ref)) { [...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value))); } else if (fieldReference.refs) { if (isCheckBoxInput(fieldReference.ref)) { fieldReference.refs.length > 1 ? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) && (checkboxRef.checked = Array.isArray(fieldValue) ? !!fieldValue.find((data) => data === checkboxRef.value) : fieldValue === checkboxRef.value)) : fieldReference.refs[0] && (fieldReference.refs[0].checked = !!fieldValue); } else { fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue)); } } else if (isFileInput(fieldReference.ref)) { fieldReference.ref.value = ''; } else { fieldReference.ref.value = fieldValue; if (!fieldReference.ref.type) { _subjects.values.next({ name, values: { ..._formValues }, }); } } } } (options.shouldDirty || options.shouldTouch) && updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true); options.shouldValidate && trigger(name); }; const setValues = (name, value, options) => { for (const fieldKey in value) { const fieldValue = value[fieldKey]; const fieldName = `${name}.${fieldKey}`; const field = get(_fields, fieldName); (_names.array.has(name) || !isPrimitive(fieldValue) || (field && !field._f)) && !isDateObject(fieldValue) ? setValues(fieldName, fieldValue, options) : setFieldValue(fieldName, fieldValue, options); } }; const setValue = (name, value, options = {}) => { const field = get(_fields, name); const isFieldArray = _names.array.has(name); const cloneValue = cloneObject(value); set(_formValues, name, cloneValue); if (isFieldArray) { _subjects.array.next({ name, values: { ..._formValues }, }); if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) && options.shouldDirty) { _subjects.state.next({ name, dirtyFields: getDirtyFields(_defaultValues, _formValues), isDirty: _getDirty(name, cloneValue), }); } } else { field && !field._f && !isNullOrUndefined(cloneValue) ? setValues(name, cloneValue, options) : setFieldValue(name, cloneValue, options); } isWatched(name, _names) && _subjects.state.next({ ..._formState }); _subjects.values.next({ name: _state.mount ? name : undefined, values: { ..._formValues }, }); }; const onChange = async (event) => { _state.mount = true; const target = event.target; let name = target.name; let isFieldValueUpdated = true; const field = get(_fields, name); const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event); const _updateIsFieldValueUpdated = (fieldValue) => { isFieldValueUpdated = Number.isNaN(fieldValue) || fieldValue === get(_formValues, name, fieldValue); }; if (field) { let error; let isValid; const fieldValue = getCurrentFieldValue(); const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT; const shouldSkipValidation = (!hasValidation(field._f) && !_options.resolver && !get(_formState.errors, name) && !field._f.deps) || skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit); const watched = isWatched(name, _names, isBlurEvent); set(_formValues, name, fieldValue); if (isBlurEvent) { field._f.onBlur && field._f.onBlur(event); delayErrorCallback && delayErrorCallback(0); } else if (field._f.onChange) { field._f.onChange(event); } const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false); const shouldRender = !isEmptyObject(fieldState) || watched; !isBlurEvent && _subjects.values.next({ name, type: event.type, values: { ..._formValues }, }); if (shouldSkipValidation) { _proxyFormState.isValid && _updateValid(); return (shouldRender && _subjects.state.next({ name, ...(watched ? {} : fieldState) })); } !isBlurEvent && watched && _subjects.state.next({ ..._formState }); if (_options.resolver) { const { errors } = await _executeSchema([name]); _updateIsFieldValueUpdated(fieldValue); if (isFieldValueUpdated) { const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name); const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name); error = errorLookupResult.error; name = errorLookupResult.name; isValid = isEmptyObject(errors); } } else { _updateIsValidating([name], true); error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name]; _updateIsValidating([name]); _updateIsFieldValueUpdated(fieldValue); if (isFieldValueUpdated) { if (error) { isValid = false; } else if (_proxyFormState.isValid) { isValid = await executeBuiltInValidation(_fields, true); } } } if (isFieldValueUpdated) { field._f.deps && trigger(field._f.deps); shouldRenderByError(name, isValid, error, fieldState); } } }; const _focusInput = (ref, key) => { if (get(_formState.errors, key) && ref.focus) { ref.focus(); return 1; } return; }; const trigger = async (name, options = {}) => { let isValid; let validationResult; const fieldNames = convertToArrayPayload(name); if (_options.resolver) { const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames); isValid = isEmptyObject(errors); validationResult = name ? !fieldNames.some((name) => get(errors, name)) : isValid; } else if (name) { validationResult = (await Promise.all(fieldNames.map(async (fieldName) => { const field = get(_fields, fieldName); return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field); }))).every(Boolean); !(!validationResult && !_formState.isValid) && _updateValid(); } else { validationResult = isValid = await executeBuiltInValidation(_fields); } _subjects.state.next({ ...(!isString(name) || (_proxyFormState.isValid && isValid !== _formState.isValid) ? {} : { name }), ...(_options.resolver || !name ? { isValid } : {}), errors: _formState.errors, }); options.shouldFocus && !validationResult && iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount); return validationResult; }; const getValues = (fieldNames) => { const values = { ...(_state.mount ? _formValues : _defaultValues), }; return isUndefined(fieldNames) ? values : isString(fieldNames) ? get(values, fieldNames) : fieldNames.map((name) => get(values, name)); }; const getFieldState = (name, formState) => ({ invalid: !!get((formState || _formState).errors, name), isDirty: !!get((formState || _formState).dirtyFields, name), isTouched: !!get((formState || _formState).touchedFields, name), isValidating: !!get((formState || _formState).validatingFields, name), error: get((formState || _formState).errors, name), }); const clearErrors = (name) => { name && convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName)); _subjects.state.next({ errors: name ? _formState.errors : {}, }); }; const setError = (name, error, options) => { const ref = (get(_fields, name, { _f: {} })._f || {}).ref; set(_formState.errors, name, { ...error, ref, }); _subjects.state.next({ name, errors: _formState.errors, isValid: false, }); options && options.shouldFocus && ref && ref.focus && ref.focus(); }; const watch = (name, defaultValue) => isFunction(name) ? _subjects.values.subscribe({ next: (payload) => name(_getWatch(undefined, defaultValue), payload), }) : _getWatch(name, defaultValue, true); const unregister = (name, options = {}) => { for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) { _names.mount.delete(fieldName); _names.array.delete(fieldName); if (!options.keepValue) { unset(_fields, fieldName); unset(_formValues, fieldName); } !options.keepError && unset(_formState.errors, fieldName); !options.keepDirty && unset(_formState.dirtyFields, fieldName); !options.keepTouched && unset(_formState.touchedFields, fieldName); !options.keepIsValidating && unset(_formState.validatingFields, fieldName); !_options.shouldUnregister && !options.keepDefaultValue && unset(_defaultValues, fieldName); } _subjects.values.next({ values: { ..._formValues }, }); _subjects.state.next({ ..._formState, ...(!options.keepDirty ? {} : { isDirty: _getDirty() }), }); !options.keepIsValid && _updateValid(); }; const _updateDisabledField = ({ disabled, name, field, fields, value, }) => { if (isBoolean(disabled)) { const inputValue = disabled ? undefined : isUndefined(value) ? getFieldValue(field ? field._f : get(fields, name)._f) : value; set(_formValues, name, inputValue); updateTouchAndDirty(name, inputValue, false, false, true); } }; const register = (name, options = {}) => { let field = get(_fields, name); const disabledIsDefined = isBoolean(options.disabled); set(_fields, name, { ...(field || {}), _f: { ...(field && field._f ? field._f : { ref: { name } }), name, mount: true, ...options, }, }); _names.mount.add(name); if (field) { _updateDisabledField({ field, disabled: options.disabled, name, value: options.value, }); } else { updateValidAndValue(name, true, options.value); } return { ...(disabledIsDefined ? { disabled: options.disabled } : {}), ...(_options.progressive ? { required: !!options.required, min: getRuleValue(options.min), max: getRuleValue(options.max), minLength: getRuleValue(options.minLength), maxLength: getRuleValue(options.maxLength), pattern: getRuleValue(options.pattern), } : {}), name, onChange, onBlur: onChange, ref: (ref) => { if (ref) { register(name, options); field = get(_fields, name); const fieldRef = isUndefined(ref.value) ? ref.querySelectorAll ? ref.querySelectorAll('input,select,textarea')[0] || ref : ref : ref; const radioOrCheckbox = isRadioOrCheckbox(fieldRef); const refs = field._f.refs || []; if (radioOrCheckbox ? refs.find((option) => option === fieldRef) : fieldRef === field._f.ref) { return; } set(_fields, name, { _f: { ...field._f, ...(radioOrCheckbox ? { refs: [ ...refs.filter(live), fieldRef, ...(Array.isArray(get(_defaultValues, name)) ? [{}] : []), ], ref: { type: fieldRef.type, name }, } : { ref: fieldRef }), }, }); updateValidAndValue(name, false, undefined, fieldRef); } else { field = get(_fields, name, {}); if (field._f) { field._f.mount = false; } (_options.shouldUnregister || options.shouldUnregister) && !(isNameInFieldArray(_names.array, name) && _state.action) && _names.unMount.add(name); } }, }; }; const _focusError = () => _options.shouldFocusError && iterateFieldsByAction(_fields, _focusInput, _names.mount); const _disableForm = (disabled) => { if (isBoolean(disabled)) { _subjects.state.next({ disabled }); iterateFieldsByAction(_fields, (ref, name) => { let requiredDisabledState = disabled; const currentField = get(_fields, name); if (currentField && isBoolean(currentField._f.disabled)) { requiredDisabledState || (requiredDisabledState = currentField._f.disabled); } ref.disabled = requiredDisabledState; }, 0, false); } }; const handleSubmit = (onValid, onInvalid) => async (e) => { let onValidError = undefined; if (e) { e.preventDefault && e.preventDefault(); e.persist && e.persist(); } let fieldValues = cloneObject(_formValues); _subjects.state.next({ isSubmitting: true, }); if (_options.resolver) { const { errors, values } = await _executeSchema(); _formState.errors = errors; fieldValues = values; } else { await executeBuiltInValidation(_fields); } unset(_formState.errors, 'root'); if (isEmptyObject(_formState.errors)) { _subjects.state.next({ errors: {}, }); try { await onValid(fieldValues, e); } catch (error) { onValidError = error; } } else { if (onInvalid) { await onInvalid({ ..._formState.errors }, e); } _focusError(); setTimeout(_focusError); } _subjects.state.next({ isSubmitted: true, isSubmitting: false, isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError, submitCount: _formState.submitCount + 1, errors: _formState.errors, }); if (onValidError) { throw onValidError; } }; const resetField = (name, options = {}) => { if (get(_fields, name)) { if (isUndefined(options.defaultValue)) { setValue(name, cloneObject(get(_defaultValues, name))); } else { setValue(name, options.defaultValue); set(_defaultValues, name, cloneObject(options.defaultValue)); } if (!options.keepTouched) { unset(_formState.touchedFields, name); } if (!options.keepDirty) { unset(_formState.dirtyFields, name); _formState.isDirty = options.defaultValue ? _getDirty(name, cloneObject(get(_defaultValues, name))) : _getDirty(); } if (!options.keepError) { unset(_formState.errors, name); _proxyFormState.isValid && _updateValid(); } _subjects.state.next({ ..._formState }); } }; const _reset = (formValues, keepStateOptions = {}) => { const updatedValues = formValues ? cloneObject(formValues) : _defaultValues; const cloneUpdatedValues = cloneObject(updatedValues); const isEmptyResetValues = isEmptyObject(formValues); const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues; if (!keepStateOptions.keepDefaultValues) { _defaultValues = updatedValues; } if (!keepStateOptions.keepValues) { if (keepStateOptions.keepDirtyValues) { for (const fieldName of _names.mount) { get(_formState.dirtyFields, fieldName) ? set(values, fieldName, get(_formValues, fieldName)) : setValue(fieldName, get(values, fieldName)); } } else { if (isWeb && isUndefined(formValues)) { for (const name of _names.mount) { const field = get(_fields, name); if (field && field._f) { const fieldReference = Array.isArray(field._f.refs) ? field._f.refs[0] : field._f.ref; if (isHTMLElement(fieldReference)) { const form = fieldReference.closest('form'); if (form) { form.reset(); break; } } } } } _fields = {}; } _formValues = props.shouldUnregister ? keepStateOptions.keepDefaultValues ? cloneObject(_defaultValues) : {} : cloneObject(values); _subjects.array.next({ values: { ...values }, }); _subjects.values.next({ values: { ...values }, }); } _names = { mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(), unMount: new Set(), array: new Set(), watch: new Set(), watchAll: false, focus: '', }; _state.mount = !_proxyFormState.isValid || !!keepStateOptions.keepIsValid || !!keepStateOptions.keepDirtyValues; _state.watch = !!props.shouldUnregister; _subjects.state.next({ submitCount: keepStateOptions.keepSubmitCount ? _formState.submitCount : 0, isDirty: isEmptyResetValues ? false : keepStateOptions.keepDirty ? _formState.isDirty : !!(keepStateOptions.keepDefaultValues && !deepEqual(formValues, _defaultValues)), isSubmitted: keepStateOptions.keepIsSubmitted ? _formState.isSubmitted : false, dirtyFields: isEmptyResetValues ? [] : keepStateOptions.keepDirtyValues ? keepStateOptions.keepDefaultValues && _formValues ? getDirtyFields(_defaultValues, _formValues) : _formState.dirtyFields : keepStateOptions.keepDefaultValues && formValues ? getDirtyFields(_defaultValues, formValues) : {}, touchedFields: keepStateOptions.keepTouched ? _formState.touchedFields : {}, errors: keepStateOptions.keepErrors ? _formState.errors : {}, isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful ? _formState.isSubmitSuccessful : false, isSubmitting: false, }); }; const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues) ? formValues(_formValues) : formValues, keepStateOptions); const setFocus = (name, options = {}) => { const field = get(_fields, name); const fieldReference = field && field._f; if (fieldReference) { const fieldRef = fieldReference.refs ? fieldReference.refs[0] : fieldReference.ref; if (fieldRef.focus) { fieldRef.focus(); options.shouldSelect && fieldRef.select(); } } }; const _updateFormState = (updatedFormState) => { _formState = { ..._formState, ...updatedFormState, }; }; const _resetDefaultValues = () => isFunction(_options.defaultValues) && _options.defaultValues().then((values) => { reset(values, _options.resetOptions); _subjects.state.next({ isLoading: false, }); }); return { control: { register, unregister, getFieldState, handleSubmit, setError, _executeSchema, _getWatch, _getDirty, _updateValid, _removeUnmounted, _updateFieldArray, _updateDisabledField, _getFieldArray, _reset, _resetDefaultValues, _updateFormState, _disableForm, _subjects, _proxyFormState, _setErrors, get _fields() { return _fields; }, get _formValues() { return _formValues; }, get _state() { return _state; }, set _state(value) { _state = value; }, get _defaultValues() { return _defaultValues; }, get _names() { return _names; }, set _names(value) { _names = value; }, get _formState() { return _formState; }, set _formState(value) { _formState = value; }, get _options() { return _options; }, set _options(value) { _options = { ..._options, ...value, }; }, }, trigger, register, handleSubmit, watch, setValue, getValues, reset, resetField, clearErrors, unregister, setError, setFocus, getFieldState, }; } /** * Custom hook to manage the entire form. * * @remarks * [API](https://react-hook-form.com/docs/useform) • [Demo](https://codesandbox.io/s/react-hook-form-get-started-ts-5ksmm) • [Video](https://www.youtube.com/watch?v=RkXv4AXXC_4) * * @param props - form configuration and validation parameters. * * @returns methods - individual functions to manage the form state. {@link UseFormReturn} * * @example * ```tsx * function App() { * const { register, handleSubmit, watch, formState: { errors } } = useForm(); * const onSubmit = data => console.log(data); * * console.log(watch("example")); * * return ( *
* * * {errors.exampleRequired && This field is required} * *
* ); * } * ``` */ function useForm(props = {}) { const _formControl = react__WEBPACK_IMPORTED_MODULE_0__.useRef(); const _values = react__WEBPACK_IMPORTED_MODULE_0__.useRef(); const [formState, updateFormState] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ isDirty: false, isValidating: false, isLoading: isFunction(props.defaultValues), isSubmitted: false, isSubmitting: false, isSubmitSuccessful: false, isValid: false, submitCount: 0, dirtyFields: {}, touchedFields: {}, validatingFields: {}, errors: props.errors || {}, disabled: props.disabled || false, defaultValues: isFunction(props.defaultValues) ? undefined : props.defaultValues, }); if (!_formControl.current) { _formControl.current = { ...createFormControl(props), formState, }; } const control = _formControl.current.control; control._options = props; useSubscribe({ subject: control._subjects.state, next: (value) => { if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) { updateFormState({ ...control._formState }); } }, }); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { if (control._proxyFormState.isDirty) { const isDirty = control._getDirty(); if (isDirty !== formState.isDirty) { control._subjects.state.next({ isDirty, }); } } }, [control, formState.isDirty]); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { if (props.values && !deepEqual(props.values, _values.current)) { control._reset(props.values, control._options.resetOptions); _values.current = props.values; updateFormState((state) => ({ ...state })); } else { control._resetDefaultValues(); } }, [props.values, control]); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { if (props.errors) { control._setErrors(props.errors); } }, [props.errors, control]); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { if (!control._state.mount) { control._updateValid(); control._state.mount = true; } if (control._state.watch) { control._state.watch = false; control._subjects.state.next({ ...control._formState }); } control._removeUnmounted(); }); react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { props.shouldUnregister && control._subjects.values.next({ values: control._getWatch(), }); }, [props.shouldUnregister, control]); _formControl.current.formState = getProxyFormState(formState, control); return _formControl.current; } //# sourceMappingURL=index.esm.mjs.map /***/ }) }]);