"use strict";(self.webpackChunkweb_toolbox=self.webpackChunkweb_toolbox||[]).push([[939],{32376:(e,t,n)=>{n.d(t,{A:()=>s});var a=n(9950),r=n(69935),l=n(10226),i=n(67243),o=n.n(i),c=n(77671);const s=e=>{let{data:t,isDisabled:n,hoverMessage:i,feedbackMessage:s,Icon:m=r.A,...d}=e;const{setToasterState:p}=(0,c.dq)();return a.createElement(l.A,Object.assign({disabled:!t||n,title:null!==i&&void 0!==i?i:"Copy to clipboard",variant:"contained","data-testid":"copy-to-clipboard",color:"primary"},d,{onClick:()=>{if(!t)return;const e=null!==s&&void 0!==s?s:"Content copied into clipboard: ".concat(t.substring(0,25)," \u2026");o()(t,{format:"text/plain"}),p({open:!0,message:e,type:"success",autoHideDuration:2e3})}}),a.createElement(m,null))}},50057:(e,t,n)=>{n.d(t,{n:()=>c});var a=n(9950),r=n(25131),l=n(72772),i=n(73931);const o=(0,r.A)((e=>({root:{margin:e.spacing(1)}}))),c=e=>{let{title:t,iconType:n,children:r}=e;const c=o();return a.createElement(a.Fragment,null,a.createElement(l.m,{titleTemplate:"Web Toolbox - %s",defaultTitle:"Web Toolbox",title:t}),a.createElement("div",{className:c.root},a.createElement(i.A,{iconType:n,title:t}),r))}},73931:(e,t,n)=>{n.d(t,{A:()=>i});var a=n(9950),r=n(82053);const l=(0,n(25131).A)((e=>({title:{wordBreak:"break-word"},titleWithIcon:{display:"flex",justifyContent:"center",alignItems:"center",marginBottom:e.spacing(1)},icon:{height:"40px",width:"40px",marginRight:e.spacing(1)}}))),i=e=>{let{title:t,iconType:n}=e;const i=l();return a.createElement("div",{className:i.titleWithIcon},a.createElement(n,{className:i.icon}),a.createElement(r.A,{variant:"h5",className:i.title},t))}},38033:(e,t,n)=>{n.d(t,{y:()=>s});var a=n(9950),r=n(25131),l=n(20516),i=n(53702),o=n.n(i);const c=(0,r.A)((()=>({root:{"& .spinner_overlay":{background:"rgba(0, 0, 0, 0.3)"}}}))),s=e=>{let{active:t,children:n}=e;const r=c();return a.createElement(l.A,{classNamePrefix:"spinner_",className:r.root,active:t,spinner:a.createElement(o(),{color:"#bf3a2b"})},n)}},97939:(e,t,n)=>{n.r(t),n.d(t,{default:()=>y});var a=n(9950),r=n(70060),l=n(48089),i=n(82053),o=n(16491),c=n(50704),s=n(8145),m=n(83239),d=n(24086),p=n(27847),u=n(36275),g=n(32376),E=n(50057),b=n(38033);const v=25e4;var h=n(25131);const f={marginTop:10,display:"flex",alignItems:"center",justifyContent:"center",border:"solid 1px blue"},A=(0,h.A)((e=>({header:{padding:"20px 0"},dropzone:{flex:"1",cursor:"pointer",display:"flex",flexDirection:"column",alignItems:"center",padding:"20px"},image:{width:"100%"},toolbar:{margin:0,padding:0,"& > *":{marginLeft:e.spacing(1)}}}))),y=()=>{const e=A(),[t,n]=(0,a.useState)([]),[h,y]=(0,a.useState)([]),x=(0,a.useCallback)(((e,t)=>{y(t.map((e=>({name:e.file.name,size:e.file.size,error:"Exceeds size limit: ".concat((0,d.A)(v))})))),n([]),e.forEach((e=>function(e){return new Promise(((t,n)=>{const a=new FileReader,r={name:e.name,size:e.size};a.addEventListener("abort",(e=>n("File upload aborted: ".concat(e)))),a.addEventListener("error",(e=>n("File upload error: ".concat(e)))),a.addEventListener("load",(()=>t({...r,encoded:a.result})),!1),a.readAsDataURL(e)}))}(e).then((e=>n((t=>[...t,e])))).catch((t=>y((n=>[...n,{name:e.name,size:e.size,error:t}]))))))}),[]),{acceptedFiles:k,getRootProps:w,getInputProps:z}=(0,u.VB)({maxSize:v,multiple:!0,onDrop:x}),C=k.length!==t.length;return a.createElement(E.n,{iconType:r.A,title:"Base64 file encoder"},a.createElement(b.y,{active:C},a.createElement(l.A,w({className:e.dropzone}),a.createElement("input",z()),a.createElement(i.A,{variant:"body1"},"Drag 'n' drop some files here"),a.createElement(i.A,{variant:"body1"},"or just click to select files"))),a.createElement("div",null,h&&h.map(((e,t)=>{const n=(0,d.A)(e.size);return a.createElement("div",{key:t},a.createElement(i.A,{variant:"body1"},a.createElement("strong",null,e.name)," (",n," bytes): ",e.error))}))),a.createElement("div",null,C&&a.createElement(i.A,{color:"secondary",variant:"h5"},"Processing ",k.length-t.length," file(s)")),t.map(((t,n)=>a.createElement("div",{key:n},a.createElement(l.A,{sx:{mt:2}},t.encoded.startsWith("data:image/")&&a.createElement(o.A,{component:"div",alignItems:"center",justifyContent:"center"},a.createElement(p.c,{style:f,defaultSize:{width:300,height:"100%"}},a.createElement("img",{src:t.encoded,alt:t.name,className:e.image}))),a.createElement(c.A,null,a.createElement(i.A,{gutterBottom:!0,align:"center",variant:"h5",component:"h2"},a.createElement("b",null,t.name)," (",(0,d.A)(t.size),")"),t.encoded.startsWith("data:image/")&&a.createElement(s.A,{label:"Full img tag",fullWidth:!0,value:'<img alt="'.concat(t.name,'" src="').concat(t.encoded,'"/>'),margin:"normal",variant:"outlined"}),a.createElement(s.A,{label:"Base64 encoded. Copy-paste into 'src' attribute",fullWidth:!0,value:t.encoded,margin:"normal",variant:"outlined",multiline:!0,minRows:"8"}),a.createElement(m.A,{className:e.toolbar},a.createElement(o.A,{component:"div",flexGrow:1}),a.createElement(g.A,{data:t.encoded}))))))))}}}]);