@armco/uploader 0.0.3 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/Uploader.js +1 -1
- package/cjs/index.js +1 -1
- package/es/Uploader.js +10 -11
- package/es/index.js +4 -20
- package/package.json +11 -40
- package/types/index.d.ts +1 -1
package/cjs/Uploader.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
(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)}})();
|
|
2
|
-
"use strict";const
|
|
2
|
+
"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;
|
package/cjs/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.
|
|
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;
|
package/es/Uploader.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
(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)}})();
|
|
2
|
-
import me from "./useUpload.js";
|
|
3
2
|
import { jsxs as p, jsx as r, Fragment as M } from "react/jsx-runtime";
|
|
4
|
-
import { memo as
|
|
3
|
+
import { memo as me, useRef as ue, useState as x, useMemo as fe, useEffect as L } from "react";
|
|
5
4
|
import { v4 as O } from "uuid";
|
|
6
|
-
import { NativeTypes as
|
|
7
|
-
import { ArSizes as j, ArProgress as g, ArButtonVariants as
|
|
5
|
+
import { NativeTypes as pe } from "react-dnd-html5-backend";
|
|
6
|
+
import { ArSizes as j, ArProgress as g, ArButtonVariants as ge, ArAlertType as R, ArPopoverSlots as Y } from "@armco/types";
|
|
7
|
+
import he from "./useUpload.js";
|
|
8
8
|
import { useNotification as ye } from "@armco/utils/hooks";
|
|
9
9
|
import { convertToBytes as be } from "@armco/utils/helper";
|
|
10
10
|
import { put as xe } from "@armco/utils/network";
|
|
@@ -75,7 +75,7 @@ const Fe = ({
|
|
|
75
75
|
] }) : k
|
|
76
76
|
}
|
|
77
77
|
);
|
|
78
|
-
}, Je =
|
|
78
|
+
}, Je = me(
|
|
79
79
|
(n) => {
|
|
80
80
|
const {
|
|
81
81
|
acceptedFileTypes: o,
|
|
@@ -100,10 +100,10 @@ const Fe = ({
|
|
|
100
100
|
uploadSequential: le,
|
|
101
101
|
uploadButtonText: W = "Upload",
|
|
102
102
|
uploadingButtonText: H = "Uploading..."
|
|
103
|
-
} = n, d =
|
|
103
|
+
} = n, d = ue(null), { notify: A } = ye(), [t, q] = x(), [E, V] = x(), [w, J] = x(), [$, _] = x(), ae = fe(
|
|
104
104
|
() => E ? u !== void 0 ? f == null ? void 0 : f.slice(0, u) : f : f == null ? void 0 : f.slice(0, 1),
|
|
105
105
|
[f]
|
|
106
|
-
), { clear: I, upload: re, results: U } =
|
|
106
|
+
), { clear: I, upload: re, results: U } = he(
|
|
107
107
|
N || P || "",
|
|
108
108
|
le,
|
|
109
109
|
ae
|
|
@@ -150,8 +150,7 @@ const Fe = ({
|
|
|
150
150
|
type: R.WARNING,
|
|
151
151
|
uid: O()
|
|
152
152
|
});
|
|
153
|
-
} else
|
|
154
|
-
e && e.length > 0 && (re(e, s, E), B && B(e));
|
|
153
|
+
} else e && e.length > 0 && (re(e, s, E), B && B(e));
|
|
155
154
|
}, oe = (e) => {
|
|
156
155
|
var i;
|
|
157
156
|
_("");
|
|
@@ -315,7 +314,7 @@ const Fe = ({
|
|
|
315
314
|
{
|
|
316
315
|
containerClasses: `text-end${l === "large" ? " mt-3" : ""}`,
|
|
317
316
|
content: "Clear",
|
|
318
|
-
variant:
|
|
317
|
+
variant: ge.DANGER,
|
|
319
318
|
size: l === "regular" ? j.XSMALL : j.SMALL,
|
|
320
319
|
onClick: (e) => {
|
|
321
320
|
e.stopPropagation(), I(), d.current && (d.current.value = "");
|
|
@@ -365,7 +364,7 @@ const Fe = ({
|
|
|
365
364
|
new Event("change", { bubbles: !0, cancelable: !0 })
|
|
366
365
|
));
|
|
367
366
|
},
|
|
368
|
-
acceptTypes: [
|
|
367
|
+
acceptTypes: [pe.FILE],
|
|
369
368
|
hideHoverEffect: y || c,
|
|
370
369
|
children: X
|
|
371
370
|
}
|
package/es/index.js
CHANGED
|
@@ -1,22 +1,6 @@
|
|
|
1
|
-
import { default as
|
|
2
|
-
import { default as
|
|
3
|
-
import "react";
|
|
4
|
-
import "@armco/types";
|
|
5
|
-
import "@armco/utils/helper";
|
|
6
|
-
import "@armco/utils/network";
|
|
7
|
-
import "react/jsx-runtime";
|
|
8
|
-
import "uuid";
|
|
9
|
-
import "react-dnd-html5-backend";
|
|
10
|
-
import "@armco/utils/hooks";
|
|
11
|
-
import "@armco/shared-components/Droppable";
|
|
12
|
-
import "@armco/shared-components/Button";
|
|
13
|
-
import "@armco/shared-components/Text";
|
|
14
|
-
import "@armco/shared-components/ProgressIndicator";
|
|
15
|
-
import "@armco/shared-components/Tooltip";
|
|
16
|
-
import "@armco/configs/endpoints";
|
|
17
|
-
import "@armco/avatar";
|
|
18
|
-
import "@armco/icon";
|
|
1
|
+
import { default as a } from "./useUpload.js";
|
|
2
|
+
import { default as r } from "./Uploader.js";
|
|
19
3
|
export {
|
|
20
|
-
|
|
21
|
-
|
|
4
|
+
r as default,
|
|
5
|
+
a as useUpload
|
|
22
6
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@armco/uploader",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.5",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "cjs/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -12,46 +12,17 @@
|
|
|
12
12
|
"publish:sh": "./publish.sh",
|
|
13
13
|
"publish:local": "./publish-local.sh"
|
|
14
14
|
},
|
|
15
|
-
"dependencies": {
|
|
16
|
-
"@armco/avatar": "^0.0.4",
|
|
17
|
-
"@armco/configs": "^0.0.7",
|
|
18
|
-
"@armco/icon": "^0.0.5",
|
|
19
|
-
"@armco/shared-components": "^0.0.53",
|
|
20
|
-
"@armco/types": "^0.0.11",
|
|
21
|
-
"@armco/utils": "^0.0.17",
|
|
22
|
-
"react": ">16.8.0",
|
|
23
|
-
"react-dnd-html5-backend": "^16.0.1",
|
|
24
|
-
"react-dom": ">16.8.0",
|
|
25
|
-
"uuid": "^10.0.0"
|
|
26
|
-
},
|
|
27
|
-
"devDependencies": {
|
|
28
|
-
"@testing-library/dom": "^9.2.0",
|
|
29
|
-
"@testing-library/jest-dom": "^5.11.4",
|
|
30
|
-
"@testing-library/react": "^14.0.0",
|
|
31
|
-
"@testing-library/user-event": "^14.2.5",
|
|
32
|
-
"@types/react": "^18.0.15",
|
|
33
|
-
"@types/react-dom": "^18.0.6",
|
|
34
|
-
"@types/testing-library__jest-dom": "^5.14.5",
|
|
35
|
-
"@types/uuid": "^10.0.0",
|
|
36
|
-
"@vitejs/plugin-react": "^4.3.1",
|
|
37
|
-
"eslint": "^8.0.0",
|
|
38
|
-
"eslint-config-react-app": "^7.0.1",
|
|
39
|
-
"eslint-plugin-prettier": "^4.2.1",
|
|
40
|
-
"glob": "^11.0.0",
|
|
41
|
-
"jsdom": "^21.1.0",
|
|
42
|
-
"prettier": "^2.7.1",
|
|
43
|
-
"prettier-config-nick": "^1.0.2",
|
|
44
|
-
"sass": "^1.63.4",
|
|
45
|
-
"typescript": "^5.0.2",
|
|
46
|
-
"vite": "^4.0.0",
|
|
47
|
-
"vite-plugin-css-injected-by-js": "^3.5.1",
|
|
48
|
-
"vite-plugin-dts": "^4.2.2",
|
|
49
|
-
"vite-plugin-externalize-deps": "^0.8.0",
|
|
50
|
-
"vitest": "^0.30.1"
|
|
51
|
-
},
|
|
52
15
|
"peerDependencies": {
|
|
53
|
-
"
|
|
54
|
-
"
|
|
16
|
+
"@armco/types": "^0.0.18",
|
|
17
|
+
"@armco/configs": "^0.0.11",
|
|
18
|
+
"@armco/utils": "^0.0.29",
|
|
19
|
+
"@armco/shared-components": "^0.0.57",
|
|
20
|
+
"@armco/icon": "^0.0.10",
|
|
21
|
+
"@armco/avatar": "^0.0.6",
|
|
22
|
+
"react": "^18.2.0",
|
|
23
|
+
"react-dnd-html5-backend": "^16.0.1",
|
|
24
|
+
"react-dom": "^18.2.0",
|
|
25
|
+
"uuid": "^9.0.0"
|
|
55
26
|
},
|
|
56
27
|
"eslintConfig": {
|
|
57
28
|
"extends": [
|
package/types/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { default as useUpload } from './useUpload';
|
|
2
|
-
export { default
|
|
2
|
+
export { default } from './Uploader';
|