Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-image-upload

Package Overview
Dependencies
Maintainers
2
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-image-upload - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1

68

dist/index.es.js

@@ -1,2 +0,2 @@

import we, { Fragment as Te, useState as ur } from "react";
import we, { Fragment as xe, useState as ur } from "react";
var v = {}, lr = {

@@ -24,14 +24,14 @@ get exports() {

Re = 1;
var c = we, w = Symbol.for("react.element"), D = Symbol.for("react.fragment"), T = Object.prototype.hasOwnProperty, O = c.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, h = { key: !0, ref: !0, __self: !0, __source: !0 };
function x(y, d, b) {
var f, _ = {}, E = null, N = null;
b !== void 0 && (E = "" + b), d.key !== void 0 && (E = "" + d.key), d.ref !== void 0 && (N = d.ref);
var c = we, w = Symbol.for("react.element"), D = Symbol.for("react.fragment"), x = Object.prototype.hasOwnProperty, O = c.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, h = { key: !0, ref: !0, __self: !0, __source: !0 };
function T(E, d, b) {
var f, _ = {}, y = null, N = null;
b !== void 0 && (y = "" + b), d.key !== void 0 && (y = "" + d.key), d.ref !== void 0 && (N = d.ref);
for (f in d)
T.call(d, f) && !h.hasOwnProperty(f) && (_[f] = d[f]);
if (y && y.defaultProps)
for (f in d = y.defaultProps, d)
x.call(d, f) && !h.hasOwnProperty(f) && (_[f] = d[f]);
if (E && E.defaultProps)
for (f in d = E.defaultProps, d)
_[f] === void 0 && (_[f] = d[f]);
return { $$typeof: w, type: y, key: E, ref: N, props: _, _owner: O.current };
return { $$typeof: w, type: E, key: y, ref: N, props: _, _owner: O.current };
}
return A.Fragment = D, A.jsx = x, A.jsxs = x, A;
return A.Fragment = D, A.jsx = T, A.jsxs = T, A;
}

@@ -51,7 +51,7 @@ var U = {};

return Ce || (Ce = 1, process.env.NODE_ENV !== "production" && function() {
var c = we, w = Symbol.for("react.element"), D = Symbol.for("react.portal"), T = Symbol.for("react.fragment"), O = Symbol.for("react.strict_mode"), h = Symbol.for("react.profiler"), x = Symbol.for("react.provider"), y = Symbol.for("react.context"), d = Symbol.for("react.forward_ref"), b = Symbol.for("react.suspense"), f = Symbol.for("react.suspense_list"), _ = Symbol.for("react.memo"), E = Symbol.for("react.lazy"), N = Symbol.for("react.offscreen"), Z = Symbol.iterator, xe = "@@iterator";
var c = we, w = Symbol.for("react.element"), D = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), O = Symbol.for("react.strict_mode"), h = Symbol.for("react.profiler"), T = Symbol.for("react.provider"), E = Symbol.for("react.context"), d = Symbol.for("react.forward_ref"), b = Symbol.for("react.suspense"), f = Symbol.for("react.suspense_list"), _ = Symbol.for("react.memo"), y = Symbol.for("react.lazy"), N = Symbol.for("react.offscreen"), Z = Symbol.iterator, Te = "@@iterator";
function je(e) {
if (e === null || typeof e != "object")
return null;
var r = Z && e[Z] || e[xe];
var r = Z && e[Z] || e[Te];
return typeof r == "function" ? r : null;

@@ -80,3 +80,3 @@ }

function Fe(e) {
return !!(typeof e == "string" || typeof e == "function" || e === T || e === h || Ie || e === O || e === b || e === f || De || e === N || Pe || Se || ke || typeof e == "object" && e !== null && (e.$$typeof === E || e.$$typeof === _ || e.$$typeof === x || e.$$typeof === y || e.$$typeof === d || // This needs to include all possible module reference object
return !!(typeof e == "string" || typeof e == "function" || e === x || e === h || Ie || e === O || e === b || e === f || De || e === N || Pe || Se || ke || typeof e == "object" && e !== null && (e.$$typeof === y || e.$$typeof === _ || e.$$typeof === T || e.$$typeof === E || e.$$typeof === d || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since

@@ -105,3 +105,3 @@ // we don't know which Flight build this will end up being used

switch (e) {
case T:
case x:
return "Fragment";

@@ -121,6 +121,6 @@ case D:

switch (e.$$typeof) {
case y:
case E:
var r = e;
return Q(r) + ".Consumer";
case x:
case T:
var t = e;

@@ -133,3 +133,3 @@ return Q(t._context) + ".Provider";

return n !== null ? n : R(e.type) || "Memo";
case E: {
case y: {
var o = e, u = o._payload, i = o._init;

@@ -294,4 +294,4 @@ try {

}
var k = e ? e.displayName || e.name : "", Ee = k ? $(k) : "";
return typeof e == "function" && W.set(e, Ee), Ee;
var k = e ? e.displayName || e.name : "", ye = k ? $(k) : "";
return typeof e == "function" && W.set(e, ye), ye;
}

@@ -324,3 +324,3 @@ function We(e, r, t) {

return Y(e.type, r, t);
case E: {
case y: {
var n = e, o = n._payload, u = n._init;

@@ -602,3 +602,3 @@ try {

}
function ye(e, r, t, n, o, u) {
function Ee(e, r, t, n, o, u) {
{

@@ -630,13 +630,13 @@ var i = Fe(e);

}
return e === T ? tr(s) : rr(s), s;
return e === x ? tr(s) : rr(s), s;
}
}
function nr(e, r, t) {
return ye(e, r, t, !0);
return Ee(e, r, t, !0);
}
function ar(e, r, t) {
return ye(e, r, t, !1);
return Ee(e, r, t, !1);
}
var ir = ar, or = nr;
U.Fragment = T, U.jsx = ir, U.jsxs = or;
U.Fragment = x, U.jsx = ir, U.jsxs = or;
}()), U;

@@ -648,3 +648,3 @@ }

function cr({ element: c }) {
return c ? /* @__PURE__ */ v.jsx(Te, { children: c }) : /* @__PURE__ */ v.jsx(
return c ? /* @__PURE__ */ v.jsx(xe, { children: c }) : /* @__PURE__ */ v.jsx(
"svg",

@@ -668,3 +668,3 @@ {

function dr({ icon: c }) {
return c ? /* @__PURE__ */ v.jsx(Te, { children: c }) : /* @__PURE__ */ v.jsx(
return c ? /* @__PURE__ */ v.jsx(xe, { children: c }) : /* @__PURE__ */ v.jsx(
"svg",

@@ -685,9 +685,9 @@ {

uploadIcon: D,
deleteIcon: T,
deleteIcon: x,
style: O
}) => {
const [h, x] = ur({
const [h, T] = ur({
file: {},
dataUrl: ""
}), y = (b) => {
}), E = (b) => {
const { files: f } = b.target;

@@ -699,9 +699,9 @@ if (f != null && f.length > 0) {

};
x((E) => ({ ...E, ..._ })), c && c(_);
T((y) => ({ ...y, ..._ })), c && c(_);
}
}, d = () => {
w != null && Object.keys(h).length > 0 && w(h), x({});
w != null && Object.keys(h).length > 0 && w(h), T({});
};
return /* @__PURE__ */ v.jsx("div", { className: "uploader__container", children: /* @__PURE__ */ v.jsxs("div", { className: "uploader__placeholder", style: O, children: [
/* @__PURE__ */ v.jsx("div", { className: "uploader__btn_wrapper", children: /* @__PURE__ */ v.jsx("div", { className: "uploader__btn", onClick: () => d(), children: /* @__PURE__ */ v.jsx(dr, { icon: T }) }) }),
/* @__PURE__ */ v.jsx("div", { className: "uploader__btn_wrapper", children: /* @__PURE__ */ v.jsx("div", { className: "uploader__btn", onClick: () => d(), children: /* @__PURE__ */ v.jsx(dr, { icon: x }) }) }),
h && h.dataUrl !== null && /* @__PURE__ */ v.jsxs("label", { id: "file_uploader", className: "uploader__file_input_label", children: [

@@ -715,3 +715,3 @@ /* @__PURE__ */ v.jsx(cr, { element: D }),

name: "upload",
onChange: (b) => y(b),
onChange: (b) => E(b),
accept: "image/*",

@@ -718,0 +718,0 @@ id: "file_uploader"

@@ -1,2 +0,2 @@

(function(y,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("react")):typeof define=="function"&&define.amd?define(["react"],l):(y=typeof globalThis<"u"?globalThis:y||self,y.reactImageUpload=l(y.React))})(this,function(y){"use strict";var l={},we={get exports(){return l},set exports(d){l=d}},I={};/**
(function(y,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("react")):typeof define=="function"&&define.amd?define(["react"],l):(y=typeof globalThis<"u"?globalThis:y||self,y.reactImageUpload=l(y.React))})(this,function(y){"use strict";var l={},xe={get exports(){return l},set exports(d){l=d}},I={};/**
* @license React

@@ -9,3 +9,3 @@ * react-jsx-runtime.production.min.js

* LICENSE file in the root directory of this source tree.
*/var X;function xe(){if(X)return I;X=1;var d=y,w=Symbol.for("react.element"),A=Symbol.for("react.fragment"),x=Object.prototype.hasOwnProperty,P=d.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,h={key:!0,ref:!0,__self:!0,__source:!0};function j(E,v,b){var c,m={},R=null,W=null;b!==void 0&&(R=""+b),v.key!==void 0&&(R=""+v.key),v.ref!==void 0&&(W=v.ref);for(c in v)x.call(v,c)&&!h.hasOwnProperty(c)&&(m[c]=v[c]);if(E&&E.defaultProps)for(c in v=E.defaultProps,v)m[c]===void 0&&(m[c]=v[c]);return{$$typeof:w,type:E,key:R,ref:W,props:m,_owner:P.current}}return I.Fragment=A,I.jsx=j,I.jsxs=j,I}var F={};/**
*/var X;function we(){if(X)return I;X=1;var d=y,x=Symbol.for("react.element"),A=Symbol.for("react.fragment"),w=Object.prototype.hasOwnProperty,P=d.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,h={key:!0,ref:!0,__self:!0,__source:!0};function j(E,v,b){var c,m={},R=null,W=null;b!==void 0&&(R=""+b),v.key!==void 0&&(R=""+v.key),v.ref!==void 0&&(W=v.ref);for(c in v)w.call(v,c)&&!h.hasOwnProperty(c)&&(m[c]=v[c]);if(E&&E.defaultProps)for(c in v=E.defaultProps,v)m[c]===void 0&&(m[c]=v[c]);return{$$typeof:x,type:E,key:R,ref:W,props:m,_owner:P.current}}return I.Fragment=A,I.jsx=j,I.jsxs=j,I}var F={};/**
* @license React

@@ -18,7 +18,7 @@ * react-jsx-runtime.development.js

* LICENSE file in the root directory of this source tree.
*/var Q;function je(){return Q||(Q=1,process.env.NODE_ENV!=="production"&&function(){var d=y,w=Symbol.for("react.element"),A=Symbol.for("react.portal"),x=Symbol.for("react.fragment"),P=Symbol.for("react.strict_mode"),h=Symbol.for("react.profiler"),j=Symbol.for("react.provider"),E=Symbol.for("react.context"),v=Symbol.for("react.forward_ref"),b=Symbol.for("react.suspense"),c=Symbol.for("react.suspense_list"),m=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),W=Symbol.for("react.offscreen"),ee=Symbol.iterator,Se="@@iterator";function ke(e){if(e===null||typeof e!="object")return null;var r=ee&&e[ee]||e[Se];return typeof r=="function"?r:null}var S=d.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function p(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];De("error",e,t)}}function De(e,r,t){{var n=S.ReactDebugCurrentFrame,o=n.getStackAddendum();o!==""&&(r+="%s",t=t.concat([o]));var u=t.map(function(i){return String(i)});u.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,u)}}var Ie=!1,Fe=!1,Ae=!1,Ue=!1,Ne=!1,re;re=Symbol.for("react.module.reference");function We(e){return!!(typeof e=="string"||typeof e=="function"||e===x||e===h||Ne||e===P||e===b||e===c||Ue||e===W||Ie||Fe||Ae||typeof e=="object"&&e!==null&&(e.$$typeof===R||e.$$typeof===m||e.$$typeof===j||e.$$typeof===E||e.$$typeof===v||e.$$typeof===re||e.getModuleId!==void 0))}function Ye(e,r,t){var n=e.displayName;if(n)return n;var o=r.displayName||r.name||"";return o!==""?t+"("+o+")":t}function te(e){return e.displayName||"Context"}function C(e){if(e==null)return null;if(typeof e.tag=="number"&&p("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case x:return"Fragment";case A:return"Portal";case h:return"Profiler";case P:return"StrictMode";case b:return"Suspense";case c:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case E:var r=e;return te(r)+".Consumer";case j:var t=e;return te(t._context)+".Provider";case v:return Ye(e,e.render,"ForwardRef");case m:var n=e.displayName||null;return n!==null?n:C(e.type)||"Memo";case R:{var o=e,u=o._payload,i=o._init;try{return C(i(u))}catch{return null}}}return null}var O=Object.assign,U=0,ne,ae,ie,oe,ue,le,se;function fe(){}fe.__reactDisabledLog=!0;function Le(){{if(U===0){ne=console.log,ae=console.info,ie=console.warn,oe=console.error,ue=console.group,le=console.groupCollapsed,se=console.groupEnd;var e={configurable:!0,enumerable:!0,value:fe,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}U++}}function Me(){{if(U--,U===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:O({},e,{value:ne}),info:O({},e,{value:ae}),warn:O({},e,{value:ie}),error:O({},e,{value:oe}),group:O({},e,{value:ue}),groupCollapsed:O({},e,{value:le}),groupEnd:O({},e,{value:se})})}U<0&&p("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var B=S.ReactCurrentDispatcher,z;function Y(e,r,t){{if(z===void 0)try{throw Error()}catch(o){var n=o.stack.trim().match(/\n( *(at )?)/);z=n&&n[1]||""}return`
*/var Q;function je(){return Q||(Q=1,process.env.NODE_ENV!=="production"&&function(){var d=y,x=Symbol.for("react.element"),A=Symbol.for("react.portal"),w=Symbol.for("react.fragment"),P=Symbol.for("react.strict_mode"),h=Symbol.for("react.profiler"),j=Symbol.for("react.provider"),E=Symbol.for("react.context"),v=Symbol.for("react.forward_ref"),b=Symbol.for("react.suspense"),c=Symbol.for("react.suspense_list"),m=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),W=Symbol.for("react.offscreen"),ee=Symbol.iterator,Se="@@iterator";function ke(e){if(e===null||typeof e!="object")return null;var r=ee&&e[ee]||e[Se];return typeof r=="function"?r:null}var S=d.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function p(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];De("error",e,t)}}function De(e,r,t){{var n=S.ReactDebugCurrentFrame,o=n.getStackAddendum();o!==""&&(r+="%s",t=t.concat([o]));var u=t.map(function(i){return String(i)});u.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,u)}}var Ie=!1,Fe=!1,Ae=!1,Ue=!1,Ne=!1,re;re=Symbol.for("react.module.reference");function We(e){return!!(typeof e=="string"||typeof e=="function"||e===w||e===h||Ne||e===P||e===b||e===c||Ue||e===W||Ie||Fe||Ae||typeof e=="object"&&e!==null&&(e.$$typeof===R||e.$$typeof===m||e.$$typeof===j||e.$$typeof===E||e.$$typeof===v||e.$$typeof===re||e.getModuleId!==void 0))}function Ye(e,r,t){var n=e.displayName;if(n)return n;var o=r.displayName||r.name||"";return o!==""?t+"("+o+")":t}function te(e){return e.displayName||"Context"}function C(e){if(e==null)return null;if(typeof e.tag=="number"&&p("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case w:return"Fragment";case A:return"Portal";case h:return"Profiler";case P:return"StrictMode";case b:return"Suspense";case c:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case E:var r=e;return te(r)+".Consumer";case j:var t=e;return te(t._context)+".Provider";case v:return Ye(e,e.render,"ForwardRef");case m:var n=e.displayName||null;return n!==null?n:C(e.type)||"Memo";case R:{var o=e,u=o._payload,i=o._init;try{return C(i(u))}catch{return null}}}return null}var O=Object.assign,U=0,ne,ae,ie,oe,ue,le,se;function fe(){}fe.__reactDisabledLog=!0;function Le(){{if(U===0){ne=console.log,ae=console.info,ie=console.warn,oe=console.error,ue=console.group,le=console.groupCollapsed,se=console.groupEnd;var e={configurable:!0,enumerable:!0,value:fe,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}U++}}function Me(){{if(U--,U===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:O({},e,{value:ne}),info:O({},e,{value:ae}),warn:O({},e,{value:ie}),error:O({},e,{value:oe}),group:O({},e,{value:ue}),groupCollapsed:O({},e,{value:le}),groupEnd:O({},e,{value:se})})}U<0&&p("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var B=S.ReactCurrentDispatcher,z;function Y(e,r,t){{if(z===void 0)try{throw Error()}catch(o){var n=o.stack.trim().match(/\n( *(at )?)/);z=n&&n[1]||""}return`
`+z+e}}var H=!1,L;{var Ve=typeof WeakMap=="function"?WeakMap:Map;L=new Ve}function ce(e,r){if(!e||H)return"";{var t=L.get(e);if(t!==void 0)return t}var n;H=!0;var o=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var u;u=B.current,B.current=null,Le();try{if(r){var i=function(){throw Error()};if(Object.defineProperty(i.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(i,[])}catch(T){n=T}Reflect.construct(e,[],i)}else{try{i.call()}catch(T){n=T}e.call(i.prototype)}}else{try{throw Error()}catch(T){n=T}e()}}catch(T){if(T&&n&&typeof T.stack=="string"){for(var a=T.stack.split(`
`),g=n.stack.split(`
`),s=a.length-1,f=g.length-1;s>=1&&f>=0&&a[s]!==g[f];)f--;for(;s>=1&&f>=0;s--,f--)if(a[s]!==g[f]){if(s!==1||f!==1)do if(s--,f--,f<0||a[s]!==g[f]){var _=`
`+a[s].replace(" at new "," at ");return e.displayName&&_.includes("<anonymous>")&&(_=_.replace("<anonymous>",e.displayName)),typeof e=="function"&&L.set(e,_),_}while(s>=1&&f>=0);break}}}finally{H=!1,B.current=u,Me(),Error.prepareStackTrace=o}var D=e?e.displayName||e.name:"",Te=D?Y(D):"";return typeof e=="function"&&L.set(e,Te),Te}function $e(e,r,t){return ce(e,!1)}function Be(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function M(e,r,t){if(e==null)return"";if(typeof e=="function")return ce(e,Be(e));if(typeof e=="string")return Y(e);switch(e){case b:return Y("Suspense");case c:return Y("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case v:return $e(e.render);case m:return M(e.type,r,t);case R:{var n=e,o=n._payload,u=n._init;try{return M(u(o),r,t)}catch{}}}return""}var V=Object.prototype.hasOwnProperty,de={},ve=S.ReactDebugCurrentFrame;function $(e){if(e){var r=e._owner,t=M(e.type,e._source,r?r.type:null);ve.setExtraStackFrame(t)}else ve.setExtraStackFrame(null)}function ze(e,r,t,n,o){{var u=Function.call.bind(V);for(var i in e)if(u(e,i)){var a=void 0;try{if(typeof e[i]!="function"){var g=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw g.name="Invariant Violation",g}a=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(s){a=s}a&&!(a instanceof Error)&&($(o),p("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %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).",n||"React class",t,i,typeof a),$(null)),a instanceof Error&&!(a.message in de)&&(de[a.message]=!0,$(o),p("Failed %s type: %s",t,a.message),$(null))}}}var He=Array.isArray;function J(e){return He(e)}function Je(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function Ge(e){try{return pe(e),!1}catch{return!0}}function pe(e){return""+e}function ge(e){if(Ge(e))return p("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",Je(e)),pe(e)}var N=S.ReactCurrentOwner,qe={key:!0,ref:!0,__self:!0,__source:!0},he,me,G;G={};function Ke(e){if(V.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function Ze(e){if(V.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function Xe(e,r){if(typeof e.ref=="string"&&N.current&&r&&N.current.stateNode!==r){var t=C(N.current.type);G[t]||(p('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',C(N.current.type),e.ref),G[t]=!0)}}function Qe(e,r){{var t=function(){he||(he=!0,p("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function er(e,r){{var t=function(){me||(me=!0,p("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var rr=function(e,r,t,n,o,u,i){var a={$$typeof:w,type:e,key:r,ref:t,props:i,_owner:u};return a._store={},Object.defineProperty(a._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(a,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(a,"_source",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.freeze&&(Object.freeze(a.props),Object.freeze(a)),a};function tr(e,r,t,n,o){{var u,i={},a=null,g=null;t!==void 0&&(ge(t),a=""+t),Ze(r)&&(ge(r.key),a=""+r.key),Ke(r)&&(g=r.ref,Xe(r,o));for(u in r)V.call(r,u)&&!qe.hasOwnProperty(u)&&(i[u]=r[u]);if(e&&e.defaultProps){var s=e.defaultProps;for(u in s)i[u]===void 0&&(i[u]=s[u])}if(a||g){var f=typeof e=="function"?e.displayName||e.name||"Unknown":e;a&&Qe(i,f),g&&er(i,f)}return rr(e,a,g,o,n,N.current,i)}}var q=S.ReactCurrentOwner,_e=S.ReactDebugCurrentFrame;function k(e){if(e){var r=e._owner,t=M(e.type,e._source,r?r.type:null);_e.setExtraStackFrame(t)}else _e.setExtraStackFrame(null)}var K;K=!1;function Z(e){return typeof e=="object"&&e!==null&&e.$$typeof===w}function be(){{if(q.current){var e=C(q.current.type);if(e)return`
`+a[s].replace(" at new "," at ");return e.displayName&&_.includes("<anonymous>")&&(_=_.replace("<anonymous>",e.displayName)),typeof e=="function"&&L.set(e,_),_}while(s>=1&&f>=0);break}}}finally{H=!1,B.current=u,Me(),Error.prepareStackTrace=o}var D=e?e.displayName||e.name:"",Te=D?Y(D):"";return typeof e=="function"&&L.set(e,Te),Te}function $e(e,r,t){return ce(e,!1)}function Be(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function M(e,r,t){if(e==null)return"";if(typeof e=="function")return ce(e,Be(e));if(typeof e=="string")return Y(e);switch(e){case b:return Y("Suspense");case c:return Y("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case v:return $e(e.render);case m:return M(e.type,r,t);case R:{var n=e,o=n._payload,u=n._init;try{return M(u(o),r,t)}catch{}}}return""}var V=Object.prototype.hasOwnProperty,de={},ve=S.ReactDebugCurrentFrame;function $(e){if(e){var r=e._owner,t=M(e.type,e._source,r?r.type:null);ve.setExtraStackFrame(t)}else ve.setExtraStackFrame(null)}function ze(e,r,t,n,o){{var u=Function.call.bind(V);for(var i in e)if(u(e,i)){var a=void 0;try{if(typeof e[i]!="function"){var g=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw g.name="Invariant Violation",g}a=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(s){a=s}a&&!(a instanceof Error)&&($(o),p("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %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).",n||"React class",t,i,typeof a),$(null)),a instanceof Error&&!(a.message in de)&&(de[a.message]=!0,$(o),p("Failed %s type: %s",t,a.message),$(null))}}}var He=Array.isArray;function J(e){return He(e)}function Je(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function Ge(e){try{return pe(e),!1}catch{return!0}}function pe(e){return""+e}function ge(e){if(Ge(e))return p("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",Je(e)),pe(e)}var N=S.ReactCurrentOwner,qe={key:!0,ref:!0,__self:!0,__source:!0},he,me,G;G={};function Ke(e){if(V.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function Ze(e){if(V.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function Xe(e,r){if(typeof e.ref=="string"&&N.current&&r&&N.current.stateNode!==r){var t=C(N.current.type);G[t]||(p('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',C(N.current.type),e.ref),G[t]=!0)}}function Qe(e,r){{var t=function(){he||(he=!0,p("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function er(e,r){{var t=function(){me||(me=!0,p("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var rr=function(e,r,t,n,o,u,i){var a={$$typeof:x,type:e,key:r,ref:t,props:i,_owner:u};return a._store={},Object.defineProperty(a._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(a,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(a,"_source",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.freeze&&(Object.freeze(a.props),Object.freeze(a)),a};function tr(e,r,t,n,o){{var u,i={},a=null,g=null;t!==void 0&&(ge(t),a=""+t),Ze(r)&&(ge(r.key),a=""+r.key),Ke(r)&&(g=r.ref,Xe(r,o));for(u in r)V.call(r,u)&&!qe.hasOwnProperty(u)&&(i[u]=r[u]);if(e&&e.defaultProps){var s=e.defaultProps;for(u in s)i[u]===void 0&&(i[u]=s[u])}if(a||g){var f=typeof e=="function"?e.displayName||e.name||"Unknown":e;a&&Qe(i,f),g&&er(i,f)}return rr(e,a,g,o,n,N.current,i)}}var q=S.ReactCurrentOwner,_e=S.ReactDebugCurrentFrame;function k(e){if(e){var r=e._owner,t=M(e.type,e._source,r?r.type:null);_e.setExtraStackFrame(t)}else _e.setExtraStackFrame(null)}var K;K=!1;function Z(e){return typeof e=="object"&&e!==null&&e.$$typeof===x}function be(){{if(q.current){var e=C(q.current.type);if(e)return`

@@ -29,2 +29,2 @@ Check the render method of \``+e+"`."}return""}}function nr(e){{if(e!==void 0){var r=e.fileName.replace(/^.*[\\\/]/,""),t=e.lineNumber;return`

Check the top-level render call using <`+t+">.")}return r}}function Ee(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=ar(r);if(ye[t])return;ye[t]=!0;var n="";e&&e._owner&&e._owner!==q.current&&(n=" It was passed a child from "+C(e._owner.type)+"."),k(e),p('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),k(null)}}function Re(e,r){{if(typeof e!="object")return;if(J(e))for(var t=0;t<e.length;t++){var n=e[t];Z(n)&&Ee(n,r)}else if(Z(e))e._store&&(e._store.validated=!0);else if(e){var o=ke(e);if(typeof o=="function"&&o!==e.entries)for(var u=o.call(e),i;!(i=u.next()).done;)Z(i.value)&&Ee(i.value,r)}}}function ir(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===v||r.$$typeof===m))t=r.propTypes;else return;if(t){var n=C(r);ze(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!K){K=!0;var o=C(r);p("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",o||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&p("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function or(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){k(e),p("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),k(null);break}}e.ref!==null&&(k(e),p("Invalid attribute `ref` supplied to `React.Fragment`."),k(null))}}function Ce(e,r,t,n,o,u){{var i=We(e);if(!i){var a="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(a+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var g=nr(o);g?a+=g:a+=be();var s;e===null?s="null":J(e)?s="array":e!==void 0&&e.$$typeof===w?(s="<"+(C(e.type)||"Unknown")+" />",a=" Did you accidentally export a JSX literal instead of a component?"):s=typeof e,p("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",s,a)}var f=tr(e,r,t,o,u);if(f==null)return f;if(i){var _=r.children;if(_!==void 0)if(n)if(J(_)){for(var D=0;D<_.length;D++)Re(_[D],e);Object.freeze&&Object.freeze(_)}else p("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Re(_,e)}return e===x?or(f):ir(f),f}}function ur(e,r,t){return Ce(e,r,t,!0)}function lr(e,r,t){return Ce(e,r,t,!1)}var sr=lr,fr=ur;F.Fragment=x,F.jsx=sr,F.jsxs=fr}()),F}(function(d){process.env.NODE_ENV==="production"?d.exports=xe():d.exports=je()})(we);function Oe({element:d}){return d?l.jsx(y.Fragment,{children:d}):l.jsx("svg",{width:"50",height:"50",viewBox:"0 0 50 50",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsx("path",{d:"M8.33332 8.33332H14.5833L18.75 4.16666H31.25L35.4167 8.33332H41.6667C42.7717 8.33332 43.8315 8.77231 44.6129 9.55371C45.3943 10.3351 45.8333 11.3949 45.8333 12.5V37.5C45.8333 38.6051 45.3943 39.6649 44.6129 40.4463C43.8315 41.2277 42.7717 41.6666 41.6667 41.6666H8.33332C7.22825 41.6666 6.16845 41.2277 5.38704 40.4463C4.60564 39.6649 4.16666 38.6051 4.16666 37.5V12.5C4.16666 11.3949 4.60564 10.3351 5.38704 9.55371C6.16845 8.77231 7.22825 8.33332 8.33332 8.33332ZM25 14.5833C22.2373 14.5833 19.5878 15.6808 17.6343 17.6343C15.6808 19.5878 14.5833 22.2373 14.5833 25C14.5833 27.7627 15.6808 30.4122 17.6343 32.3657C19.5878 34.3192 22.2373 35.4167 25 35.4167C27.7627 35.4167 30.4122 34.3192 32.3657 32.3657C34.3192 30.4122 35.4167 27.7627 35.4167 25C35.4167 22.2373 34.3192 19.5878 32.3657 17.6343C30.4122 15.6808 27.7627 14.5833 25 14.5833ZM25 18.75C26.6576 18.75 28.2473 19.4085 29.4194 20.5806C30.5915 21.7527 31.25 23.3424 31.25 25C31.25 26.6576 30.5915 28.2473 29.4194 29.4194C28.2473 30.5915 26.6576 31.25 25 31.25C23.3424 31.25 21.7527 30.5915 20.5806 29.4194C19.4085 28.2473 18.75 26.6576 18.75 25C18.75 23.3424 19.4085 21.7527 20.5806 20.5806C21.7527 19.4085 23.3424 18.75 25 18.75Z",fill:"#848484"})})}function Pe({icon:d}){return d?l.jsx(y.Fragment,{children:d}):l.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"#848484",children:l.jsx("path",{d:"M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm7 14h-14v-4h14v4z"})})}const cr="";return({onFileAdded:d,onFileRemoved:w,uploadIcon:A,deleteIcon:x,style:P})=>{const[h,j]=y.useState({file:{},dataUrl:""}),E=b=>{const{files:c}=b.target;if(c!=null&&c.length>0){const m={file:c[0],dataUrl:URL.createObjectURL(c[0])};j(R=>({...R,...m})),d&&d(m)}},v=()=>{w!=null&&Object.keys(h).length>0&&w(h),j({})};return l.jsx("div",{className:"uploader__container",children:l.jsxs("div",{className:"uploader__placeholder",style:P,children:[l.jsx("div",{className:"uploader__btn_wrapper",children:l.jsx("div",{className:"uploader__btn",onClick:()=>v(),children:l.jsx(Pe,{icon:x})})}),h&&h.dataUrl!==null&&l.jsxs("label",{id:"file_uploader",className:"uploader__file_input_label",children:[l.jsx(Oe,{element:A}),l.jsx("input",{className:"uploader__file_input",type:"file",name:"upload",onChange:b=>E(b),accept:"image/*",id:"file_uploader"},h.dataUrl)]}),h.dataUrl&&l.jsx("img",{className:"uploader__file",src:h.dataUrl,alt:h.dataUrl,loading:"lazy"})]})})}});
Check the top-level render call using <`+t+">.")}return r}}function Ee(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=ar(r);if(ye[t])return;ye[t]=!0;var n="";e&&e._owner&&e._owner!==q.current&&(n=" It was passed a child from "+C(e._owner.type)+"."),k(e),p('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),k(null)}}function Re(e,r){{if(typeof e!="object")return;if(J(e))for(var t=0;t<e.length;t++){var n=e[t];Z(n)&&Ee(n,r)}else if(Z(e))e._store&&(e._store.validated=!0);else if(e){var o=ke(e);if(typeof o=="function"&&o!==e.entries)for(var u=o.call(e),i;!(i=u.next()).done;)Z(i.value)&&Ee(i.value,r)}}}function ir(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===v||r.$$typeof===m))t=r.propTypes;else return;if(t){var n=C(r);ze(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!K){K=!0;var o=C(r);p("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",o||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&p("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function or(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){k(e),p("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),k(null);break}}e.ref!==null&&(k(e),p("Invalid attribute `ref` supplied to `React.Fragment`."),k(null))}}function Ce(e,r,t,n,o,u){{var i=We(e);if(!i){var a="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(a+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var g=nr(o);g?a+=g:a+=be();var s;e===null?s="null":J(e)?s="array":e!==void 0&&e.$$typeof===x?(s="<"+(C(e.type)||"Unknown")+" />",a=" Did you accidentally export a JSX literal instead of a component?"):s=typeof e,p("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",s,a)}var f=tr(e,r,t,o,u);if(f==null)return f;if(i){var _=r.children;if(_!==void 0)if(n)if(J(_)){for(var D=0;D<_.length;D++)Re(_[D],e);Object.freeze&&Object.freeze(_)}else p("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Re(_,e)}return e===w?or(f):ir(f),f}}function ur(e,r,t){return Ce(e,r,t,!0)}function lr(e,r,t){return Ce(e,r,t,!1)}var sr=lr,fr=ur;F.Fragment=w,F.jsx=sr,F.jsxs=fr}()),F}(function(d){process.env.NODE_ENV==="production"?d.exports=we():d.exports=je()})(xe);function Oe({element:d}){return d?l.jsx(y.Fragment,{children:d}):l.jsx("svg",{width:"50",height:"50",viewBox:"0 0 50 50",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:l.jsx("path",{d:"M8.33332 8.33332H14.5833L18.75 4.16666H31.25L35.4167 8.33332H41.6667C42.7717 8.33332 43.8315 8.77231 44.6129 9.55371C45.3943 10.3351 45.8333 11.3949 45.8333 12.5V37.5C45.8333 38.6051 45.3943 39.6649 44.6129 40.4463C43.8315 41.2277 42.7717 41.6666 41.6667 41.6666H8.33332C7.22825 41.6666 6.16845 41.2277 5.38704 40.4463C4.60564 39.6649 4.16666 38.6051 4.16666 37.5V12.5C4.16666 11.3949 4.60564 10.3351 5.38704 9.55371C6.16845 8.77231 7.22825 8.33332 8.33332 8.33332ZM25 14.5833C22.2373 14.5833 19.5878 15.6808 17.6343 17.6343C15.6808 19.5878 14.5833 22.2373 14.5833 25C14.5833 27.7627 15.6808 30.4122 17.6343 32.3657C19.5878 34.3192 22.2373 35.4167 25 35.4167C27.7627 35.4167 30.4122 34.3192 32.3657 32.3657C34.3192 30.4122 35.4167 27.7627 35.4167 25C35.4167 22.2373 34.3192 19.5878 32.3657 17.6343C30.4122 15.6808 27.7627 14.5833 25 14.5833ZM25 18.75C26.6576 18.75 28.2473 19.4085 29.4194 20.5806C30.5915 21.7527 31.25 23.3424 31.25 25C31.25 26.6576 30.5915 28.2473 29.4194 29.4194C28.2473 30.5915 26.6576 31.25 25 31.25C23.3424 31.25 21.7527 30.5915 20.5806 29.4194C19.4085 28.2473 18.75 26.6576 18.75 25C18.75 23.3424 19.4085 21.7527 20.5806 20.5806C21.7527 19.4085 23.3424 18.75 25 18.75Z",fill:"#848484"})})}function Pe({icon:d}){return d?l.jsx(y.Fragment,{children:d}):l.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"#848484",children:l.jsx("path",{d:"M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm7 14h-14v-4h14v4z"})})}const cr="";return({onFileAdded:d,onFileRemoved:x,uploadIcon:A,deleteIcon:w,style:P})=>{const[h,j]=y.useState({file:{},dataUrl:""}),E=b=>{const{files:c}=b.target;if(c!=null&&c.length>0){const m={file:c[0],dataUrl:URL.createObjectURL(c[0])};j(R=>({...R,...m})),d&&d(m)}},v=()=>{x!=null&&Object.keys(h).length>0&&x(h),j({})};return l.jsx("div",{className:"uploader__container",children:l.jsxs("div",{className:"uploader__placeholder",style:P,children:[l.jsx("div",{className:"uploader__btn_wrapper",children:l.jsx("div",{className:"uploader__btn",onClick:()=>v(),children:l.jsx(Pe,{icon:w})})}),h&&h.dataUrl!==null&&l.jsxs("label",{id:"file_uploader",className:"uploader__file_input_label",children:[l.jsx(Oe,{element:A}),l.jsx("input",{className:"uploader__file_input",type:"file",name:"upload",onChange:b=>E(b),accept:"image/*",id:"file_uploader"},h.dataUrl)]}),h.dataUrl&&l.jsx("img",{className:"uploader__file",src:h.dataUrl,alt:h.dataUrl,loading:"lazy"})]})})}});
{
"name": "react-image-upload",
"version": "3.0.0",
"version": "3.0.1",
"description": "react library for uploading images",

@@ -17,3 +17,3 @@ "author": "chimdie",

"scripts": {
"build": "tsc && vite build",
"build": "vite build",
"dev": "vite",

@@ -42,4 +42,4 @@ "test": "echo \"No test specified\"",

},
"./dist/style.css": "./dist/style.css"
"./dist/index.css": "./dist/style.css"
}
}

@@ -56,3 +56,3 @@ # react-image-upload

| uploadIcon | ele | optional | The icon used to upload file |
| onFileAdded | func | optional | A function that runs after file has been uploaded and returns the uploaded file |
| onFileAdded | func | required | A function that runs after file has been uploaded and returns the uploaded file |
| onFileRemoved | func | optional | A function that runs after file has been removed and returns the removed file |

@@ -59,0 +59,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc