umwd-components 0.1.348 → 0.1.349

package/dist/src/components/common/media/UploadMediaForm.js

@@ -4,4 +4,4 @@
  * @copyright Jelle Paulus
  * @license MIT
  */
-import{__read as e}from"../../../../node_modules/tslib/tslib.es6.js";import t,{useState as r,useRef as n}from"react";import l from"@mui/material/Stack";import a from"@mui/material/Typography";import i from"@mui/material/Box";import{useFormState as o}from"react-dom";import{uploadMediaAction as m}from"../../../data/actions/media/uploadMediaAction.js";import{StrapiErrors as c}from"../../StrapiErrors.js";import{ZodErrors as u}from"../../ZodErrors.js";import s from"@mui/material/Alert";import{SubmitButton as p}from"../../SubmitButton.js";var d={zodErrors:null,strapiErrors:null,data:null,message:null};function f(f){var E,y=f.reference,v=f.refID,g=f.field,x=f.multiple,h=void 0===x||x,b=f.accept,j=void 0===b?"image/*":b;f.fileData,f.revalidateCallback;var k=e(r(null),2),w=k[0],C=k[1],I=e(r(null),2),O=I[0],S=I[1],z=e(o(m,d),2),A=z[0],B=z[1],D=n(null);return t.createElement("form",{action:B},t.createElement(l,{spacing:1,sx:{flex:1}},y&&t.createElement("input",{type:"text",name:"ref",value:y,style:{display:"none"},readOnly:!0}),v&&t.createElement("input",{type:"text",name:"refId",value:v,style:{display:"none"},readOnly:!0}),g&&t.createElement("input",{type:"text",name:"field",value:g,style:{display:"none"},readOnly:!0}),null!==w?t.createElement(i,{onClick:function(){var e;return null===(e=D.current)||void 0===e?void 0:e.click()},sx:{p:2,width:"100%",border:"1px dashed white",minHeight:"100px"}},void 0===j||"image/*"===j?t.createElement(l,{direction:"row",spacing:1,justifyContent:"flex-end"},w.map((function(e,r){return t.createElement("img",{key:r,src:e.url,alt:e.name,style:{width:"100px"}})}))):t.createElement(l,{spacing:1,justifyContent:"flex-end"},w.map((function(e,r){return t.createElement(a,{key:r},e.name)})))):t.createElement(i,{onClick:function(){var e;return null===(e=D.current)||void 0===e?void 0:e.click()},sx:{p:2,width:"100%",border:"1px dashed white",minHeight:"100px"}},t.createElement(a,null,"No file","".concat(h?"s":"")," selected")),t.createElement(l,{direction:"column",spacing:2,alignItems:"center",justifyContent:"space-between"},t.createElement(c,{error:A.strapiErrors}),t.createElement(u,{error:null===(E=A.zodErrors)||void 0===E?void 0:E.image}),(null==A?void 0:A.message)&&t.createElement(s,{severity:"error"},null==A?void 0:A.message),t.createElement(i,null,t.createElement("label",{htmlFor:"pictureInput"},t.createElement("input",{id:"pictureInput",accept:j,multiple:h,type:"file",name:"files",ref:D,onChange:function(e){console.log(e.target.files);var t=e.target.files;if(null!==t){var r=Object.keys(t).map((function(e,r){return{url:URL.createObjectURL(t[r]),name:t[r].name}}));S(t),C(r)}},style:{display:"none"}})),null!==O&&t.createElement(p,{text:"upload",loadingText:"loading"})))))}export{f as UploadMediaForm};
+import{__read as e}from"../../../../node_modules/tslib/tslib.es6.js";import t,{useState as r,useRef as n,useEffect as l}from"react";import a from"@mui/material/Stack";import i from"@mui/material/Typography";import o from"@mui/material/Box";import{useFormState as m}from"react-dom";import{uploadMediaAction as c}from"../../../data/actions/media/uploadMediaAction.js";import{StrapiErrors as u}from"../../StrapiErrors.js";import{ZodErrors as s}from"../../ZodErrors.js";import p from"@mui/material/Alert";import{SubmitButton as d}from"../../SubmitButton.js";var f={zodErrors:null,strapiErrors:null,data:null,message:null};function E(E){var y,v=E.reference,g=E.refID,x=E.field,h=E.multiple,b=void 0===h||h,j=E.accept,k=void 0===j?"image/*":j;E.fileData;var w=E.revalidateCallback,C=e(r(null),2),I=C[0],O=C[1],S=e(r(null),2),z=S[0],A=S[1],B=e(m(c,f),2),D=B[0],H=B[1],L=n(null);return l((function(){D.data&&(null==w||w())}),[D.data]),t.createElement("form",{action:H},t.createElement(a,{spacing:1,sx:{flex:1}},v&&t.createElement("input",{type:"text",name:"ref",value:v,style:{display:"none"},readOnly:!0}),g&&t.createElement("input",{type:"text",name:"refId",value:g,style:{display:"none"},readOnly:!0}),x&&t.createElement("input",{type:"text",name:"field",value:x,style:{display:"none"},readOnly:!0}),null!==I?t.createElement(o,{onClick:function(){var e;return null===(e=L.current)||void 0===e?void 0:e.click()},sx:{p:2,width:"100%",border:"1px dashed white",minHeight:"100px"}},void 0===k||"image/*"===k?t.createElement(a,{direction:"row",spacing:1,justifyContent:"flex-end"},I.map((function(e,r){return t.createElement("img",{key:r,src:e.url,alt:e.name,style:{width:"100px"}})}))):t.createElement(a,{spacing:1,justifyContent:"flex-end"},I.map((function(e,r){return t.createElement(i,{key:r},e.name)})))):t.createElement(o,{onClick:function(){var e;return null===(e=L.current)||void 0===e?void 0:e.click()},sx:{p:2,width:"100%",border:"1px dashed white",minHeight:"100px"}},t.createElement(i,null,"No file","".concat(b?"s":"")," selected")),t.createElement(a,{direction:"column",spacing:2,alignItems:"center",justifyContent:"space-between"},t.createElement(u,{error:D.strapiErrors}),t.createElement(s,{error:null===(y=D.zodErrors)||void 0===y?void 0:y.image}),(null==D?void 0:D.message)&&t.createElement(p,{severity:"error"},null==D?void 0:D.message),t.createElement(o,null,t.createElement("label",{htmlFor:"pictureInput"},t.createElement("input",{id:"pictureInput",accept:k,multiple:b,type:"file",name:"files",ref:L,onChange:function(e){console.log(e.target.files);var t=e.target.files;if(null!==t){var r=Object.keys(t).map((function(e,r){return{url:URL.createObjectURL(t[r]),name:t[r].name}}));A(t),O(r)}},style:{display:"none"}})),null!==z&&t.createElement(d,{text:"upload",loadingText:"loading"})))))}export{E as UploadMediaForm};