@armco/uploader 0.0.4 → 0.0.6

package/cjs/Uploader.js

@@ -1,2 +1,2 @@
-(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".ar-Uploader .ar-Uploader__file-uploader-progress-bar{transition:max-height .3s,opacity .3s,padding .3s,margin-bottom .3s,background-color .3s;opacity:0;max-height:0}.ar-Uploader .ar-Uploader__file-uploader-progress-bar.show{opacity:1;max-height:4rem}.ar-Uploader .ar-Uploader__file-uploader-progress-bar:hover{background-color:var(--ar-bg-hover-6)}.ar-Uploader .ar-Button.loading .pre{animation:rotating .5s linear infinite}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{transition:border .3s ease-in-out;border:1px dashed lightgrey;border-radius:.5rem;padding:.5rem;background-color:var(--ar-bg-base)}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input:has(.ar-Avatar.FAILED){border-color:var(--ar-color-danger-soft)}.ar-Uploader .ar-Uploader__upload-prompt-text{color:var(--ar-color-obscure-4)}.ar-Uploader .ar-Uploader__upload-message{color:var(--ar-color-obscure-2)}")),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-"use strict";const s=require("react/jsx-runtime"),c=require("react"),C=require("uuid"),ie=require("react-dnd-html5-backend"),n=require("@armco/types"),oe=require("./useUpload.js"),ce=require("@armco/utils/hooks"),ue=require("@armco/utils/helper"),de=require("@armco/utils/network"),me=require("@armco/shared-components/Droppable"),W=require("@armco/shared-components/Button"),fe=require("@armco/shared-components/Text"),pe=require("@armco/shared-components/ProgressIndicator"),ge=require("@armco/shared-components/Tooltip"),xe=require("@armco/configs/endpoints"),P=require("@armco/avatar"),_=require("@armco/icon"),he=({clear:i,demo:a,disabled:p,result:u})=>{const[F,A]=c.useState(),[T,d]=c.useState();c.useEffect(()=>{d(!0)},[]);const b=u.type==="image",I=s.jsx(pe,{label:u.file.name,preIcon:b?"":"im.ImAttachment",progress:u.progress,slot:n.ArPopoverSlots.ANCHOR,rightEndContent:(F||u.status===n.ArProgress.FAILED)&&s.jsx(_,{icon:"ri.RiDeleteBin6Fill",attributes:{colors:{fillColor:u.status===n.ArProgress.FAILED?"#ff4d4f":"grey"},classes:p?"":"cursor-pointer"},events:{onClick:()=>{p||(d(!1),setTimeout(i,300))}}}),status:u.status,thumbnailRenderer:()=>b?s.jsx(P,{classes:"me-3",item:u,size:n.ArSizes.XSMALL,variant:"circle",viewOnly:!0}):null}),R=x=>typeof x=="string"?x:x.error||x.message||"Server Error";return s.jsx("div",{className:`ar-Uploader__file-uploader-progress-bar position-relative ${T?" show p-1 border-radius l1 mb-1 cursor-pointer":" px-1"} ${u.status}`,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1),children:u.status===n.ArProgress.FAILED?s.jsxs(ge,{demo:a,children:[I,s.jsx("span",{slot:n.ArPopoverSlots.POPOVER,children:R(u.error)})]}):I})},ye=c.memo(i=>{const{acceptedFileTypes:a,acceptedFileCount:p,afterUpload:u,allowMultiple:F,beforeUpload:A,demo:T,disabled:d,uploadEntryRenderer:b,errorMessage:I="Failed to upload",endpoint:R,fileSizeLimit:x="5mb",files:g,handler:V,message:U,onFileSelected:q,avatarSize:J=n.ArSizes.REGULAR,variant:r="compact",theme:K,updateEndpoint:M,uploadSequential:X,uploadButtonText:w="Upload",uploadingButtonText:z="Uploading..."}=i,m=c.useRef(null),{notify:j}=ce.useNotification(),[t,$]=c.useState(),[v,D]=c.useState(),[L,B]=c.useState(),[N,k]=c.useState(),Y=c.useMemo(()=>v?p!==void 0?g==null?void 0:g.slice(0,p):g:g==null?void 0:g.slice(0,1),[g]),{clear:E,upload:Q,results:O}=oe(R||V||"",X,Y),h=r==="image-circle"||r==="image-rect";c.useEffect(()=>{$(O),(!O||Object.keys(O).length===0)&&m.current&&(m.current.value="");let e;t&&Object.keys(t).length>0&&Object.keys(t).every(l=>{const o=t[l];return e||(e=o.status===n.ArProgress.FAILED),o.status===n.ArProgress.FAILED}),e&&k(I)},[O]),c.useEffect(()=>{D(F)},[F]),c.useEffect(()=>{B(a)},[a]),c.useEffect(()=>{h&&(D(!1),B(["image/jpeg","image/png","image/gif","image/svg+xml"]))},[h]);const G=e=>{const l=ue.convertToBytes(x);let o;try{o=p!==void 0&&(typeof p=="number"?p:parseInt(p))}catch{console.warn("Incorrect prop acceptedFileCount supplied, should be a numeric value")}if(typeof o=="number"&&e&&e.length+Object.keys(t||{}).length>o)k("Exceeded allowed number of files."),j({message:"You've selected more then allowed number of files",type:n.ArAlertType.WARNING,uid:C.v4()});else if(e.findIndex(f=>f.size>l)>-1){const f=`${v?"One or more files exceed ":"Selected file exceeds "}specified size limit of ${x}`;k(f),j({message:f,type:n.ArAlertType.WARNING,uid:C.v4()})}else e&&e.length>0&&(Q(e,u,v),q&&q(e))},Z=e=>{var o;k("");const l=Array.from((o=e.target||e.dataTransfer)==null?void 0:o.files);(!A||A(l,()=>G(l)))&&G(l)},y=t&&Object.keys(t).findIndex(e=>t[e].status===n.ArProgress.IN_PROGRESS)>-1,ee=!!(t&&Object.keys(t).length>0&&Object.keys(t).every(e=>{const l=t[e];return l.status===n.ArProgress.COMPLETED||l.status===n.ArProgress.FAILED})),S=t&&t[Object.keys(t)[0]],te=e=>{if(t&&S){const l=Object.keys(t).find(o=>o.startsWith(S.file.name));if(l){const o={...t[l]};o.imageProps=e,t[l]=o,$({...t})}}},se=e=>{if(t&&S){const l=Object.keys(t).find(o=>o.startsWith(S.file.name));if(l){const o=t[l];let f=M||R;if(f){const ae=process.env.NODE_ENV||"development";f=(f.startsWith("http")?"":xe.API_CONFIG.STATIC_HOST[ae])+f,de.put(f,o).then(ne=>{ne.status===200?j({message:"Image updaetd successfully!",type:n.ArAlertType.SUCCESS,uid:C.v4()}):j({message:"Failed to update image!",type:n.ArAlertType.ERROR,uid:C.v4()})})}else j({message:"Missing image update URL",type:n.ArAlertType.WARNING,uid:C.v4()})}}},H=s.jsxs("div",{className:`ar-Uploader__file-input flex-v-center${y?" disabled":""}${r!=="compact"&&!y&&!d?" cursor-pointer":""}${r==="large"?" flex-h-center flex-column p-3":" justify-content-between"}${r==="image-circle"?" border-radius-50":""}`,onClick:()=>{var e;return r!=="compact"&&!y&&!d&&((e=m.current)==null?void 0:e.click())},children:[h?s.jsx(P,{clearImage:E,demo:T,variant:r==="image-circle"?"circle":"rect",item:S,onChange:te,onCommit:se,size:J,uploadButtonText:w,uploadingButtonText:z}):s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:"ar-Uploader__file-input__prompt d-flex flex-column",children:[s.jsx("div",{className:`d-inline-flex ${r==="large"?" flex-center flex-column":"flex-v-center"}`,children:r==="compact"?s.jsxs(s.Fragment,{children:[s.jsx(W,{classes:y?"loading":"",content:y?z:w,preIcon:y?"ri.RiLoader5Fill":ee?N?"fa.FaExclamation":"fa.FaCheck":"md.MdOutlineFileUpload",onClick:()=>{var e;return(e=m.current)==null?void 0:e.click()},theme:K,disabled:d||y}),t&&Object.keys(t).length>0&&r==="compact"&&s.jsxs(s.Fragment,{children:[v?s.jsx("span",{className:"fw-bold flex-v-center ms-3",children:`(${Object.keys(t).length} file${Object.keys(t).length>1?"s":""})`}):s.jsx(fe,{classes:"fw-bold flex-v-center ms-3 text-decoration-underline",descriptor:{id:"temp-text-id",order:0,name:"Text",text:t[Object.keys(t)[0]].file.name,chunks:{}},overflowEllipsis:!0,overflowTooltip:!0}),s.jsx(_,{icon:"io5.IoClose",attributes:{colors:{fillColor:"red"},classes:`ms-2 ${d?"":"cursor-pointer"}`},events:{onClick:()=>{d&&(E(),m.current&&(m.current.value=""))}}})]})]}):s.jsxs(s.Fragment,{children:[s.jsx(_,{icon:"io5.IoFileTrayOutline",attributes:{colors:{fillColor:"#1677ff"},classes:r==="large"?"mb-2":"me-3",size:r==="large"?"3rem":"1rem"}}),s.jsx("span",{className:`ar-Uploader__upload-prompt-text${r==="large"?" h5 mb-0":""}`,children:"Click or drag files here to upload"})]})}),U&&s.jsx("small",{className:`ar-Uploader__upload-message text-decoration-underline ${r==="large"?"fw-bold f3 mt-2 mb-2":"mt-1"}`,children:U})]}),s.jsx("div",{className:"ar-Uploader__file-input__actions",children:r!=="compact"&&t&&Object.keys(t).length>0&&s.jsx(W,{containerClasses:`text-end${r==="large"?" mt-3":""}`,content:"Clear",variant:n.ArButtonVariants.DANGER,size:r==="regular"?n.ArSizes.XSMALL:n.ArSizes.SMALL,onClick:e=>{e.stopPropagation(),E(),m.current&&(m.current.value="")}})})]}),s.jsx("input",{className:"ar-Uploader__input d-none",type:"file",onChange:Z,ref:m,title:"file-uploader",accept:Array.isArray(L)?L.join(","):L,disabled:d,multiple:v})]}),re=N&&s.jsx("span",{className:"error my-1 small",children:N}),le=t&&r!=="compact"&&s.jsx("div",{className:"ar-Uploader__file-upload-progress mt-2",children:Object.entries(t).map(([e,l])=>b?b(l,()=>E(e)):s.jsx(he,{clear:()=>E(e),demo:!!T,disabled:!!d,result:l},e))});return s.jsxs("div",{className:`ar-Uploader d-flex flex-column${r?" "+r:""}${h?" flex-center":" w-100"}`,onDragOver:e=>e.preventDefault(),onDragLeave:e=>e.preventDefault(),children:[r!=="compact"?s.jsx(me,{dropHandler:e=>{m.current&&!d&&(m.current.files=e.dataTransfer.files,m.current.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0})))},acceptTypes:[ie.NativeTypes.FILE],hideHoverEffect:h||d,children:H}):H,!h&&re,!h&&le]})},(i,a)=>i.acceptedFileTypes===a.acceptedFileTypes&&i.acceptedFileCount===a.acceptedFileCount&&i.allowMultiple===a.allowMultiple&&i.disabled===a.disabled&&i.errorMessage===a.errorMessage&&i.endpoint===a.endpoint&&i.fileSizeLimit===a.fileSizeLimit&&JSON.stringify(i.files)===JSON.stringify(a.files)&&i.message===a.message&&i.avatarSize===a.avatarSize&&i.variant===a.variant&&i.theme===a.theme&&i.uploadSequential===a.uploadSequential&&i.uploadButtonText===a.uploadButtonText&&i.uploadingButtonText===a.uploadingButtonText);module.exports=ye;
+(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".ar-Uploader .ar-Uploader__file-uploader-progress-bar{transition:max-height .3s,opacity .3s,padding .3s,margin-bottom .3s,background-color .3s;opacity:0;max-height:0}.ar-Uploader .ar-Uploader__file-uploader-progress-bar.show{opacity:1;max-height:4rem}.ar-Uploader .ar-Uploader__file-uploader-progress-bar:hover{background-color:var(--ar-bg-hover-6)}.ar-Uploader .ar-Button.loading .pre{animation:rotating .5s linear infinite}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{transition:border .3s ease-in-out}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input:has(.ar-Avatar.FAILED){border-color:var(--ar-color-danger-soft)}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{border:1px dashed lightgrey;border-radius:.5rem;padding:.5rem;background-color:var(--ar-bg-base)}.ar-Uploader .ar-Uploader__upload-prompt-text{color:var(--ar-color-obscure-4)}.ar-Uploader .ar-Uploader__upload-message{color:var(--ar-color-obscure-2)}")),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
+"use strict";const t=require("react/jsx-runtime"),c=require("react"),S=require("uuid"),oe=require("react-dnd-html5-backend"),ce=require("@armco/configs/endpoints"),C=require("@armco/utils"),ue=require("@armco/utils/hooks"),de=require("@armco/utils/network"),o=require("@armco/shared-components/enums"),me=require("@armco/shared-components/Droppable"),P=require("@armco/shared-components/Button"),fe=require("@armco/shared-components/Text"),pe=require("@armco/shared-components/ProgressIndicator"),ge=require("@armco/shared-components/Tooltip"),V=require("@armco/shared-components/Avatar"),q=require("@armco/icon"),xe=require("./utils.js"),he=require("./useUpload.js"),ye=({clear:a,demo:n,disabled:p,result:u})=>{const[F,y]=c.useState(),[T,d]=c.useState();c.useEffect(()=>{d(!0)},[]);const A=u.type==="image",I=t.jsx(pe,{label:u.file.name,preIcon:A?"":"im.ImAttachment",progress:u.progress,slot:o.ArPopoverSlots.ANCHOR,rightEndContent:(F||u.status===o.ArProgress.FAILED)&&t.jsx(q,{icon:"ri.RiDeleteBin6Fill",attributes:{colors:{fillColor:u.status===o.ArProgress.FAILED?"#ff4d4f":"grey"},classes:p?"":"cursor-pointer"},events:{onClick:()=>{p||(d(!1),setTimeout(a,300))}}}),status:u.status,thumbnailRenderer:()=>A?t.jsx(V,{classes:"me-3",item:u,size:o.ArSizes.XSMALL,variant:"circle",viewOnly:!0}):null}),R=g=>typeof g=="string"?g:g.error||g.message||"Server Error";return t.jsx("div",{className:`ar-Uploader__file-uploader-progress-bar position-relative ${T?" show p-1 border-radius l1 mb-1 cursor-pointer":" px-1"} ${u.status}`,onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),children:u.status===o.ArProgress.FAILED?t.jsxs(ge,{demo:n,children:[I,t.jsx("span",{slot:o.ArPopoverSlots.POPOVER,children:R(u.error)})]}):I})},Ae=c.memo(a=>{const{acceptedFileTypes:n,acceptedFileCount:p,afterUpload:u,allowMultiple:F,beforeUpload:y,demo:T,disabled:d,uploadEntryRenderer:A,errorMessage:I="Failed to upload",endpoint:R,fileSizeLimit:g="5mb",files:k,handler:J,message:U,onFileSelected:M,avatarSize:K=o.ArSizes.REGULAR,variant:r="compact",theme:X,updateEndpoint:w,uploadSequential:Y,uploadButtonText:$="Upload",uploadingButtonText:z="Uploading..."}=a,m=c.useRef(null),{notify:b}=ue.useNotification(),[e,D]=c.useState(),[j,B]=c.useState(),[N,G]=c.useState(),[_,O]=c.useState(),Q=c.useMemo(()=>j?p!==void 0?k?.slice(0,p):k:k?.slice(0,1),[k]),{clear:v,upload:Z,results:L}=he(R||J||"",Y,Q),x=r==="image-circle"||r==="image-rect";c.useEffect(()=>{D(L),(!L||Object.keys(L).length===0)&&m.current&&(m.current.value="");let s;e&&Object.keys(e).length>0&&Object.keys(e).every(l=>{const i=e[l];return s||=i.status===o.ArProgress.FAILED,i.status===o.ArProgress.FAILED}),s&&O(I)},[L]),c.useEffect(()=>{B(F)},[F]),c.useEffect(()=>{G(n)},[n]),c.useEffect(()=>{x&&(B(!1),G(["image/jpeg","image/png","image/gif","image/svg+xml"]))},[x]);const H=s=>{const l=xe.convertToBytes(g);let i;try{i=p!==void 0&&(typeof p=="number"?p:parseInt(p))}catch{console.warn("Incorrect prop acceptedFileCount supplied, should be a numeric value")}if(typeof i=="number"&&s&&s.length+Object.keys(e||{}).length>i)O("Exceeded allowed number of files."),b({message:"You've selected more then allowed number of files",type:C.ArAlertType.WARNING,uid:S.v4()});else if(s.findIndex(f=>f.size>l)>-1){const f=`${j?"One or more files exceed ":"Selected file exceeds "}specified size limit of ${g}`;O(f),b({message:f,type:C.ArAlertType.WARNING,uid:S.v4()})}else s&&s.length>0&&(Z(s,u,j),M&&M(s))},ee=s=>{O("");const l=Array.from((s.target||s.dataTransfer)?.files);(!y||y(l,()=>H(l)))&&H(l)},h=e&&Object.keys(e).findIndex(s=>e[s].status===o.ArProgress.IN_PROGRESS)>-1,te=!!(e&&Object.keys(e).length>0&&Object.keys(e).every(s=>{const l=e[s];return l.status===o.ArProgress.COMPLETED||l.status===o.ArProgress.FAILED})),E=e&&e[Object.keys(e)[0]],se=s=>{if(e&&E){const l=Object.keys(e).find(i=>i.startsWith(E.file.name));if(l){const i={...e[l]};i.imageProps=s,e[l]=i,D({...e})}}},re=s=>{if(e&&E){const l=Object.keys(e).find(i=>i.startsWith(E.file.name));if(l){const i=e[l];let f=w||R;if(f){const ae=process.env.NODE_ENV||"development";f=(f.startsWith("http")?"":ce.API_CONFIG.STATIC_HOST[ae])+f,de.put(f,i).then(ie=>{ie.status===200?b({message:"Image updaetd successfully!",type:C.ArAlertType.SUCCESS,uid:S.v4()}):b({message:"Failed to update image!",type:C.ArAlertType.ERROR,uid:S.v4()})})}else b({message:"Missing image update URL",type:C.ArAlertType.WARNING,uid:S.v4()})}}},W=t.jsxs("div",{className:`ar-Uploader__file-input flex-v-center${h?" disabled":""}${r!=="compact"&&!h&&!d?" cursor-pointer":""}${r==="large"?" flex-h-center flex-column p-3":" justify-content-between"}${r==="image-circle"?" border-radius-50":""}`,onClick:()=>r!=="compact"&&!h&&!d&&m.current?.click(),children:[x?t.jsx(V,{clearImage:v,demo:T,variant:r==="image-circle"?"circle":"rect",item:E,onChange:se,onCommit:re,size:K,uploadButtonText:$,uploadingButtonText:z}):t.jsxs(t.Fragment,{children:[t.jsxs("div",{className:"ar-Uploader__file-input__prompt d-flex flex-column",children:[t.jsx("div",{className:`d-inline-flex ${r==="large"?" flex-center flex-column":"flex-v-center"}`,children:r==="compact"?t.jsxs(t.Fragment,{children:[t.jsx(P,{classes:h?"loading":"",content:h?z:$,preIcon:h?"ri.RiLoader5Fill":te?_?"fa.FaExclamation":"fa.FaCheck":"md.MdOutlineFileUpload",onClick:()=>m.current?.click(),theme:X,disabled:d||h}),e&&Object.keys(e).length>0&&r==="compact"&&t.jsxs(t.Fragment,{children:[j?t.jsx("span",{className:"fw-bold flex-v-center ms-3",children:`(${Object.keys(e).length} file${Object.keys(e).length>1?"s":""})`}):t.jsx(fe,{classes:"fw-bold flex-v-center ms-3 text-decoration-underline",descriptor:{id:"temp-text-id",order:0,name:"Text",text:e[Object.keys(e)[0]].file.name,chunks:{}},overflowEllipsis:!0,overflowTooltip:!0}),t.jsx(q,{icon:"io5.IoClose",attributes:{colors:{fillColor:"red"},classes:`ms-2 ${d?"":"cursor-pointer"}`},events:{onClick:()=>{d&&(v(),m.current&&(m.current.value=""))}}})]})]}):t.jsxs(t.Fragment,{children:[t.jsx(q,{icon:"io5.IoFileTrayOutline",attributes:{colors:{fillColor:"#1677ff"},classes:r==="large"?"mb-2":"me-3",size:r==="large"?"3rem":"1rem"}}),t.jsx("span",{className:`ar-Uploader__upload-prompt-text${r==="large"?" h5 mb-0":""}`,children:"Click or drag files here to upload"})]})}),U&&t.jsx("small",{className:`ar-Uploader__upload-message text-decoration-underline ${r==="large"?"fw-bold f3 mt-2 mb-2":"mt-1"}`,children:U})]}),t.jsx("div",{className:"ar-Uploader__file-input__actions",children:r!=="compact"&&e&&Object.keys(e).length>0&&t.jsx(P,{containerClasses:`text-end${r==="large"?" mt-3":""}`,content:"Clear",variant:o.ArButtonVariants.DANGER,size:r==="regular"?o.ArSizes.XSMALL:o.ArSizes.SMALL,onClick:s=>{s.stopPropagation(),v(),m.current&&(m.current.value="")}})})]}),t.jsx("input",{className:"ar-Uploader__input d-none",type:"file",onChange:ee,ref:m,title:"file-uploader",accept:Array.isArray(N)?N.join(","):N,disabled:d,multiple:j})]}),le=_&&t.jsx("span",{className:"error my-1 small",children:_}),ne=e&&r!=="compact"&&t.jsx("div",{className:"ar-Uploader__file-upload-progress mt-2",children:Object.entries(e).map(([s,l])=>A?A(l,()=>v(s)):t.jsx(ye,{clear:()=>v(s),demo:!!T,disabled:!!d,result:l},s))});return t.jsxs("div",{className:`ar-Uploader d-flex flex-column${r?" "+r:""}${x?" flex-center":" w-100"}`,onDragOver:s=>s.preventDefault(),onDragLeave:s=>s.preventDefault(),children:[r!=="compact"?t.jsx(me,{dropHandler:s=>{m.current&&!d&&(m.current.files=s.dataTransfer.files,m.current.dispatchEvent(new Event("change",{bubbles:!0,cancelable:!0})))},acceptTypes:[oe.NativeTypes.FILE],hideHoverEffect:x||d,children:W}):W,!x&&le,!x&&ne]})},(a,n)=>a.acceptedFileTypes===n.acceptedFileTypes&&a.acceptedFileCount===n.acceptedFileCount&&a.allowMultiple===n.allowMultiple&&a.disabled===n.disabled&&a.errorMessage===n.errorMessage&&a.endpoint===n.endpoint&&a.fileSizeLimit===n.fileSizeLimit&&JSON.stringify(a.files)===JSON.stringify(n.files)&&a.message===n.message&&a.avatarSize===n.avatarSize&&a.variant===n.variant&&a.theme===n.theme&&a.uploadSequential===n.uploadSequential&&a.uploadButtonText===n.uploadButtonText&&a.uploadingButtonText===n.uploadingButtonText);module.exports=Ae;

