@saberlayer/avatar-upload
Version:
A React avatar upload component with image crop feature based on Ant Design
16 lines (15 loc) • 17.8 kB
JavaScript
!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("antd"),require("antd-img-crop")):"function"==typeof define&&define.amd?define(["exports","react","antd","antd-img-crop"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).AvatarUpload={},e.React,e.antd,e.antdImgCrop)}(this,(function(e,r,t,n){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=o(r),i=o(n);function c(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=Array(r);t<r;t++)n[t]=e[t];return n}function u(e,r){return function(e){if(Array.isArray(e))return e}(e)||function(e,r){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var n,o,a,i,c=[],u=!0,f=!1;try{if(a=(t=t.call(e)).next,0===r){if(Object(t)!==t)return;u=!1}else for(;!(u=(n=a.call(t)).done)&&(c.push(n.value),c.length!==r);u=!0);}catch(e){f=!0,o=e}finally{try{if(!u&&null!=t.return&&(i=t.return(),Object(i)!==i))return}finally{if(f)throw o}}return c}}(e,r)||function(e,r){if(e){if("string"==typeof e)return c(e,r);var t={}.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?c(e,r):void 0}}(e,r)||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 f(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s,l={exports:{}},p={exports:{}},y={};var d,m,b,v,g,h,S,O,w,E,j,x,$,T,P={};
/** @license React v16.13.1
* react-is.development.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.
*/function _(){return m||(m=1,"production"===process.env.NODE_ENV?p.exports=function(){if(s)return y;s=1;var e="function"==typeof Symbol&&Symbol.for,r=e?Symbol.for("react.element"):60103,t=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,o=e?Symbol.for("react.strict_mode"):60108,a=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,c=e?Symbol.for("react.context"):60110,u=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,l=e?Symbol.for("react.forward_ref"):60112,p=e?Symbol.for("react.suspense"):60113,d=e?Symbol.for("react.suspense_list"):60120,m=e?Symbol.for("react.memo"):60115,b=e?Symbol.for("react.lazy"):60116,v=e?Symbol.for("react.block"):60121,g=e?Symbol.for("react.fundamental"):60117,h=e?Symbol.for("react.responder"):60118,S=e?Symbol.for("react.scope"):60119;function O(e){if("object"==typeof e&&null!==e){var s=e.$$typeof;switch(s){case r:switch(e=e.type){case u:case f:case n:case a:case o:case p:return e;default:switch(e=e&&e.$$typeof){case c:case l:case b:case m:case i:return e;default:return s}}case t:return s}}}function w(e){return O(e)===f}return y.AsyncMode=u,y.ConcurrentMode=f,y.ContextConsumer=c,y.ContextProvider=i,y.Element=r,y.ForwardRef=l,y.Fragment=n,y.Lazy=b,y.Memo=m,y.Portal=t,y.Profiler=a,y.StrictMode=o,y.Suspense=p,y.isAsyncMode=function(e){return w(e)||O(e)===u},y.isConcurrentMode=w,y.isContextConsumer=function(e){return O(e)===c},y.isContextProvider=function(e){return O(e)===i},y.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===r},y.isForwardRef=function(e){return O(e)===l},y.isFragment=function(e){return O(e)===n},y.isLazy=function(e){return O(e)===b},y.isMemo=function(e){return O(e)===m},y.isPortal=function(e){return O(e)===t},y.isProfiler=function(e){return O(e)===a},y.isStrictMode=function(e){return O(e)===o},y.isSuspense=function(e){return O(e)===p},y.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===f||e===a||e===o||e===p||e===d||"object"==typeof e&&null!==e&&(e.$$typeof===b||e.$$typeof===m||e.$$typeof===i||e.$$typeof===c||e.$$typeof===l||e.$$typeof===g||e.$$typeof===h||e.$$typeof===S||e.$$typeof===v)},y.typeOf=O,y}():p.exports=(d||(d=1,"production"!==process.env.NODE_ENV&&function(){var e="function"==typeof Symbol&&Symbol.for,r=e?Symbol.for("react.element"):60103,t=e?Symbol.for("react.portal"):60106,n=e?Symbol.for("react.fragment"):60107,o=e?Symbol.for("react.strict_mode"):60108,a=e?Symbol.for("react.profiler"):60114,i=e?Symbol.for("react.provider"):60109,c=e?Symbol.for("react.context"):60110,u=e?Symbol.for("react.async_mode"):60111,f=e?Symbol.for("react.concurrent_mode"):60111,s=e?Symbol.for("react.forward_ref"):60112,l=e?Symbol.for("react.suspense"):60113,p=e?Symbol.for("react.suspense_list"):60120,y=e?Symbol.for("react.memo"):60115,d=e?Symbol.for("react.lazy"):60116,m=e?Symbol.for("react.block"):60121,b=e?Symbol.for("react.fundamental"):60117,v=e?Symbol.for("react.responder"):60118,g=e?Symbol.for("react.scope"):60119;function h(e){if("object"==typeof e&&null!==e){var p=e.$$typeof;switch(p){case r:var m=e.type;switch(m){case u:case f:case n:case a:case o:case l:return m;default:var b=m&&m.$$typeof;switch(b){case c:case s:case d:case y:case i:return b;default:return p}}case t:return p}}}var S=u,O=f,w=c,E=i,j=r,x=s,$=n,T=d,_=y,C=t,I=a,N=o,k=l,A=!1;function R(e){return h(e)===f}P.AsyncMode=S,P.ConcurrentMode=O,P.ContextConsumer=w,P.ContextProvider=E,P.Element=j,P.ForwardRef=x,P.Fragment=$,P.Lazy=T,P.Memo=_,P.Portal=C,P.Profiler=I,P.StrictMode=N,P.Suspense=k,P.isAsyncMode=function(e){return A||(A=!0,console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")),R(e)||h(e)===u},P.isConcurrentMode=R,P.isContextConsumer=function(e){return h(e)===c},P.isContextProvider=function(e){return h(e)===i},P.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===r},P.isForwardRef=function(e){return h(e)===s},P.isFragment=function(e){return h(e)===n},P.isLazy=function(e){return h(e)===d},P.isMemo=function(e){return h(e)===y},P.isPortal=function(e){return h(e)===t},P.isProfiler=function(e){return h(e)===a},P.isStrictMode=function(e){return h(e)===o},P.isSuspense=function(e){return h(e)===l},P.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===n||e===f||e===a||e===o||e===l||e===p||"object"==typeof e&&null!==e&&(e.$$typeof===d||e.$$typeof===y||e.$$typeof===i||e.$$typeof===c||e.$$typeof===s||e.$$typeof===b||e.$$typeof===v||e.$$typeof===g||e.$$typeof===m)},P.typeOf=h}()),P)),p.exports}
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/function C(){if(v)return b;v=1;var e=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,t=Object.prototype.propertyIsEnumerable;return b=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var r={},t=0;t<10;t++)r["_"+String.fromCharCode(t)]=t;if("0123456789"!==Object.getOwnPropertyNames(r).map((function(e){return r[e]})).join(""))return!1;var n={};return"abcdefghijklmnopqrst".split("").forEach((function(e){n[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}()?Object.assign:function(n,o){for(var a,i,c=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(n),u=1;u<arguments.length;u++){for(var f in a=Object(arguments[u]))r.call(a,f)&&(c[f]=a[f]);if(e){i=e(a);for(var s=0;s<i.length;s++)t.call(a,i[s])&&(c[i[s]]=a[i[s]])}}return c},b}function I(){if(h)return g;h=1;return g="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}function N(){return O?S:(O=1,S=Function.call.bind(Object.prototype.hasOwnProperty))}if("production"!==process.env.NODE_ENV){var k=_();l.exports=function(){if(x)return j;x=1;var e=_(),r=C(),t=I(),n=N(),o=function(){if(E)return w;E=1;var e=function(){};if("production"!==process.env.NODE_ENV){var r=I(),t={},n=N();e=function(e){var r="Warning: "+e;"undefined"!=typeof console&&console.error(r);try{throw new Error(r)}catch(e){}}}function o(o,a,i,c,u){if("production"!==process.env.NODE_ENV)for(var f in o)if(n(o,f)){var s;try{if("function"!=typeof o[f]){var l=Error((c||"React class")+": "+i+" type `"+f+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof o[f]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw l.name="Invariant Violation",l}s=o[f](a,f,c,i,null,r)}catch(e){s=e}if(!s||s instanceof Error||e((c||"React class")+": type specification of "+i+" `"+f+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof s+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),s instanceof Error&&!(s.message in t)){t[s.message]=!0;var p=u?u():"";e("Failed "+i+" type: "+s.message+(null!=p?p:""))}}}return o.resetWarningCache=function(){"production"!==process.env.NODE_ENV&&(t={})},w=o}(),a=function(){};function i(){return null}return"production"!==process.env.NODE_ENV&&(a=function(e){var r="Warning: "+e;"undefined"!=typeof console&&console.error(r);try{throw new Error(r)}catch(e){}}),j=function(c,u){var f="function"==typeof Symbol&&Symbol.iterator,s="<<anonymous>>",l={array:m("array"),bigint:m("bigint"),bool:m("boolean"),func:m("function"),number:m("number"),object:m("object"),string:m("string"),symbol:m("symbol"),any:d(i),arrayOf:function(e){return d((function(r,n,o,a,i){if("function"!=typeof e)return new y("Property `"+i+"` of component `"+o+"` has invalid PropType notation inside arrayOf.");var c=r[n];if(!Array.isArray(c))return new y("Invalid "+a+" `"+i+"` of type `"+g(c)+"` supplied to `"+o+"`, expected an array.");for(var u=0;u<c.length;u++){var f=e(c,u,o,a,i+"["+u+"]",t);if(f instanceof Error)return f}return null}))},element:d((function(e,r,t,n,o){var a=e[r];return c(a)?null:new y("Invalid "+n+" `"+o+"` of type `"+g(a)+"` supplied to `"+t+"`, expected a single ReactElement.")})),elementType:d((function(r,t,n,o,a){var i=r[t];return e.isValidElementType(i)?null:new y("Invalid "+o+" `"+a+"` of type `"+g(i)+"` supplied to `"+n+"`, expected a single ReactElement type.")})),instanceOf:function(e){return d((function(r,t,n,o,a){if(!(r[t]instanceof e)){var i=e.name||s;return new y("Invalid "+o+" `"+a+"` of type `"+((c=r[t]).constructor&&c.constructor.name?c.constructor.name:s)+"` supplied to `"+n+"`, expected instance of `"+i+"`.")}var c;return null}))},node:d((function(e,r,t,n,o){return v(e[r])?null:new y("Invalid "+n+" `"+o+"` supplied to `"+t+"`, expected a ReactNode.")})),objectOf:function(e){return d((function(r,o,a,i,c){if("function"!=typeof e)return new y("Property `"+c+"` of component `"+a+"` has invalid PropType notation inside objectOf.");var u=r[o],f=g(u);if("object"!==f)return new y("Invalid "+i+" `"+c+"` of type `"+f+"` supplied to `"+a+"`, expected an object.");for(var s in u)if(n(u,s)){var l=e(u,s,a,i,c+"."+s,t);if(l instanceof Error)return l}return null}))},oneOf:function(e){return Array.isArray(e)?d((function(r,t,n,o,a){for(var i=r[t],c=0;c<e.length;c++)if(p(i,e[c]))return null;var u=JSON.stringify(e,(function(e,r){return"symbol"===h(r)?String(r):r}));return new y("Invalid "+o+" `"+a+"` of value `"+String(i)+"` supplied to `"+n+"`, expected one of "+u+".")})):("production"!==process.env.NODE_ENV&&a(arguments.length>1?"Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).":"Invalid argument supplied to oneOf, expected an array."),i)},oneOfType:function(e){if(!Array.isArray(e))return"production"!==process.env.NODE_ENV&&a("Invalid argument supplied to oneOfType, expected an instance of array."),i;for(var r=0;r<e.length;r++){var o=e[r];if("function"!=typeof o)return a("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+S(o)+" at index "+r+"."),i}return d((function(r,o,a,i,c){for(var u=[],f=0;f<e.length;f++){var s=(0,e[f])(r,o,a,i,c,t);if(null==s)return null;s.data&&n(s.data,"expectedType")&&u.push(s.data.expectedType)}return new y("Invalid "+i+" `"+c+"` supplied to `"+a+"`"+(u.length>0?", expected one of type ["+u.join(", ")+"]":"")+".")}))},shape:function(e){return d((function(r,n,o,a,i){var c=r[n],u=g(c);if("object"!==u)return new y("Invalid "+a+" `"+i+"` of type `"+u+"` supplied to `"+o+"`, expected `object`.");for(var f in e){var s=e[f];if("function"!=typeof s)return b(o,a,i,f,h(s));var l=s(c,f,o,a,i+"."+f,t);if(l)return l}return null}))},exact:function(e){return d((function(o,a,i,c,u){var f=o[a],s=g(f);if("object"!==s)return new y("Invalid "+c+" `"+u+"` of type `"+s+"` supplied to `"+i+"`, expected `object`.");var l=r({},o[a],e);for(var p in l){var d=e[p];if(n(e,p)&&"function"!=typeof d)return b(i,c,u,p,h(d));if(!d)return new y("Invalid "+c+" `"+u+"` key `"+p+"` supplied to `"+i+"`.\nBad object: "+JSON.stringify(o[a],null," ")+"\nValid keys: "+JSON.stringify(Object.keys(e),null," "));var m=d(f,p,i,c,u+"."+p,t);if(m)return m}return null}))}};function p(e,r){return e===r?0!==e||1/e==1/r:e!=e&&r!=r}function y(e,r){this.message=e,this.data=r&&"object"==typeof r?r:{},this.stack=""}function d(e){if("production"!==process.env.NODE_ENV)var r={},n=0;function o(o,i,c,f,l,p,d){if(f=f||s,p=p||c,d!==t){if(u){var m=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw m.name="Invariant Violation",m}if("production"!==process.env.NODE_ENV&&"undefined"!=typeof console){var b=f+":"+c;!r[b]&&n<3&&(a("You are manually calling a React.PropTypes validation function for the `"+p+"` prop on `"+f+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),r[b]=!0,n++)}}return null==i[c]?o?null===i[c]?new y("The "+l+" `"+p+"` is marked as required in `"+f+"`, but its value is `null`."):new y("The "+l+" `"+p+"` is marked as required in `"+f+"`, but its value is `undefined`."):null:e(i,c,f,l,p)}var i=o.bind(null,!1);return i.isRequired=o.bind(null,!0),i}function m(e){return d((function(r,t,n,o,a,i){var c=r[t];return g(c)!==e?new y("Invalid "+o+" `"+a+"` of type `"+h(c)+"` supplied to `"+n+"`, expected `"+e+"`.",{expectedType:e}):null}))}function b(e,r,t,n,o){return new y((e||"React class")+": "+r+" type `"+t+"."+n+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+o+"`.")}function v(e){switch(typeof e){case"number":case"string":case"undefined":return!0;case"boolean":return!e;case"object":if(Array.isArray(e))return e.every(v);if(null===e||c(e))return!0;var r=function(e){var r=e&&(f&&e[f]||e["@@iterator"]);if("function"==typeof r)return r}(e);if(!r)return!1;var t,n=r.call(e);if(r!==e.entries){for(;!(t=n.next()).done;)if(!v(t.value))return!1}else for(;!(t=n.next()).done;){var o=t.value;if(o&&!v(o[1]))return!1}return!0;default:return!1}}function g(e){var r=typeof e;return Array.isArray(e)?"array":e instanceof RegExp?"object":function(e,r){return"symbol"===e||!!r&&("Symbol"===r["@@toStringTag"]||"function"==typeof Symbol&&r instanceof Symbol)}(r,e)?"symbol":r}function h(e){if(null==e)return""+e;var r=g(e);if("object"===r){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return r}function S(e){var r=h(e);switch(r){case"array":case"object":return"an "+r;case"boolean":case"date":case"regexp":return"a "+r;default:return r}}return y.prototype=Error.prototype,l.checkPropTypes=o,l.resetWarningCache=o.resetWarningCache,l.PropTypes=l,l},j}()(k.isElement,!0)}else l.exports=function(){if(T)return $;T=1;var e=I();function r(){}function t(){}return t.resetWarningCache=r,$=function(){function n(r,t,n,o,a,i){if(i!==e){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}}function o(){return n}n.isRequired=n;var a={array:n,bigint:n,bool:n,func:n,number:n,object:n,string:n,symbol:n,any:n,arrayOf:o,element:n,elementType:n,instanceOf:o,node:n,objectOf:o,oneOf:o,oneOfType:o,shape:o,exact:o,checkPropTypes:t,resetWarningCache:r};return a.PropTypes=a,a}}()();var A=f(l.exports),R=function(e){var n=e.value,o=e.onChange,c=e.maxSize,f=void 0===c?2:c,s=u(r.useState(!1),2),l=s[0],p=s[1],y=u(r.useState(n||""),2),d=y[0],m=y[1];return a.default.createElement(i.default,{rotate:!0},a.default.createElement(t.Upload,{name:"avatar",listType:"picture-circle",className:"avatar-uploader",showUploadList:!1,action:"/api/upload",beforeUpload:function(e){return"image/jpeg"===e.type||"image/png"===e.type?!!(e.size/1024/1024<f)||(t.message.error("图片必须小于 ".concat(f,"MB!")),!1):(t.message.error("只能上传 JPG/PNG 格式的图片!"),!1)},onChange:function(e){if("uploading"!==e.file.status){if("done"===e.file.status){var r;p(!1);var n=(null===(r=e.file.response)||void 0===r?void 0:r.url)||"";m(n),null==o||o(n)}"error"===e.file.status&&(p(!1),t.message.error("上传失败,请重试!"))}else p(!0)}},d?a.default.createElement("img",{src:d,alt:"avatar",style:{width:"100%",height:"100%",borderRadius:"50%",objectFit:"cover"}}):a.default.createElement("div",null,l?"上传中...":"+ 上传")))};R.propTypes={value:A.string,onChange:A.func,maxSize:A.number};var M=R;e.AvatarUpload=M,e.default=M,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=index.umd.js.map