@uploadcare/react-uploader 0.3.0-alpha.3 → 0.3.0-alpha.5

package/dist/react-uploader.cjs

@@ -406,4 +406,4 @@
   <lr-url-source></lr-url-source>
   <lr-external-source></lr-external-source>
   <lr-progress-bar></lr-progress-bar>
-  <lr-cloud-image-editor-activity></lr-cloud-image-editor-activity>`;class ca extends Me{initCallback(){super.initCallback(),this.__shadowReady=!0,this.$["*faderEl"]=this.ref["fader-el"],this.$["*cropperEl"]=this.ref["cropper-el"],this.$["*imgContainerEl"]=this.ref["img-container-el"],this.initEditor()}async initEditor(){this.__shadowReady&&await super.initEditor()}}function Ge(s){for(let i in s){let e=[...i].reduce((t,r)=>(r.toUpperCase()===r&&(r="-"+r.toLowerCase()),t+=r),"");e.startsWith("-")&&(e=e.replace("-","")),e.startsWith("lr-")||(e="lr-"+e),s[i].reg&&s[i].reg(e)}}const St="LR";async function ha(s,i=!1){return new Promise((e,t)=>{if(typeof document!="object"){e(null);return}if(typeof window=="object"&&window[St]){e(window[St]);return}let r=document.createElement("script");r.async=!0,r.src=s,r.onerror=()=>{t()},r.onload=()=>{let n=window[St];i&&Ge(n),e(n)},document.head.appendChild(r)})}const ci=Object.freeze(Object.defineProperty({__proto__:null,ActivityBlock:_,ActivityHeader:aa,BaseComponent:at,Block:$,CameraSource:Bs,CloudImageEditor:ca,CloudImageEditorActivity:Ql,CloudImageEditorBlock:Me,Config:$s,ConfirmationDialog:Hs,Copyright:or,CropFrame:Xs,Data:T,DropArea:Zt,EditorCropButtonControl:Ys,EditorFilterControl:si,EditorImageCropper:Zs,EditorImageFader:Yl,EditorOperationControl:Js,EditorScroller:Qs,EditorSlider:Ks,EditorToolbar:er,ExternalSource:rr,FileItem:we,FilePreview:ti,FileUploaderInline:lr,FileUploaderMinimal:vt,FileUploaderRegular:ai,FormInput:la,Icon:Kt,Img:Qo,LineLoaderUi:tr,LrBtnUi:ni,Modal:ei,PACKAGE_NAME:Ht,PACKAGE_VERSION:Wt,PresenceToggle:ir,ProgressBar:qs,ProgressBarCommon:Ws,Select:nr,SimpleBtn:Jt,SliderUi:sr,SourceBtn:Qt,SourceList:ol,StartFrom:xs,Tabs:oi,UID:Ae,UploadCtxProvider:lt,UploadList:zs,UploaderBlock:x,UrlSource:Vs,Video:ne,connectBlocksFrom:ha,defineLocale:jt,registerBlocks:Ge,toKebabCase:gt},Symbol.toStringTag,{value:"Module"})),ua=new Set(["children","ref","style","className"]),da=(s={})=>Object==null?void 0:Object.keys(s).reduce((i,e)=>{var t,r;const n=s==null?void 0:s[e],o=`on${(r=(t=n==null?void 0:n.split("-"))==null?void 0:t.map(l=>l.charAt(0).toUpperCase()+l.slice(1)))==null?void 0:r.join("")}`;return i[o]=n,i},{}),ji=new WeakMap,fa=s=>{let i=ji.get(s);return i||(i=new Map,ji.set(s,i)),i},Hi=({node:s,nameProp:i,valueProp:e,prevValueProp:t,event:r})=>{if(r!==void 0&&e!==t){const n=fa(s),o=n.has(r);if(e){const l={handleEvent:e};o||s.addEventListener(r,l),n.set(r,l)}else if(o){const l=n.get(r);s.removeEventListener(r,l),n.delete(r)}return}s[i]=e,e==null&&i in HTMLElement.prototype&&s.removeAttribute(i)},pa=(s,i,e)=>{const t={},r={};return Object.entries(s).forEach(([n,o])=>{ua.has(n)?t[n==="className"?"class":n]=o:i.has(n)||n in e.prototype?r[n]=o:t[n]=o}),{reactProps:t,customElProps:r}},Xe=({react:s,tag:i,elClass:e,schemaEvents:t})=>{const r=da(t),n=new Set(Object.keys(r??{})),o=s.forwardRef((l,a)=>{const c=s.useRef(new Map),h=s.useRef(null),{reactProps:d,customElProps:f}=pa(l,n,e);return s.useLayoutEffect(()=>{if(h.current===null)return;const m=new Map;for(const p in f)Hi({node:h.current,nameProp:p,valueProp:f[p],prevValueProp:c.current.get(p),event:r[p]}),c.current.delete(p),m.set(p,l[p]);for(const[p,g]of c.current)Hi({node:h.current,nameProp:p,valueProp:void 0,prevValueProp:g,event:r[p]});c.current=m}),s.createElement(i??e.__tag,{...d,ref:s.useCallback(m=>{h.current=m,typeof a=="function"?a(m):a!==null&&(a.current=m)},[a])})});return o.displayName=e.name,o},hi=Xe({react:S,tag:"lr-config",elClass:$s}),ui=Xe({react:S,tag:"lr-upload-ctx-provider",elClass:lt,schemaEvents:lt.EventType}),di=s=>{const i={},e={};return Object.entries(s).forEach(([t,r])=>{t.startsWith("on")?i[t]=r:e[t]=r}),{eventHandlers:i,config:e}},ma="0.3.0-alpha.3",ga="React-Uploader",fi=()=>`${ga}/${ma}`;Ge(ci);const ba=Xe({react:S,tag:"lr-file-uploader-regular",elClass:ai}),_a=({ctxName:s,className:i,apiRef:e,...t})=>{const r=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:n,config:o}=S.useMemo(()=>di(t),[t]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":r,...o}),S.createElement(ui,{ref:e,"ctx-name":r,...n}),S.createElement(ba,{"ctx-name":r}))};Ge(ci);const va=Xe({react:S,tag:"lr-file-uploader-minimal",elClass:vt}),ya=({ctxName:s,className:i,apiRef:e,...t})=>{const r=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:n,config:o}=S.useMemo(()=>di(t),[t]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":r,...o}),S.createElement(ui,{ref:e,"ctx-name":r,...n}),S.createElement(va,{"ctx-name":r}))};Ge(ci);const Ca=Xe({react:S,tag:"lr-file-uploader-inline",elClass:vt}),wa=({ctxName:s,className:i,apiRef:e,...t})=>{const r=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:n,config:o}=S.useMemo(()=>di(t),[t]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":r,...o}),S.createElement(ui,{ref:e,"ctx-name":r,...n}),S.createElement(Ca,{"ctx-name":r}))};exports.FileUploaderInline=wa;exports.FileUploaderMinimal=ya;exports.FileUploaderRegular=_a;exports.UploadCtxProvider=lt;exports.defineLocale=jt;
+  <lr-cloud-image-editor-activity></lr-cloud-image-editor-activity>`;class ca extends Me{initCallback(){super.initCallback(),this.__shadowReady=!0,this.$["*faderEl"]=this.ref["fader-el"],this.$["*cropperEl"]=this.ref["cropper-el"],this.$["*imgContainerEl"]=this.ref["img-container-el"],this.initEditor()}async initEditor(){this.__shadowReady&&await super.initEditor()}}function Ge(s){for(let i in s){let e=[...i].reduce((t,r)=>(r.toUpperCase()===r&&(r="-"+r.toLowerCase()),t+=r),"");e.startsWith("-")&&(e=e.replace("-","")),e.startsWith("lr-")||(e="lr-"+e),s[i].reg&&s[i].reg(e)}}const St="LR";async function ha(s,i=!1){return new Promise((e,t)=>{if(typeof document!="object"){e(null);return}if(typeof window=="object"&&window[St]){e(window[St]);return}let r=document.createElement("script");r.async=!0,r.src=s,r.onerror=()=>{t()},r.onload=()=>{let n=window[St];i&&Ge(n),e(n)},document.head.appendChild(r)})}const ci=Object.freeze(Object.defineProperty({__proto__:null,ActivityBlock:_,ActivityHeader:aa,BaseComponent:at,Block:$,CameraSource:Bs,CloudImageEditor:ca,CloudImageEditorActivity:Ql,CloudImageEditorBlock:Me,Config:$s,ConfirmationDialog:Hs,Copyright:or,CropFrame:Xs,Data:T,DropArea:Zt,EditorCropButtonControl:Ys,EditorFilterControl:si,EditorImageCropper:Zs,EditorImageFader:Yl,EditorOperationControl:Js,EditorScroller:Qs,EditorSlider:Ks,EditorToolbar:er,ExternalSource:rr,FileItem:we,FilePreview:ti,FileUploaderInline:lr,FileUploaderMinimal:vt,FileUploaderRegular:ai,FormInput:la,Icon:Kt,Img:Qo,LineLoaderUi:tr,LrBtnUi:ni,Modal:ei,PACKAGE_NAME:Ht,PACKAGE_VERSION:Wt,PresenceToggle:ir,ProgressBar:qs,ProgressBarCommon:Ws,Select:nr,SimpleBtn:Jt,SliderUi:sr,SourceBtn:Qt,SourceList:ol,StartFrom:xs,Tabs:oi,UID:Ae,UploadCtxProvider:lt,UploadList:zs,UploaderBlock:x,UrlSource:Vs,Video:ne,connectBlocksFrom:ha,defineLocale:jt,registerBlocks:Ge,toKebabCase:gt},Symbol.toStringTag,{value:"Module"})),ua=new Set(["children","ref","style","className"]),da=(s={})=>Object==null?void 0:Object.keys(s).reduce((i,e)=>{var t,r;const n=s==null?void 0:s[e],o=`on${(r=(t=n==null?void 0:n.split("-"))==null?void 0:t.map(l=>l.charAt(0).toUpperCase()+l.slice(1)))==null?void 0:r.join("")}`;return i[o]=n,i},{}),ji=new WeakMap,fa=s=>{let i=ji.get(s);return i===void 0&&(i=new Map,ji.set(s,i)),i},Hi=({node:s,nameProp:i,valueProp:e,prevValueProp:t,event:r})=>{if(r!==void 0){if(e!==t){const n=fa(s),o=n.has(r);let l=n.get(r);e!==void 0?o?l.handleEvent=e:(l={handleEvent:e},n.set(r,l),s.addEventListener(r,a=>l.handleEvent(a.detail))):o&&(n.delete(r),s.removeEventListener(r,l))}return}s[i]=e,e==null&&i in HTMLElement.prototype&&s.removeAttribute(i)},pa=(s,i,e)=>{const t={},r={};return Object.entries(s).forEach(([n,o])=>{ua.has(n)?t[n==="className"?"class":n]=o:i.has(n)||n in e.prototype?r[n]=o:t[n]=o}),{reactProps:t,customElProps:r}},Xe=({react:s,tag:i,elClass:e,schemaEvents:t})=>{const r=da(t),n=new Set(Object.keys(r??{})),o=s.forwardRef((l,a)=>{const c=s.useRef(new Map),h=s.useRef(null),{reactProps:d,customElProps:f}=pa(l,n,e);return s.useLayoutEffect(()=>{if(h.current===null)return;const m=new Map;for(const p in f)Hi({node:h.current,nameProp:p,valueProp:f[p],prevValueProp:c.current.get(p),event:r[p]}),c.current.delete(p),m.set(p,l[p]);for(const[p,g]of c.current)Hi({node:h.current,nameProp:p,valueProp:void 0,prevValueProp:g,event:r[p]});c.current=m}),s.createElement(i??e.__tag,{...d,ref:s.useCallback(m=>{h.current=m,typeof a=="function"?a(m):a!==null&&(a.current=m)},[a])})});return o.displayName=e.name,o},hi=Xe({react:S,tag:"lr-config",elClass:$s}),ui=Xe({react:S,tag:"lr-upload-ctx-provider",elClass:lt,schemaEvents:lt.EventType}),di=s=>{const i={},e={};return Object.entries(s).forEach(([t,r])=>{t.startsWith("on")?i[t]=r:e[t]=r}),{eventHandlers:i,config:e}},ma="0.3.0-alpha.5",ga="React-Uploader",fi=()=>`${ga}/${ma}`;Ge(ci);const ba=Xe({react:S,tag:"lr-file-uploader-regular",elClass:ai}),_a=({ctxName:s,className:i,classNameUploader:e,apiRef:t,...r})=>{const n=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:o,config:l}=S.useMemo(()=>di(r),[r]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":n,...l}),S.createElement(ui,{ref:t,"ctx-name":n,...o}),S.createElement(ba,{class:e,"ctx-name":n}))};Ge(ci);const va=Xe({react:S,tag:"lr-file-uploader-minimal",elClass:vt}),ya=({ctxName:s,className:i,classNameUploader:e,apiRef:t,...r})=>{const n=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:o,config:l}=S.useMemo(()=>di(r),[r]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":n,...l}),S.createElement(ui,{ref:t,"ctx-name":n,...o}),S.createElement(va,{class:e,"ctx-name":n}))};Ge(ci);const Ca=Xe({react:S,tag:"lr-file-uploader-inline",elClass:vt}),wa=({ctxName:s,className:i,classNameUploader:e,apiRef:t,...r})=>{const n=S.useMemo(()=>s??Ae.generate(),[s]),{eventHandlers:o,config:l}=S.useMemo(()=>di(r),[r]);return S.createElement("div",{className:i},S.createElement(hi,{userAgentIntegration:fi(),"ctx-name":n,...l}),S.createElement(ui,{ref:t,"ctx-name":n,...o}),S.createElement(Ca,{class:e,"ctx-name":n}))};exports.FileUploaderInline=wa;exports.FileUploaderMinimal=ya;exports.FileUploaderRegular=_a;exports.UploadCtxProvider=lt;exports.defineLocale=jt;

package/dist/react-uploader.d.ts

@@ -15,11 +15,12 @@ export declare const FileUploaderRegular: FC<TProps>;
 
 declare type TDefaultProps = {
     className?: string;
+    classNameUploader?: string;
     ctxName?: string;
 };
 
-declare type TEventsSchema = {
-    [K in keyof EventMap as TPrefixOnAndCamelCase<K>]: EventMap[K];
+export declare type TEventsSchema = {
+    [K in keyof EventMap as TPrefixOnAndCamelCase<K>]: (event: EventMap[K]["detail"]) => void;
 };
 
 declare type TExtraPrefixOn<S extends string> = `on${Capitalize<S>}`;

package/dist/react-uploader.js

@@ -9199,7 +9199,7 @@ const ci = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   return i[o] = n, i;
 }, {}), ji = /* @__PURE__ */ new WeakMap(), pa = (s) => {
   let i = ji.get(s);
-  return i || (i = /* @__PURE__ */ new Map(), ji.set(s, i)), i;
+  return i === void 0 && (i = /* @__PURE__ */ new Map(), ji.set(s, i)), i;
 }, Hi = ({
   node: s,
   nameProp: i,
@@ -9207,16 +9207,14 @@ const ci = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   prevValueProp: t,
   event: r
 }) => {
-  if (r !== void 0 && e !== t) {
-    const n = pa(s), o = n.has(r);
-    if (e) {
-      const l = {
-        handleEvent: e
-      };
-      o || s.addEventListener(r, l), n.set(r, l);
-    } else if (o) {
-      const l = n.get(r);
-      s.removeEventListener(r, l), n.delete(r);
+  if (r !== void 0) {
+    if (e !== t) {
+      const n = pa(s), o = n.has(r);
+      let l = n.get(r);
+      e !== void 0 ? o ? l.handleEvent = e : (l = { handleEvent: e }, n.set(r, l), s.addEventListener(
+        r,
+        (a) => l.handleEvent(a.detail)
+      )) : o && (n.delete(r), s.removeEventListener(r, l));
     }
     return;
   }
@@ -9286,7 +9284,7 @@ const ci = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     eventHandlers: i,
     config: e
   };
-}, ga = "0.3.0-alpha.3", ba = "React-Uploader", fi = () => `${ba}/${ga}`;
+}, ga = "0.3.0-alpha.5", ba = "React-Uploader", fi = () => `${ba}/${ga}`;
 Xe(ci);
 const _a = Ye({
   react: L,
@@ -9295,21 +9293,22 @@ const _a = Ye({
 }), $a = ({
   ctxName: s,
   className: i,
-  apiRef: e,
-  ...t
+  classNameUploader: e,
+  apiRef: t,
+  ...r
 }) => {
-  const r = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: n, config: o } = ke(
-    () => di(t),
-    [t]
+  const n = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: o, config: l } = ke(
+    () => di(r),
+    [r]
   );
-  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": r, ...o }), /* @__PURE__ */ L.createElement(
+  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": n, ...l }), /* @__PURE__ */ L.createElement(
     ui,
     {
-      ref: e,
-      "ctx-name": r,
-      ...n
+      ref: t,
+      "ctx-name": n,
+      ...o
     }
-  ), /* @__PURE__ */ L.createElement(_a, { "ctx-name": r }));
+  ), /* @__PURE__ */ L.createElement(_a, { class: e, "ctx-name": n }));
 };
 Xe(ci);
 const va = Ye({
@@ -9319,26 +9318,22 @@ const va = Ye({
 }), Sa = ({
   ctxName: s,
   className: i,
-  apiRef: e,
-  ...t
+  classNameUploader: e,
+  apiRef: t,
+  ...r
 }) => {
-  const r = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: n, config: o } = ke(
-    () => di(t),
-    [t]
+  const n = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: o, config: l } = ke(
+    () => di(r),
+    [r]
   );
-  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": r, ...o }), /* @__PURE__ */ L.createElement(
+  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": n, ...l }), /* @__PURE__ */ L.createElement(
     ui,
     {
-      ref: e,
-      "ctx-name": r,
-      ...n
-    }
-  ), /* @__PURE__ */ L.createElement(
-    va,
-    {
-      "ctx-name": r
+      ref: t,
+      "ctx-name": n,
+      ...o
     }
-  ));
+  ), /* @__PURE__ */ L.createElement(va, { class: e, "ctx-name": n }));
 };
 Xe(ci);
 const ya = Ye({
@@ -9348,21 +9343,22 @@ const ya = Ye({
 }), xa = ({
   ctxName: s,
   className: i,
-  apiRef: e,
-  ...t
+  classNameUploader: e,
+  apiRef: t,
+  ...r
 }) => {
-  const r = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: n, config: o } = ke(
-    () => di(t),
-    [t]
+  const n = ke(() => s ?? Ae.generate(), [s]), { eventHandlers: o, config: l } = ke(
+    () => di(r),
+    [r]
   );
-  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": r, ...o }), /* @__PURE__ */ L.createElement(
+  return /* @__PURE__ */ L.createElement("div", { className: i }, /* @__PURE__ */ L.createElement(hi, { userAgentIntegration: fi(), "ctx-name": n, ...l }), /* @__PURE__ */ L.createElement(
     ui,
     {
-      ref: e,
-      "ctx-name": r,
-      ...n
+      ref: t,
+      "ctx-name": n,
+      ...o
     }
-  ), /* @__PURE__ */ L.createElement(ya, { "ctx-name": r }));
+  ), /* @__PURE__ */ L.createElement(ya, { class: e, "ctx-name": n }));
 };
 export {
   xa as FileUploaderInline,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@uploadcare/react-uploader",
   "description": "React component for file uploads using Uploadcare",
-  "version": "0.3.0-alpha.3",
+  "version": "0.3.0-alpha.5",
   "private": false,
   "type": "module",
   "files": [
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@uploadcare/blocks": "^0.39.1",
-    "@uploadcare/react-adapter": "0.2.0"
+    "@uploadcare/react-adapter": "^0.2.0-alpha.1"
   },
   "repository": {
     "type": "git",
@@ -81,4 +81,4 @@
     "react hook file upload",
     "front-end"
   ]
-}
+}