package/cjs/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./useUpload.js"),u=require("./Uploader.js");exports.useUpload=e;exports.default=u;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./useUpload.js"),r=require("./Uploader.js"),e=require("./utils.js");exports.useUpload=t;exports.default=r;exports.convertToBytes=e.convertToBytes;exports.generateFileKey=e.generateFileKey;exports.isImage=e.isImage;

package/cjs/useUpload.js

@@ -1 +1 @@
-"use strict";const f=require("react"),E=require("@armco/types"),g=require("@armco/utils/helper"),P=require("@armco/utils/network"),S={status:E.ArProgress.COMPLETED,progress:100},d={status:E.ArProgress.FAILED,progress:0},A=(i,p,h)=>{const[l,o]=f.useState(),u=f.useRef({}),c=f.useRef({});f.useEffect(()=>{if(h){const e={};h==null||h.forEach(s=>{e[g.generateFileKey(s)]={...s,progress:100,status:E.ArProgress.COMPLETED,file:typeof s=="object"?s:{name:s.name}}}),o(e)}},[h]),f.useEffect(()=>{const e=c.current;return()=>{Object.keys(e).forEach(s=>clearInterval(e[s]))}},[c]);const v=e=>{if(e){const s={...l};delete s[e],o(s),u.current[e]=!0,clearInterval(c.current[e])}else o(void 0),l&&Object.keys(l).forEach(s=>l[s].status===E.ArProgress.IN_PROGRESS&&(u.current[s]=!0)),Object.keys(c.current).forEach(s=>clearInterval(c.current[s]))},R=async e=>{const y=typeof i=="function"?i:null,r=g.generateFileKey(e);return c.current[r]=setInterval(()=>{o(n=>{const t=n&&n[r];if(!t||t.progress>=95)return c.current&&clearInterval(c.current[r]),n;const a=Math.floor(Math.random()*8)+5;return{...n,[r]:{...t,progress:t.progress+a}}})},500),y?await y(e).then(n=>{u.current[r]||(n.ok||o(t=>({...t,[r]:{file:e,...d}})),o(t=>({...t,[r]:{file:e,...S}})))}).catch(()=>{u.current[r]||o(n=>({...n,[r]:{file:e,...d}}))}).finally(()=>{c.current&&clearInterval(c.current[r])}):await P.upload(i,e).then(n=>{if(u.current[r])delete u.current[r],delete c.current[r];else{if(!n.body){o(a=>({...a,[r]:{file:e,...d,error:n.body,httpStatus:n.status}}));return}const t=n.body.saved[0];o(a=>({...a,[r]:{...t||{},file:e,...S}}))}}).catch(n=>{u.current[r]?(delete u.current[r],delete c.current[r]):o(t=>({...t,[r]:{file:e,...d,error:n}}))}).finally(()=>{c.current&&clearInterval(c.current[r])})};return{clear:v,upload:async(e,s,y)=>{const r={};e.forEach(t=>{const a=g.generateFileKey(t);r[a]={file:t,status:E.ArProgress.IN_PROGRESS,progress:p?1:Math.floor(Math.random()*10)}}),o(y?{...l,...r}:r);let n=[];for(const t of e)p?n.push(await R(t)):n.push(R(t));await Promise.allSettled(n).then(t=>s&&s(t))},results:l}};module.exports=A;
+"use strict";const f=require("react"),i=require("@armco/shared-components/enums"),P=require("@armco/utils/network"),g=require("./utils.js"),S={status:i.ArProgress.COMPLETED,progress:100},E={status:i.ArProgress.FAILED,progress:0},m=(d,p,y)=>{const[l,o]=f.useState(),u=f.useRef({}),c=f.useRef({});f.useEffect(()=>{if(y){const e={};y?.forEach(s=>{e[g.generateFileKey(s)]={...s,progress:100,status:i.ArProgress.COMPLETED,file:typeof s=="object"?s:{name:s.name}}}),o(e)}},[y]),f.useEffect(()=>{const e=c.current;return()=>{Object.keys(e).forEach(s=>clearInterval(e[s]))}},[c]);const v=e=>{if(e){const s={...l};delete s[e],o(s),u.current[e]=!0,clearInterval(c.current[e])}else o(void 0),l&&Object.keys(l).forEach(s=>l[s].status===i.ArProgress.IN_PROGRESS&&(u.current[s]=!0)),Object.keys(c.current).forEach(s=>clearInterval(c.current[s]))},R=async e=>{const h=typeof d=="function"?d:null,r=g.generateFileKey(e);return c.current[r]=setInterval(()=>{o(n=>{const t=n&&n[r];if(!t||t.progress>=95)return c.current&&clearInterval(c.current[r]),n;const a=Math.floor(Math.random()*8)+5;return{...n,[r]:{...t,progress:t.progress+a}}})},500),h?await h(e).then(n=>{u.current[r]||(n.ok||o(t=>({...t,[r]:{file:e,...E}})),o(t=>({...t,[r]:{file:e,...S}})))}).catch(()=>{u.current[r]||o(n=>({...n,[r]:{file:e,...E}}))}).finally(()=>{c.current&&clearInterval(c.current[r])}):await P.upload(d,e).then(n=>{if(u.current[r])delete u.current[r],delete c.current[r];else{if(!n.body){o(a=>({...a,[r]:{file:e,...E,error:n.body,httpStatus:n.status}}));return}const t=n.body.saved[0];o(a=>({...a,[r]:{...t||{},file:e,...S}}))}}).catch(n=>{u.current[r]?(delete u.current[r],delete c.current[r]):o(t=>({...t,[r]:{file:e,...E,error:n}}))}).finally(()=>{c.current&&clearInterval(c.current[r])})};return{clear:v,upload:async(e,s,h)=>{const r={};e.forEach(t=>{const a=g.generateFileKey(t);r[a]={file:t,status:i.ArProgress.IN_PROGRESS,progress:p?1:Math.floor(Math.random()*10)}}),o(h?{...l,...r}:r);let n=[];for(const t of e)p?n.push(await R(t)):n.push(R(t));await Promise.allSettled(n).then(t=>s&&s(t))},results:l}};module.exports=m;

package/cjs/utils.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=["image/jpeg","image/png","image/gif","image/webp","image/svg+xml","image/tiff","image/bmp","image/x-icon"];function i(e){return"size"in e?`${e.name}_${e.size}_${e.type}_${e.lastModified}`:e.name+"-preexisting-"+Date.now()}function s(e){const t=e.trim().toLowerCase();try{return t.endsWith("kb")?parseFloat(t.slice(0,-2))*1024:t.endsWith("mb")?parseFloat(t.slice(0,-2))*1024*1024:t.endsWith("bytes")?parseFloat(t.slice(0,-5)):isNaN(parseFloat(t))?-1:parseFloat(t)}catch{return-1}}function a(e){return!!e&&r.indexOf(e)>-1}exports.convertToBytes=s;exports.generateFileKey=i;exports.isImage=a;

package/es/Uploader.js

@@ -1,57 +1,58 @@
-(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".ar-Uploader .ar-Uploader__file-uploader-progress-bar{transition:max-height .3s,opacity .3s,padding .3s,margin-bottom .3s,background-color .3s;opacity:0;max-height:0}.ar-Uploader .ar-Uploader__file-uploader-progress-bar.show{opacity:1;max-height:4rem}.ar-Uploader .ar-Uploader__file-uploader-progress-bar:hover{background-color:var(--ar-bg-hover-6)}.ar-Uploader .ar-Button.loading .pre{animation:rotating .5s linear infinite}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{transition:border .3s ease-in-out;border:1px dashed lightgrey;border-radius:.5rem;padding:.5rem;background-color:var(--ar-bg-base)}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input:has(.ar-Avatar.FAILED){border-color:var(--ar-color-danger-soft)}.ar-Uploader .ar-Uploader__upload-prompt-text{color:var(--ar-color-obscure-4)}.ar-Uploader .ar-Uploader__upload-message{color:var(--ar-color-obscure-2)}")),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-import { jsxs as p, jsx as r, Fragment as M } from "react/jsx-runtime";
-import { memo as me, useRef as ue, useState as x, useMemo as fe, useEffect as L } from "react";
-import { v4 as O } from "uuid";
+(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".ar-Uploader .ar-Uploader__file-uploader-progress-bar{transition:max-height .3s,opacity .3s,padding .3s,margin-bottom .3s,background-color .3s;opacity:0;max-height:0}.ar-Uploader .ar-Uploader__file-uploader-progress-bar.show{opacity:1;max-height:4rem}.ar-Uploader .ar-Uploader__file-uploader-progress-bar:hover{background-color:var(--ar-bg-hover-6)}.ar-Uploader .ar-Button.loading .pre{animation:rotating .5s linear infinite}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{transition:border .3s ease-in-out}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input:has(.ar-Avatar.FAILED){border-color:var(--ar-color-danger-soft)}.ar-Uploader:not(.compact):not(.image-rect):not(.image-circle) .ar-Uploader__file-input{border:1px dashed lightgrey;border-radius:.5rem;padding:.5rem;background-color:var(--ar-bg-base)}.ar-Uploader .ar-Uploader__upload-prompt-text{color:var(--ar-color-obscure-4)}.ar-Uploader .ar-Uploader__upload-message{color:var(--ar-color-obscure-2)}")),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
+import { jsxs as f, jsx as a, Fragment as M } from "react/jsx-runtime";
+import { memo as me, useRef as ue, useState as b, useMemo as fe, useEffect as R } from "react";
+import { v4 as F } from "uuid";
 import { NativeTypes as pe } from "react-dnd-html5-backend";
