@undp/design-system-react/dist/file-upload-BUvU8RiK.cjs

React based design system for UNDP

const e=require("./utils-Dd9-5CFr.cjs"),t=require("./createLucideIcon-FKMTNncQ.cjs"),n=require("./label-fz_PVgVk.cjs"),r=require("./Button.cjs"),i=require("./Badge.cjs"),a=require("./Typography.cjs");let o=require("react"),s=require("react/jsx-runtime");var c=t.t(`trash-2`,[[`path`,{d:`M10 11v6`,key:`nco0om`}],[`path`,{d:`M14 11v6`,key:`outv1u`}],[`path`,{d:`M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6`,key:`miytrc`}],[`path`,{d:`M3 6h18`,key:`d0wm0j`}],[`path`,{d:`M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2`,key:`e791ji`}]]),l=t.t(`upload`,[[`path`,{d:`M12 3v12`,key:`1x0j5s`}],[`path`,{d:`m17 8-5-5-5 5`,key:`7q97r8`}],[`path`,{d:`M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4`,key:`ih7n3h`}]]);function u({onFileChange:t,children:u,...d}){let f=d.id||e.n(),[p,m]=(0,o.useState)([]),h=e=>{if(e.target.files){let n=[...Array.from(e.target.files)];d.multiple&&(n=[...p,...Array.from(e.target.files)]),m(n),t?.(n)}},g=e=>{let n=p.filter((t,n)=>n!==e);m(n),t?.(n)};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)(`div`,{className:e.t(`mb-2.5 flex w-full flex-col items-center gap-4`,d.className),children:[(0,s.jsx)(`input`,{...d,id:f,type:`file`,className:`hidden`,onChange:h}),(0,s.jsx)(`label`,{htmlFor:f,className:`flex w-full`,children:u||(0,s.jsxs)(`div`,{className:`flex w-full cursor-pointer flex-col items-center gap-2 rounded-base bg-surface px-4 py-6 text-content-primary hover:bg-surface-hover`,children:[(0,s.jsx)(l,{className:`h-7 w-7`,strokeWidth:1}),(0,s.jsx)(a.P,{className:`text-content-primary`,size:`sm`,marginBottom:`none`,children:`Click on this area to upload`})]})})]}),p.length>0?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.t,{children:`File(s) uploaded`}),(0,s.jsx)(`div`,{className:`justify-left mt-1 flex w-full flex-wrap gap-2.5`,children:p?.map((e,t)=>(0,s.jsxs)(i.Badge,{variant:`surface`,className:`flex gap-4 border border-stroke bg-surface pr-4 pl-4`,children:[(0,s.jsx)(`span`,{className:`truncate text-base text-content-primary`,children:e.name}),(0,s.jsx)(r.Button,{variant:`icon`,padding:`none`,onClick:()=>g(t),children:(0,s.jsx)(c,{className:`h-4 w-4 stroke-error`})})]},e.name))})]}):null]})}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return u}});
//# sourceMappingURL=file-upload-BUvU8RiK.cjs.map