-import { ArSizes as j, ArProgress as g, ArButtonVariants as ge, ArAlertType as R, ArPopoverSlots as Y } from "@armco/types";
-import he from "./useUpload.js";
-import { useNotification as ye } from "@armco/utils/hooks";
-import { convertToBytes as be } from "@armco/utils/helper";
-import { put as xe } from "@armco/utils/network";
-import ve from "@armco/shared-components/Droppable";
+import { API_CONFIG as ge } from "@armco/configs/endpoints";
+import { ArAlertType as O } from "@armco/utils";
+import { useNotification as he } from "@armco/utils/hooks";
+import { put as ye } from "@armco/utils/network";
+import { ArSizes as j, ArProgress as p, ArButtonVariants as be, ArPopoverSlots as Y } from "@armco/shared-components/enums";
+import xe from "@armco/shared-components/Droppable";
 import Q from "@armco/shared-components/Button";
-import Ce from "@armco/shared-components/Text";
-import Ae from "@armco/shared-components/ProgressIndicator";
-import Ee from "@armco/shared-components/Tooltip";
-import { API_CONFIG as Ie } from "@armco/configs/endpoints";
-import Z from "@armco/avatar";
+import ve from "@armco/shared-components/Text";
+import Ce from "@armco/shared-components/ProgressIndicator";
+import Ae from "@armco/shared-components/Tooltip";
+import Z from "@armco/shared-components/Avatar";
 import D from "@armco/icon";
+import { convertToBytes as Ee } from "./utils.js";
+import Ie from "./useUpload.js";
 const Fe = ({
-  clear: n,
+  clear: i,
   demo: o,
   disabled: u,
   result: s
 }) => {
-  const [S, v] = x(), [T, c] = x();
-  L(() => {
+  const [L, x] = b(), [S, c] = b();
+  R(() => {
     c(!0);
   }, []);
-  const C = s.type === "image", k = /* @__PURE__ */ r(
-    Ae,
+  const v = s.type === "image", T = /* @__PURE__ */ a(
+    Ce,
     {
       label: s.file.name,
-      preIcon: C ? "" : "im.ImAttachment",
+      preIcon: v ? "" : "im.ImAttachment",
       progress: s.progress,
       slot: Y.ANCHOR,
-      rightEndContent: (S || s.status === g.FAILED) && /* @__PURE__ */ r(
+      rightEndContent: (L || s.status === p.FAILED) && /* @__PURE__ */ a(
         D,
         {
           icon: "ri.RiDeleteBin6Fill",
           attributes: {
             colors: {
-              fillColor: s.status === g.FAILED ? "#ff4d4f" : "grey"
+              fillColor: s.status === p.FAILED ? "#ff4d4f" : "grey"
             },
             classes: u ? "" : "cursor-pointer"
           },
           events: {
             onClick: () => {
-              u || (c(!1), setTimeout(n, 300));
+              u || (c(!1), setTimeout(i, 300));
             }
           }
         }
       ),
       status: s.status,
-      thumbnailRenderer: () => C ? /* @__PURE__ */ r(
+      thumbnailRenderer: () => v ? /* @__PURE__ */ a(
         Z,
         {
           classes: "me-3",
@@ -62,34 +63,34 @@ const Fe = ({
         }
       ) : null
     }
-  ), N = (h) => typeof h == "string" ? h : h.error || h.message || "Server Error";
-  return /* @__PURE__ */ r(
+  ), k = (g) => typeof g == "string" ? g : g.error || g.message || "Server Error";
+  return /* @__PURE__ */ a(
     "div",
     {
-      className: `ar-Uploader__file-uploader-progress-bar position-relative ${T ? " show p-1 border-radius l1 mb-1 cursor-pointer" : " px-1"} ${s.status}`,
-      onMouseEnter: () => v(!0),
-      onMouseLeave: () => v(!1),
-      children: s.status === g.FAILED ? /* @__PURE__ */ p(Ee, { demo: o, children: [
-        k,
-        /* @__PURE__ */ r("span", { slot: Y.POPOVER, children: N(s.error) })
-      ] }) : k
+      className: `ar-Uploader__file-uploader-progress-bar position-relative ${S ? " show p-1 border-radius l1 mb-1 cursor-pointer" : " px-1"} ${s.status}`,
+      onMouseEnter: () => x(!0),
+      onMouseLeave: () => x(!1),
+      children: s.status === p.FAILED ? /* @__PURE__ */ f(Ae, { demo: o, children: [
+        T,
+        /* @__PURE__ */ a("span", { slot: Y.POPOVER, children: k(s.error) })
+      ] }) : T
     }
   );
-}, Je = me(
-  (n) => {
+}, Ke = me(
+  (i) => {
     const {
       acceptedFileTypes: o,
       acceptedFileCount: u,
       afterUpload: s,
-      allowMultiple: S,
-      beforeUpload: v,
-      demo: T,
+      allowMultiple: L,
+      beforeUpload: x,
+      demo: S,
       disabled: c,
-      uploadEntryRenderer: C,
-      errorMessage: k = "Failed to upload",
-      endpoint: N,
-      fileSizeLimit: h = "5mb",
-      files: f,
+      uploadEntryRenderer: v,
+      errorMessage: T = "Failed to upload",
+      endpoint: k,
+      fileSizeLimit: g = "5mb",
+      files: N,
       handler: P,
       message: z,
       onFileSelected: B,
@@ -100,120 +101,116 @@ const Fe = ({
       uploadSequential: le,
       uploadButtonText: W = "Upload",
       uploadingButtonText: H = "Uploading..."
-    } = n, d = ue(null), { notify: A } = ye(), [t, q] = x(), [E, V] = x(), [w, J] = x(), [$, _] = x(), ae = fe(
-      () => E ? u !== void 0 ? f == null ? void 0 : f.slice(0, u) : f : f == null ? void 0 : f.slice(0, 1),
-      [f]
-    ), { clear: I, upload: re, results: U } = he(
-      N || P || "",
+    } = i, d = ue(null), { notify: C } = he(), [e, q] = b(), [A, V] = b(), [w, J] = b(), [$, _] = b(), re = fe(
+      () => A ? u !== void 0 ? N?.slice(0, u) : N : N?.slice(0, 1),
+      [N]
+    ), { clear: E, upload: ae, results: U } = Ie(
+      k || P || "",
       le,
-      ae
-    ), y = l === "image-circle" || l === "image-rect";
-    L(() => {
+      re
+    ), h = l === "image-circle" || l === "image-rect";
+    R(() => {
       q(U), (!U || Object.keys(U).length === 0) && d.current && (d.current.value = "");
-      let e;
-      t && Object.keys(t).length > 0 && Object.keys(t).every((a) => {
-        const i = t[a];
-        return e || (e = i.status === g.FAILED), i.status === g.FAILED;
-      }), e && _(k);
-    }, [U]), L(() => {
-      V(S);
-    }, [S]), L(() => {
+      let t;
+      e && Object.keys(e).length > 0 && Object.keys(e).every((r) => {
+        const n = e[r];
+        return t ||= n.status === p.FAILED, n.status === p.FAILED;
+      }), t && _(T);
+    }, [U]), R(() => {
+      V(L);
+    }, [L]), R(() => {
       J(o);
-    }, [o]), L(() => {
-      y && (V(!1), J([
+    }, [o]), R(() => {
+      h && (V(!1), J([
         "image/jpeg",
         "image/png",
         "image/gif",
         "image/svg+xml"
       ]));
-    }, [y]);
-    const K = (e) => {
-      const a = be(h);
-      let i;
+    }, [h]);
+    const K = (t) => {
+      const r = Ee(g);
+      let n;
       try {
-        i = u !== void 0 && (typeof u == "number" ? u : parseInt(u));
+        n = u !== void 0 && (typeof u == "number" ? u : parseInt(u));
       } catch {
         console.warn(
           "Incorrect prop acceptedFileCount supplied, should be a numeric value"
         );
       }
-      if (typeof i == "number" && e && e.length + Object.keys(t || {}).length > i)
-        _("Exceeded allowed number of files."), A({
+      if (typeof n == "number" && t && t.length + Object.keys(e || {}).length > n)
+        _("Exceeded allowed number of files."), C({
           message: "You've selected more then allowed number of files",
-          type: R.WARNING,
-          uid: O()
+          type: O.WARNING,
+          uid: F()
         });
-      else if (e.findIndex((m) => m.size > a) > -1) {
-        const m = `${E ? "One or more files exceed " : "Selected file exceeds "}specified size limit of ${h}`;
-        _(m), A({
+      else if (t.findIndex((m) => m.size > r) > -1) {
+        const m = `${A ? "One or more files exceed " : "Selected file exceeds "}specified size limit of ${g}`;
+        _(m), C({
           message: m,
-          type: R.WARNING,
-          uid: O()
+          type: O.WARNING,
+          uid: F()
         });
-      } else e && e.length > 0 && (re(e, s, E), B && B(e));
-    }, oe = (e) => {
-      var i;
+      } else t && t.length > 0 && (ae(t, s, A), B && B(t));
+    }, oe = (t) => {
       _("");
-      const a = Array.from(
-        (i = e.target || e.dataTransfer) == null ? void 0 : i.files
+      const r = Array.from(
+        (t.target || t.dataTransfer)?.files
       );
-      (!v || v(a, () => K(a))) && K(a);
-    }, b = t && Object.keys(t).findIndex((e) => t[e].status === g.IN_PROGRESS) > -1, ne = !!(t && Object.keys(t).length > 0 && Object.keys(t).every((e) => {
-      const a = t[e];
-      return a.status === g.COMPLETED || a.status === g.FAILED;
-    })), F = t && t[Object.keys(t)[0]], X = /* @__PURE__ */ p(
+      (!x || x(r, () => K(r))) && K(r);
+    }, y = e && Object.keys(e).findIndex((t) => e[t].status === p.IN_PROGRESS) > -1, ie = !!(e && Object.keys(e).length > 0 && Object.keys(e).every((t) => {
+      const r = e[t];
+      return r.status === p.COMPLETED || r.status === p.FAILED;
+    })), I = e && e[Object.keys(e)[0]], X = /* @__PURE__ */ f(
       "div",
       {
-        className: `ar-Uploader__file-input flex-v-center${b ? " disabled" : ""}${l !== "compact" && !b && !c ? " cursor-pointer" : ""}${l === "large" ? " flex-h-center flex-column p-3" : " justify-content-between"}${l === "image-circle" ? " border-radius-50" : ""}`,
-        onClick: () => {
-          var e;
-          return l !== "compact" && !b && !c && ((e = d.current) == null ? void 0 : e.click());
-        },
+        className: `ar-Uploader__file-input flex-v-center${y ? " disabled" : ""}${l !== "compact" && !y && !c ? " cursor-pointer" : ""}${l === "large" ? " flex-h-center flex-column p-3" : " justify-content-between"}${l === "image-circle" ? " border-radius-50" : ""}`,
+        onClick: () => l !== "compact" && !y && !c && d.current?.click(),
         children: [
-          y ? /* @__PURE__ */ r(
+          h ? /* @__PURE__ */ a(
             Z,
             {
-              clearImage: I,
-              demo: T,
+              clearImage: E,
+              demo: S,
               variant: l === "image-circle" ? "circle" : "rect",
-              item: F,
-              onChange: (e) => {
-                if (t && F) {
-                  const a = Object.keys(t).find(
-                    (i) => i.startsWith(F.file.name)
+              item: I,
+              onChange: (t) => {
+                if (e && I) {
+                  const r = Object.keys(e).find(
+                    (n) => n.startsWith(I.file.name)
                   );
-                  if (a) {
-                    const i = { ...t[a] };
-                    i.imageProps = e, t[a] = i, q({ ...t });
+                  if (r) {
+                    const n = { ...e[r] };
+                    n.imageProps = t, e[r] = n, q({ ...e });
                   }
                 }
               },
-              onCommit: (e) => {
-                if (t && F) {
-                  const a = Object.keys(t).find(
-                    (i) => i.startsWith(F.file.name)
+              onCommit: (t) => {
+                if (e && I) {
+                  const r = Object.keys(e).find(
+                    (n) => n.startsWith(I.file.name)
                   );
-                  if (a) {
-                    const i = t[a];
-                    let m = G || N;
+                  if (r) {
+                    const n = e[r];
+                    let m = G || k;
                     if (m) {
                       const ce = process.env.NODE_ENV || "development";
-                      m = (m.startsWith("http") ? "" : Ie.STATIC_HOST[ce]) + m, xe(m, i).then((de) => {
-                        de.status === 200 ? A({
+                      m = (m.startsWith("http") ? "" : ge.STATIC_HOST[ce]) + m, ye(m, n).then((de) => {
+                        de.status === 200 ? C({
                           message: "Image updaetd successfully!",
-                          type: R.SUCCESS,
-                          uid: O()
-                        }) : A({
+                          type: O.SUCCESS,
+                          uid: F()
+                        }) : C({
                           message: "Failed to update image!",
-                          type: R.ERROR,
-                          uid: O()
+                          type: O.ERROR,
+                          uid: F()
                         });
                       });
                     } else
-                      A({
+                      C({
                         message: "Missing image update URL",
-                        type: R.WARNING,
-                        uid: O()
+                        type: O.WARNING,
+                        uid: F()
                       });
                   }
                 }
@@ -222,44 +219,41 @@ const Fe = ({
               uploadButtonText: W,
               uploadingButtonText: H
             }
-          ) : /* @__PURE__ */ p(M, { children: [
-            /* @__PURE__ */ p("div", { className: "ar-Uploader__file-input__prompt d-flex flex-column", children: [
-              /* @__PURE__ */ r(
+          ) : /* @__PURE__ */ f(M, { children: [
+            /* @__PURE__ */ f("div", { className: "ar-Uploader__file-input__prompt d-flex flex-column", children: [
+              /* @__PURE__ */ a(
                 "div",
                 {
                   className: `d-inline-flex ${l === "large" ? " flex-center flex-column" : "flex-v-center"}`,
-                  children: l === "compact" ? /* @__PURE__ */ p(M, { children: [
-                    /* @__PURE__ */ r(
+                  children: l === "compact" ? /* @__PURE__ */ f(M, { children: [
+                    /* @__PURE__ */ a(
                       Q,
                       {
-                        classes: b ? "loading" : "",
-                        content: b ? H : W,
-                        preIcon: b ? "ri.RiLoader5Fill" : ne ? $ ? "fa.FaExclamation" : "fa.FaCheck" : "md.MdOutlineFileUpload",
-                        onClick: () => {
-                          var e;
-                          return (e = d.current) == null ? void 0 : e.click();
-                        },
+                        classes: y ? "loading" : "",
+                        content: y ? H : W,
+                        preIcon: y ? "ri.RiLoader5Fill" : ie ? $ ? "fa.FaExclamation" : "fa.FaCheck" : "md.MdOutlineFileUpload",
+                        onClick: () => d.current?.click(),
                         theme: te,
-                        disabled: c || b
+                        disabled: c || y
                       }
                     ),
-                    t && Object.keys(t).length > 0 && l === "compact" && /* @__PURE__ */ p(M, { children: [
-                      E ? /* @__PURE__ */ r("span", { className: "fw-bold flex-v-center ms-3", children: `(${Object.keys(t).length} file${Object.keys(t).length > 1 ? "s" : ""})` }) : /* @__PURE__ */ r(
-                        Ce,
+                    e && Object.keys(e).length > 0 && l === "compact" && /* @__PURE__ */ f(M, { children: [
+                      A ? /* @__PURE__ */ a("span", { className: "fw-bold flex-v-center ms-3", children: `(${Object.keys(e).length} file${Object.keys(e).length > 1 ? "s" : ""})` }) : /* @__PURE__ */ a(
+                        ve,
                         {
                           classes: "fw-bold flex-v-center ms-3 text-decoration-underline",
                           descriptor: {
                             id: "temp-text-id",
                             order: 0,
                             name: "Text",
-                            text: t[Object.keys(t)[0]].file.name,
+                            text: e[Object.keys(e)[0]].file.name,
                             chunks: {}
                           },
                           overflowEllipsis: !0,
                           overflowTooltip: !0
                         }
                       ),
-                      /* @__PURE__ */ r(
+                      /* @__PURE__ */ a(
                         D,
                         {
                           icon: "io5.IoClose",
@@ -271,14 +265,14 @@ const Fe = ({
                           },
                           events: {
                             onClick: () => {
-                              c && (I(), d.current && (d.current.value = ""));
+                              c && (E(), d.current && (d.current.value = ""));
                             }
                           }
                         }
                       )
                     ] })
-                  ] }) : /* @__PURE__ */ p(M, { children: [
-                    /* @__PURE__ */ r(
+                  ] }) : /* @__PURE__ */ f(M, { children: [
+                    /* @__PURE__ */ a(
                       D,
                       {
                         icon: "io5.IoFileTrayOutline",
@@ -291,7 +285,7 @@ const Fe = ({
                         }
                       }
                     ),
-                    /* @__PURE__ */ r(
+                    /* @__PURE__ */ a(
                       "span",
                       {
                         className: `ar-Uploader__upload-prompt-text${l === "large" ? " h5 mb-0" : ""}`,
@@ -301,7 +295,7 @@ const Fe = ({
                   ] })
                 }
               ),
-              z && /* @__PURE__ */ r(
+              z && /* @__PURE__ */ a(
                 "small",
                 {
                   className: `ar-Uploader__upload-message text-decoration-underline ${l === "large" ? "fw-bold f3 mt-2 mb-2" : "mt-1"}`,
@@ -309,20 +303,20 @@ const Fe = ({
                 }
               )
             ] }),
-            /* @__PURE__ */ r("div", { className: "ar-Uploader__file-input__actions", children: l !== "compact" && t && Object.keys(t).length > 0 && /* @__PURE__ */ r(
+            /* @__PURE__ */ a("div", { className: "ar-Uploader__file-input__actions", children: l !== "compact" && e && Object.keys(e).length > 0 && /* @__PURE__ */ a(
               Q,
               {
                 containerClasses: `text-end${l === "large" ? " mt-3" : ""}`,
                 content: "Clear",
-                variant: ge.DANGER,
+                variant: be.DANGER,
                 size: l === "regular" ? j.XSMALL : j.SMALL,
-                onClick: (e) => {
-                  e.stopPropagation(), I(), d.current && (d.current.value = "");
+                onClick: (t) => {
+                  t.stopPropagation(), E(), d.current && (d.current.value = "");
                 }
               }
             ) })
           ] }),
-          /* @__PURE__ */ r(
+          /* @__PURE__ */ a(
             "input",
             {
               className: "ar-Uploader__input d-none",
@@ -332,51 +326,51 @@ const Fe = ({
               title: "file-uploader",
               accept: Array.isArray(w) ? w.join(",") : w,
               disabled: c,
-              multiple: E
+              multiple: A
             }
           )
         ]
       }
-    ), ie = $ && /* @__PURE__ */ r("span", { className: "error my-1 small", children: $ }), se = t && l !== "compact" && /* @__PURE__ */ r("div", { className: "ar-Uploader__file-upload-progress mt-2", children: Object.entries(t).map(
-      ([e, a]) => C ? C(a, () => I(e)) : /* @__PURE__ */ r(
+    ), ne = $ && /* @__PURE__ */ a("span", { className: "error my-1 small", children: $ }), se = e && l !== "compact" && /* @__PURE__ */ a("div", { className: "ar-Uploader__file-upload-progress mt-2", children: Object.entries(e).map(
+      ([t, r]) => v ? v(r, () => E(t)) : /* @__PURE__ */ a(
         Fe,
         {
-          clear: () => I(e),
-          demo: !!T,
+          clear: () => E(t),
+          demo: !!S,
           disabled: !!c,
-          result: a
+          result: r
         },
-        e
+        t
       )
     ) });
-    return /* @__PURE__ */ p(
+    return /* @__PURE__ */ f(
       "div",
       {
-        className: `ar-Uploader d-flex flex-column${l ? " " + l : ""}${y ? " flex-center" : " w-100"}`,
-        onDragOver: (e) => e.preventDefault(),
-        onDragLeave: (e) => e.preventDefault(),
+        className: `ar-Uploader d-flex flex-column${l ? " " + l : ""}${h ? " flex-center" : " w-100"}`,
+        onDragOver: (t) => t.preventDefault(),
+        onDragLeave: (t) => t.preventDefault(),
         children: [
-          l !== "compact" ? /* @__PURE__ */ r(
-            ve,
+          l !== "compact" ? /* @__PURE__ */ a(
+            xe,
             {
-              dropHandler: (e) => {
-                d.current && !c && (d.current.files = e.dataTransfer.files, d.current.dispatchEvent(
+              dropHandler: (t) => {
+                d.current && !c && (d.current.files = t.dataTransfer.files, d.current.dispatchEvent(
                   new Event("change", { bubbles: !0, cancelable: !0 })
                 ));
               },
               acceptTypes: [pe.FILE],
-              hideHoverEffect: y || c,
+              hideHoverEffect: h || c,
               children: X
             }
           ) : X,
-          !y && ie,
-          !y && se
+          !h && ne,
+          !h && se
         ]
       }
     );
   },
-  (n, o) => n.acceptedFileTypes === o.acceptedFileTypes && n.acceptedFileCount === o.acceptedFileCount && n.allowMultiple === o.allowMultiple && n.disabled === o.disabled && n.errorMessage === o.errorMessage && n.endpoint === o.endpoint && n.fileSizeLimit === o.fileSizeLimit && JSON.stringify(n.files) === JSON.stringify(o.files) && n.message === o.message && n.avatarSize === o.avatarSize && n.variant === o.variant && n.theme === o.theme && n.uploadSequential === o.uploadSequential && n.uploadButtonText === o.uploadButtonText && n.uploadingButtonText === o.uploadingButtonText
+  (i, o) => i.acceptedFileTypes === o.acceptedFileTypes && i.acceptedFileCount === o.acceptedFileCount && i.allowMultiple === o.allowMultiple && i.disabled === o.disabled && i.errorMessage === o.errorMessage && i.endpoint === o.endpoint && i.fileSizeLimit === o.fileSizeLimit && JSON.stringify(i.files) === JSON.stringify(o.files) && i.message === o.message && i.avatarSize === o.avatarSize && i.variant === o.variant && i.theme === o.theme && i.uploadSequential === o.uploadSequential && i.uploadButtonText === o.uploadButtonText && i.uploadingButtonText === o.uploadingButtonText
 );
 export {
-  Je as default
+  Ke as default
 };

package/es/index.js

@@ -1,6 +1,10 @@
-import { default as a } from "./useUpload.js";
-import { default as r } from "./Uploader.js";
+import { default as r } from "./useUpload.js";
+import { default as a } from "./Uploader.js";
+import { convertToBytes as l, generateFileKey as m, isImage as p } from "./utils.js";
 export {
-  r as default,
-  a as useUpload
+  l as convertToBytes,
+  a as default,
+  m as generateFileKey,
+  p as isImage,
+  r as useUpload
 };

package/es/useUpload.js

@@ -1,28 +1,28 @@
 import { useState as I, useRef as S, useEffect as v } from "react";
-import { ArProgress as d } from "@armco/types";
-import { generateFileKey as m } from "@armco/utils/helper";
+import { ArProgress as f } from "@armco/shared-components/enums";
 import { upload as b } from "@armco/utils/network";
+import { generateFileKey as E } from "./utils.js";
 const R = {
-  status: d.COMPLETED,
+  status: f.COMPLETED,
   progress: 100
-}, p = {
-  status: d.FAILED,
+}, h = {
+  status: f.FAILED,
   progress: 0
-}, C = (E, y, f) => {
+}, C = (i, m, p) => {
   const [l, o] = I(), a = S({}), c = S({});
   v(() => {
-    if (f) {
+    if (p) {
       const t = {};
-      f == null || f.forEach((n) => {
-        t[m(n)] = {
+      p?.forEach((n) => {
+        t[E(n)] = {
           ...n,
           progress: 100,
-          status: d.COMPLETED,
+          status: f.COMPLETED,
           file: typeof n == "object" ? n : { name: n.name }
         };
       }), o(t);
     }
-  }, [f]), v(() => {
+  }, [p]), v(() => {
     const t = c.current;
     return () => {
       Object.keys(t).forEach((n) => clearInterval(t[n]));
@@ -34,12 +34,12 @@ const R = {
       delete n[t], o(n), a.current[t] = !0, clearInterval(c.current[t]);
     } else
       o(void 0), l && Object.keys(l).forEach(
-        (n) => l[n].status === d.IN_PROGRESS && (a.current[n] = !0)
+        (n) => l[n].status === f.IN_PROGRESS && (a.current[n] = !0)
       ), Object.keys(c.current).forEach(
         (n) => clearInterval(c.current[n])
       );
-  }, i = async (t) => {
-    const h = typeof E == "function" ? E : null, r = m(t);
+  }, y = async (t) => {
+    const d = typeof i == "function" ? i : null, r = E(t);
     return c.current[r] = setInterval(() => {
       o((s) => {
         const e = s && s[r];
@@ -54,10 +54,10 @@ const R = {
           }
         };
       });
-    }, 500), h ? await h(t).then((s) => {
+    }, 500), d ? await d(t).then((s) => {
       a.current[r] || (s.ok || o((e) => ({
         ...e,
-        [r]: { file: t, ...p }
+        [r]: { file: t, ...h }
       })), o((e) => ({
         ...e,
         [r]: { file: t, ...R }
@@ -65,11 +65,11 @@ const R = {
     }).catch(() => {
       a.current[r] || o((s) => ({
         ...s,
-        [r]: { file: t, ...p }
+        [r]: { file: t, ...h }
       }));
     }).finally(() => {
       c.current && clearInterval(c.current[r]);
-    }) : await b(E, t).then((s) => {
+    }) : await b(i, t).then((s) => {
       if (a.current[r])
         delete a.current[r], delete c.current[r];
       else {
@@ -78,7 +78,7 @@ const R = {
             ...u,
             [r]: {
               file: t,
-              ...p,
+              ...h,
               error: s.body,
               httpStatus: s.status
             }
@@ -94,25 +94,25 @@ const R = {
     }).catch((s) => {
       a.current[r] ? (delete a.current[r], delete c.current[r]) : o((e) => ({
         ...e,
-        [r]: { file: t, ...p, error: s }
+        [r]: { file: t, ...h, error: s }
       }));
     }).finally(() => {
       c.current && clearInterval(c.current[r]);
     });
   };
-  return { clear: g, upload: async (t, n, h) => {
+  return { clear: g, upload: async (t, n, d) => {
     const r = {};
     t.forEach((e) => {
-      const u = m(e);
+      const u = E(e);
       r[u] = {
         file: e,
-        status: d.IN_PROGRESS,
-        progress: y ? 1 : Math.floor(Math.random() * 10)
+        status: f.IN_PROGRESS,
+        progress: m ? 1 : Math.floor(Math.random() * 10)
       };
-    }), o(h ? { ...l, ...r } : r);
+    }), o(d ? { ...l, ...r } : r);
     let s = [];
     for (const e of t)
-      y ? s.push(await i(e)) : s.push(i(e));
+      m ? s.push(await y(e)) : s.push(y(e));
     await Promise.allSettled(s).then(
       (e) => n && n(e)
     );

package/es/utils.js

@@ -0,0 +1,29 @@
+const r = [
+  "image/jpeg",
+  "image/png",
+  "image/gif",
+  "image/webp",
+  "image/svg+xml",
+  "image/tiff",
+  "image/bmp",
+  "image/x-icon"
+];
+function i(e) {
+  return "size" in e ? `${e.name}_${e.size}_${e.type}_${e.lastModified}` : e.name + "-preexisting-" + Date.now();
+}
+function s(e) {
+  const n = e.trim().toLowerCase();
+  try {
+    return n.endsWith("kb") ? parseFloat(n.slice(0, -2)) * 1024 : n.endsWith("mb") ? parseFloat(n.slice(0, -2)) * 1024 * 1024 : n.endsWith("bytes") ? parseFloat(n.slice(0, -5)) : isNaN(parseFloat(n)) ? -1 : parseFloat(n);
+  } catch {
+    return -1;
+  }
+}
+function a(e) {
+  return !!e && r.indexOf(e) > -1;
+}
+export {
+  s as convertToBytes,
+  i as generateFileKey,
+  a as isImage
+};

package/package.json

@@ -1,24 +1,11 @@
 {
   "name": "@armco/uploader",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "type": "module",
   "main": "cjs/index.js",
   "module": "es/index.js",
   "types": "types/index.d.ts",
-  "scripts": {
-    "*": "rm -rf build && tsc && vite build",
-    "format": "prettier --write .",
-    "lint": "eslint .",
-    "publish:sh": "./publish.sh",
-    "publish:local": "./publish-local.sh"
-  },
   "peerDependencies": {
-    "@armco/types": "^0.0.17",
-    "@armco/configs": "^0.0.10",
-    "@armco/utils": "^0.0.28",
-    "@armco/shared-components": "^0.0.56",
-    "@armco/icon": "^0.0.9",
-    "@armco/avatar": "^0.0.5",
     "react": "^18.2.0",
     "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.2.0",
@@ -40,7 +27,7 @@
   "prettier": "prettier-config-nick",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ReStruct-Corporate-Advantage/uploader.git"
+    "url": "git+https://gitea.armco.dev/ReStruct-Corporate-Advantage/uploader.git"
   },
   "keywords": [
     "components",
@@ -50,7 +37,18 @@
   ],
   "license": "ISC",
   "bugs": {
-    "url": "https://github.com/ReStruct-Corporate-Advantage/uploader/issues"
+    "url": "https://gitea.armco.dev/ReStruct-Corporate-Advantage/uploader/issues"
+  },
+  "homepage": "https://gitea.armco.dev/ReStruct-Corporate-Advantage/uploader#readme",
+  "dependencies": {
+    "@armco/configs": "^0.0.15",
+    "@armco/icon": "^0.0.13",
+    "@armco/shared-components": "^0.0.59",
+    "@armco/utils": "^0.0.31",
+    "@types/uuid": "^10.0.0"
   },
-  "homepage": "https://github.com/ReStruct-Corporate-Advantage/uploader#readme"
+  "private": false,
+  "files": [
+    "*"
+  ]
 }

package/types/Uploader.d.ts

@@ -1,3 +1,4 @@
-import { UploaderProps } from '@armco/types';
-declare const Uploader: import('react').MemoExoticComponent<(props: UploaderProps) => JSX.Element>;
+import { ReactNode } from 'react';
+import { UploaderProps } from './types';
+declare const Uploader: import('react').MemoExoticComponent<(props: UploaderProps) => ReactNode>;
 export default Uploader;

package/types/index.d.ts

@@ -1,2 +1,4 @@
 export { default as useUpload } from './useUpload';
 export { default } from './Uploader';
+export * from './utils';
+export * from './types';

package/types/types.d.ts

@@ -0,0 +1,44 @@
+import { BaseProps, FunctionType } from '@armco/types';
+import { ImageProps } from '@armco/shared-components/Image';
+import { ArProgress, ArSizes } from '@armco/shared-components/enums';
+export type UploadHandler = (file: File) => Promise<UploadResults>;
+export type UploadResults = {
+    [key: string]: UploadResult;
+};
+export interface UploadResult {
+    file: File | {
+        name: string;
+    };
+    imageProps?: Partial<ImageProps>;
+    status: ArProgress;
+    progress: number;
+    type?: string;
+    url?: string;
+    error?: string;
+    httpStatus?: number;
+}
+export interface UploaderProps extends BaseProps {
+    acceptedFileTypes?: string | Array<string>;
+    acceptedFileCount?: number;
+    afterUpload?: FunctionType;
+    allowMultiple?: boolean;
+    avatarSize?: ArSizes;
+    beforeUpload?: FunctionType;
+    disabled?: boolean;
+    endpoint?: string;
+    errorMessage?: string;
+    files?: Array<File | {
+        name: string;
+        url?: string;
+    }>;
+    fileSizeLimit?: string;
+    handler?: UploadHandler;
+    message?: string;
+    updateEndpoint?: string;
+    uploadEntryRenderer?: FunctionType;
+    uploadSequential?: boolean;
+    onFileSelected: FunctionType;
+    variant: "compact" | "regular" | "large" | "image-circle" | "image-rect";
+    uploadButtonText?: string;
+    uploadingButtonText?: string;
+}

package/types/useUpload.d.ts

@@ -1,4 +1,5 @@
-import { FunctionType, UploadHandler, UploadResults } from '@armco/types';
+import { FunctionType } from '@armco/types';
+import { UploadHandler, UploadResults } from './types';
 declare const useUpload: (endpointOrHandler: string | UploadHandler, isSequential?: boolean, files?: Array<File | {
     name: string;
     url?: string;

package/types/utils.d.ts

@@ -0,0 +1,5 @@
+export declare function generateFileKey(file: File | {
+    name: string;
+}): string;
+export declare function convertToBytes(input: string): number;
+export declare function isImage(type: string): boolean;