@geekapps/silo-elements-nextjs 0.2.64 → 0.2.65
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/dist/FileUploader.js +80 -97
- package/dist/FileUploader.js.map +1 -1
- package/dist/ImageUploader.js +18 -23
- package/dist/ImageUploader.js.map +1 -1
- package/dist/MediaUploader.js +80 -97
- package/dist/MediaUploader.js.map +1 -1
- package/dist/VideoUploader.js +22 -33
- package/dist/VideoUploader.js.map +1 -1
- package/dist/components/DropZone.js +9 -7
- package/dist/components/DropZone.js.map +1 -1
- package/dist/components/ProgressBar.js +3 -4
- package/dist/components/ProgressBar.js.map +1 -1
- package/dist/index.js +80 -97
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/styles.css +1 -1
package/dist/index.js
CHANGED
|
@@ -91,18 +91,20 @@ function DropZone({
|
|
|
91
91
|
);
|
|
92
92
|
const rootStyle = {
|
|
93
93
|
...vars,
|
|
94
|
+
border: `2px dashed ${dragging ? "var(--silo-border-active)" : "var(--silo-border)"}`,
|
|
95
|
+
borderRadius: "var(--silo-radius)",
|
|
96
|
+
background: dragging ? "var(--silo-bg-hover)" : "var(--silo-bg)",
|
|
97
|
+
color: "var(--silo-text)",
|
|
98
|
+
cursor: disabled ? "not-allowed" : "pointer",
|
|
99
|
+
opacity: disabled ? 0.5 : 1,
|
|
100
|
+
outline: "none",
|
|
101
|
+
transition: "border-color 150ms, background 150ms",
|
|
94
102
|
...style
|
|
95
103
|
};
|
|
96
|
-
const cls = [
|
|
97
|
-
"silo-border-2 silo-border-dashed silo-border-slate-200 silo-rounded-xl silo-bg-slate-50 silo-text-slate-900 silo-cursor-pointer silo-outline-none silo-transition-colors silo-duration-150",
|
|
98
|
-
dragging ? "silo-border-indigo-500 silo-bg-slate-100" : "hover:silo-border-indigo-500 hover:silo-bg-slate-100",
|
|
99
|
-
disabled ? "silo-opacity-50 silo-cursor-not-allowed" : "",
|
|
100
|
-
className
|
|
101
|
-
].filter(Boolean).join(" ");
|
|
102
104
|
return /* @__PURE__ */ jsxs(
|
|
103
105
|
"div",
|
|
104
106
|
{
|
|
105
|
-
className
|
|
107
|
+
className,
|
|
106
108
|
style: rootStyle,
|
|
107
109
|
onDragOver: (e) => {
|
|
108
110
|
e.preventDefault();
|
|
@@ -139,8 +141,8 @@ function ProgressBar({ progress, className = "", style }) {
|
|
|
139
141
|
return /* @__PURE__ */ jsx(
|
|
140
142
|
"div",
|
|
141
143
|
{
|
|
142
|
-
className
|
|
143
|
-
style,
|
|
144
|
+
className,
|
|
145
|
+
style: { height: 4, borderRadius: 9999, background: "var(--silo-border, #e2e8f0)", overflow: "hidden", ...style },
|
|
144
146
|
role: "progressbar",
|
|
145
147
|
"aria-valuenow": progress,
|
|
146
148
|
"aria-valuemin": 0,
|
|
@@ -148,8 +150,7 @@ function ProgressBar({ progress, className = "", style }) {
|
|
|
148
150
|
children: /* @__PURE__ */ jsx(
|
|
149
151
|
"div",
|
|
150
152
|
{
|
|
151
|
-
|
|
152
|
-
style: { width: `${progress}%` }
|
|
153
|
+
style: { height: "100%", borderRadius: 9999, background: "var(--silo-accent, #6366f1)", width: `${progress}%`, transition: "width 200ms linear" }
|
|
153
154
|
}
|
|
154
155
|
)
|
|
155
156
|
}
|
|
@@ -166,14 +167,14 @@ function ImageOptions({ value, onChange, style }) {
|
|
|
166
167
|
const optimize = value.optimize ?? true;
|
|
167
168
|
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2.5", style, children: [
|
|
168
169
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
169
|
-
/* @__PURE__ */ jsx("div", {
|
|
170
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, fontWeight: 700, textTransform: "uppercase", letterSpacing: "0.05em", marginBottom: 6, color: "var(--silo-text-muted)" }, children: "Formato de sa\xEDda" }),
|
|
170
171
|
/* @__PURE__ */ jsx("div", { className: "flex gap-1.5 flex-wrap", children: FORMATS.map((f) => /* @__PURE__ */ jsx(
|
|
171
172
|
"button",
|
|
172
173
|
{
|
|
173
174
|
type: "button",
|
|
174
175
|
onClick: () => onChange({ ...value, format: f.value }),
|
|
175
176
|
title: f.hint,
|
|
176
|
-
|
|
177
|
+
style: fmt === f.value ? { border: "1px solid var(--silo-accent)", background: "var(--silo-accent)", color: "#fff", padding: "4px 12px", borderRadius: 6, fontSize: 12, fontWeight: 600, cursor: "pointer" } : { border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text)", padding: "4px 12px", borderRadius: 6, fontSize: 12, fontWeight: 600, cursor: "pointer" },
|
|
177
178
|
children: f.label
|
|
178
179
|
},
|
|
179
180
|
f.value
|
|
@@ -184,18 +185,12 @@ function ImageOptions({ value, onChange, style }) {
|
|
|
184
185
|
"span",
|
|
185
186
|
{
|
|
186
187
|
onClick: () => onChange({ ...value, optimize: !optimize }),
|
|
187
|
-
|
|
188
|
-
children: /* @__PURE__ */ jsx(
|
|
189
|
-
"span",
|
|
190
|
-
{
|
|
191
|
-
className: "absolute top-0.5 w-4 h-4 rounded-full bg-white shadow-sm transition-[left] duration-150",
|
|
192
|
-
style: { left: optimize ? "18px" : "2px" }
|
|
193
|
-
}
|
|
194
|
-
)
|
|
188
|
+
style: { position: "relative", display: "inline-block", width: 36, height: 20, borderRadius: 10, flexShrink: 0, cursor: "pointer", background: optimize ? "var(--silo-accent)" : "var(--silo-border)", transition: "background 150ms" },
|
|
189
|
+
children: /* @__PURE__ */ jsx("span", { style: { position: "absolute", top: 2, left: optimize ? 18 : 2, width: 16, height: 16, borderRadius: "50%", background: "#fff", boxShadow: "0 1px 3px rgba(0,0,0,.2)", transition: "left 150ms" } })
|
|
195
190
|
}
|
|
196
191
|
),
|
|
197
|
-
/* @__PURE__ */ jsx("span", {
|
|
198
|
-
/* @__PURE__ */ jsx("span", {
|
|
192
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 500, color: "var(--silo-text)" }, children: "Otimizar tamanho" }),
|
|
193
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 11, color: "var(--silo-text-muted)" }, children: optimize ? "Qualidade 85 \u2014 menor tamanho" : "Qualidade m\xE1xima" })
|
|
199
194
|
] })
|
|
200
195
|
] });
|
|
201
196
|
}
|
|
@@ -423,24 +418,12 @@ var RESOLUTION_LABELS = {
|
|
|
423
418
|
"1440": "1440p",
|
|
424
419
|
"2160": "4K"
|
|
425
420
|
};
|
|
426
|
-
function
|
|
427
|
-
return
|
|
421
|
+
function optBtnStyle(active) {
|
|
422
|
+
return active ? { border: "1px solid var(--silo-accent)", background: "var(--silo-accent)", color: "#fff", padding: "4px 10px", borderRadius: 6, fontSize: 12, fontWeight: 600, cursor: "pointer" } : { border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text)", padding: "4px 10px", borderRadius: 6, fontSize: 12, fontWeight: 600, cursor: "pointer" };
|
|
428
423
|
}
|
|
429
424
|
function Toggle({ checked, onToggle, label }) {
|
|
430
|
-
return /* @__PURE__ */ jsxs("label", {
|
|
431
|
-
/* @__PURE__ */ jsx(
|
|
432
|
-
"span",
|
|
433
|
-
{
|
|
434
|
-
className: `relative inline-block w-8 h-[18px] rounded-full shrink-0 cursor-pointer transition-colors duration-150${checked ? "bg-indigo-500" : "bg-slate-200"}`,
|
|
435
|
-
children: /* @__PURE__ */ jsx(
|
|
436
|
-
"span",
|
|
437
|
-
{
|
|
438
|
-
className: "absolute top-0.5 w-3.5 h-3.5 rounded-full bg-white shadow-sm transition-[left] duration-150",
|
|
439
|
-
style: { left: checked ? "16px" : "2px" }
|
|
440
|
-
}
|
|
441
|
-
)
|
|
442
|
-
}
|
|
443
|
-
),
|
|
425
|
+
return /* @__PURE__ */ jsxs("label", { style: { display: "inline-flex", alignItems: "center", gap: 6, cursor: "pointer", userSelect: "none", fontSize: 12, color: "var(--silo-text)", fontWeight: 500 }, onClick: onToggle, children: [
|
|
426
|
+
/* @__PURE__ */ jsx("span", { style: { position: "relative", display: "inline-block", width: 32, height: 18, borderRadius: 9, flexShrink: 0, cursor: "pointer", background: checked ? "var(--silo-accent)" : "var(--silo-border)", transition: "background 150ms" }, children: /* @__PURE__ */ jsx("span", { style: { position: "absolute", top: 2, left: checked ? 16 : 2, width: 14, height: 14, borderRadius: "50%", background: "#fff", boxShadow: "0 1px 3px rgba(0,0,0,.2)", transition: "left 150ms" } }) }),
|
|
444
427
|
label
|
|
445
428
|
] });
|
|
446
429
|
}
|
|
@@ -462,29 +445,29 @@ function VideoOptions({ value, onChange, style }) {
|
|
|
462
445
|
}
|
|
463
446
|
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", style, children: [
|
|
464
447
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
465
|
-
/* @__PURE__ */ jsx("div", {
|
|
448
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, fontWeight: 700, textTransform: "uppercase", letterSpacing: "0.05em", marginBottom: 6, color: "var(--silo-text-muted)" }, children: "Codec" }),
|
|
466
449
|
/* @__PURE__ */ jsx("div", { className: "flex gap-1.5 flex-wrap", children: CODECS.map((c) => /* @__PURE__ */ jsx(
|
|
467
450
|
"button",
|
|
468
451
|
{
|
|
469
452
|
type: "button",
|
|
470
453
|
title: c.hint,
|
|
471
454
|
onClick: () => onChange({ ...value, codec: c.value }),
|
|
472
|
-
|
|
455
|
+
style: optBtnStyle(codec === c.value),
|
|
473
456
|
children: c.label
|
|
474
457
|
},
|
|
475
458
|
c.value
|
|
476
459
|
)) })
|
|
477
460
|
] }),
|
|
478
461
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
479
|
-
/* @__PURE__ */ jsx("div", {
|
|
462
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, fontWeight: 700, textTransform: "uppercase", letterSpacing: "0.05em", marginBottom: 6, color: "var(--silo-text-muted)" }, children: "Resolu\xE7\xF5es" }),
|
|
480
463
|
/* @__PURE__ */ jsxs("div", { className: "flex gap-1.5 flex-wrap", children: [
|
|
481
|
-
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => onChange({ ...value, transcoding: "auto" }),
|
|
464
|
+
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => onChange({ ...value, transcoding: "auto" }), style: optBtnStyle(isAuto), children: "Auto" }),
|
|
482
465
|
RESOLUTIONS.map((r) => /* @__PURE__ */ jsx(
|
|
483
466
|
"button",
|
|
484
467
|
{
|
|
485
468
|
type: "button",
|
|
486
469
|
onClick: () => toggleRes(r),
|
|
487
|
-
|
|
470
|
+
style: optBtnStyle(!isAuto && selectedRes.includes(r)),
|
|
488
471
|
children: RESOLUTION_LABELS[r]
|
|
489
472
|
},
|
|
490
473
|
r
|
|
@@ -492,7 +475,7 @@ function VideoOptions({ value, onChange, style }) {
|
|
|
492
475
|
] })
|
|
493
476
|
] }),
|
|
494
477
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
495
|
-
/* @__PURE__ */ jsx("div", {
|
|
478
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, fontWeight: 700, textTransform: "uppercase", letterSpacing: "0.05em", marginBottom: 8, color: "var(--silo-text-muted)" }, children: "Recursos" }),
|
|
496
479
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
|
|
497
480
|
/* @__PURE__ */ jsx(Toggle, { checked: value.thumbnails ?? true, onToggle: () => toggleFeature("thumbnails"), label: "Gerar thumbnails" }),
|
|
498
481
|
/* @__PURE__ */ jsx(Toggle, { checked: value.storyboard ?? false, onToggle: () => toggleFeature("storyboard"), label: "Gerar storyboard" }),
|
|
@@ -876,9 +859,9 @@ function FileUploader({
|
|
|
876
859
|
children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
|
|
877
860
|
renderIcon ? renderIcon() : /* @__PURE__ */ jsx("svg", { width: "40", height: "40", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", className: "text-slate-400 opacity-50", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" }) }),
|
|
878
861
|
children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
879
|
-
/* @__PURE__ */ jsx("span", {
|
|
880
|
-
/* @__PURE__ */ jsx("span", {
|
|
881
|
-
maxSize && /* @__PURE__ */ jsxs("span", {
|
|
862
|
+
/* @__PURE__ */ jsx("span", { style: { color: "var(--silo-text)", fontWeight: 700, fontSize: 15 }, children: multiple ? "Arraste seus arquivos aqui" : "Arraste seu arquivo aqui" }),
|
|
863
|
+
/* @__PURE__ */ jsx("span", { style: { color: "var(--silo-text-muted)", fontSize: 13 }, children: "ou clique para escolher do seu dispositivo" }),
|
|
864
|
+
maxSize && /* @__PURE__ */ jsxs("span", { style: { color: "var(--silo-text-muted)", fontSize: 12 }, children: [
|
|
882
865
|
"Tamanho m\xE1ximo: ",
|
|
883
866
|
formatBytes(maxSize)
|
|
884
867
|
] })
|
|
@@ -887,10 +870,10 @@ function FileUploader({
|
|
|
887
870
|
}
|
|
888
871
|
),
|
|
889
872
|
staged && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
|
|
890
|
-
/* @__PURE__ */ jsx("div", {
|
|
891
|
-
staged.map((f, i) => /* @__PURE__ */ jsxs("div", {
|
|
892
|
-
/* @__PURE__ */ jsx("span", {
|
|
893
|
-
/* @__PURE__ */ jsxs("div", {
|
|
873
|
+
/* @__PURE__ */ jsx("div", { style: { color: "var(--silo-text-muted)", fontSize: 13, fontWeight: 600, marginBottom: 2 }, children: staged.length === 1 ? "1 arquivo selecionado" : `${staged.length} arquivos selecionados` }),
|
|
874
|
+
staged.map((f, i) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "10px 12px", background: "var(--silo-bg)", borderRadius: "var(--silo-radius)", border: "1px solid var(--silo-border)" }, children: [
|
|
875
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 20, flexShrink: 0 }, children: getFileIcon(f.type) }),
|
|
876
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
894
877
|
editingIndex === i ? /* @__PURE__ */ jsx(
|
|
895
878
|
"input",
|
|
896
879
|
{
|
|
@@ -908,28 +891,28 @@ function FileUploader({
|
|
|
908
891
|
}
|
|
909
892
|
if (e.key === "Escape") setEditingIndex(null);
|
|
910
893
|
},
|
|
911
|
-
|
|
894
|
+
style: { width: "100%", fontSize: 13, fontWeight: 500, border: "1px solid var(--silo-accent)", borderRadius: 6, padding: "2px 8px", outline: "none", background: "var(--silo-bg)", color: "var(--silo-text)" }
|
|
912
895
|
}
|
|
913
896
|
) : /* @__PURE__ */ jsxs(
|
|
914
897
|
"div",
|
|
915
898
|
{
|
|
916
|
-
|
|
899
|
+
style: { fontSize: 13, fontWeight: 600, color: "var(--silo-text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", cursor: allowRename ? "text" : "default" },
|
|
917
900
|
onClick: () => allowRename && setEditingIndex(i),
|
|
918
901
|
title: allowRename ? "Clique para renomear" : void 0,
|
|
919
902
|
children: [
|
|
920
903
|
effectiveName(i, staged),
|
|
921
|
-
renames.has(i) && /* @__PURE__ */ jsx("span", {
|
|
904
|
+
renames.has(i) && /* @__PURE__ */ jsx("span", { style: { color: "var(--silo-accent)", marginLeft: 6, fontSize: 10, fontWeight: 700 }, children: "renomeado" })
|
|
922
905
|
]
|
|
923
906
|
}
|
|
924
907
|
),
|
|
925
|
-
/* @__PURE__ */ jsx("div", {
|
|
908
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--silo-text-muted)", marginTop: 2 }, children: formatBytes(f.size) })
|
|
926
909
|
] }),
|
|
927
910
|
allowRename && /* @__PURE__ */ jsx(
|
|
928
911
|
"button",
|
|
929
912
|
{
|
|
930
913
|
onClick: () => setEditingIndex(i),
|
|
931
914
|
title: "Renomear",
|
|
932
|
-
|
|
915
|
+
style: { color: "var(--silo-text-muted)", background: "none", border: "none", cursor: "pointer", fontSize: 14, padding: "0 4px", flexShrink: 0 },
|
|
933
916
|
children: "\u270F\uFE0F"
|
|
934
917
|
}
|
|
935
918
|
),
|
|
@@ -941,42 +924,42 @@ function FileUploader({
|
|
|
941
924
|
if (next.length === 0) clearStaging();
|
|
942
925
|
else setStaged(next);
|
|
943
926
|
},
|
|
944
|
-
|
|
927
|
+
style: { color: "var(--silo-text-muted)", background: "none", border: "none", cursor: "pointer", fontSize: 18, padding: "0 4px", lineHeight: 1, flexShrink: 0 },
|
|
945
928
|
children: "\xD7"
|
|
946
929
|
}
|
|
947
930
|
)
|
|
948
931
|
] }, i)),
|
|
949
|
-
showImageOptions && staged.some((f) => f.type.startsWith("image/")) && /* @__PURE__ */ jsxs("div", {
|
|
950
|
-
/* @__PURE__ */ jsx("div", {
|
|
951
|
-
/* @__PURE__ */ jsx(
|
|
932
|
+
showImageOptions && staged.some((f) => f.type.startsWith("image/")) && /* @__PURE__ */ jsxs("div", { style: { border: "1px solid var(--silo-border)", borderRadius: "var(--silo-radius)", overflow: "hidden" }, children: [
|
|
933
|
+
/* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", background: "var(--silo-bg-hover)", fontSize: 12, fontWeight: 700, color: "var(--silo-text-muted)", letterSpacing: "0.04em" }, children: "\u{1F5BC}\uFE0F Configura\xE7\xF5es de imagem" }),
|
|
934
|
+
/* @__PURE__ */ jsx("div", { style: { padding: "12px 14px", background: "var(--silo-bg)" }, children: /* @__PURE__ */ jsx(ImageOptions, { value: imageOpts, onChange: setImageOpts }) })
|
|
952
935
|
] }),
|
|
953
|
-
showVideoOptions && staged.some((f) => f.type.startsWith("video/")) && /* @__PURE__ */ jsxs("div", {
|
|
954
|
-
/* @__PURE__ */ jsx("div", {
|
|
955
|
-
/* @__PURE__ */ jsx(
|
|
936
|
+
showVideoOptions && staged.some((f) => f.type.startsWith("video/")) && /* @__PURE__ */ jsxs("div", { style: { border: "1px solid var(--silo-border)", borderRadius: "var(--silo-radius)", overflow: "hidden" }, children: [
|
|
937
|
+
/* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", background: "var(--silo-bg-hover)", fontSize: 12, fontWeight: 700, color: "var(--silo-text-muted)", letterSpacing: "0.04em" }, children: "\u{1F3AC} Configura\xE7\xF5es de v\xEDdeo" }),
|
|
938
|
+
/* @__PURE__ */ jsx("div", { style: { padding: "12px 14px", background: "var(--silo-bg)" }, children: /* @__PURE__ */ jsx(VideoOptions, { value: videoOpts, onChange: setVideoOpts }) })
|
|
956
939
|
] }),
|
|
957
940
|
/* @__PURE__ */ jsxs("div", { className: "flex gap-2 mt-1", children: [
|
|
958
941
|
/* @__PURE__ */ jsx(
|
|
959
942
|
"button",
|
|
960
943
|
{
|
|
961
|
-
className: "inline-flex items-center justify-center gap-1.5 text-sm font-bold py-2.5 px-4 rounded-xl border border-slate-200 bg-transparent text-slate-900 cursor-pointer transition-colors hover:bg-slate-100",
|
|
962
944
|
onClick: clearStaging,
|
|
945
|
+
style: { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: 6, fontSize: 14, fontWeight: 700, padding: "10px 16px", borderRadius: "var(--silo-radius)", border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text)", cursor: "pointer" },
|
|
963
946
|
children: "Cancelar"
|
|
964
947
|
}
|
|
965
948
|
),
|
|
966
949
|
/* @__PURE__ */ jsx(
|
|
967
950
|
"button",
|
|
968
951
|
{
|
|
969
|
-
className: "flex-1 inline-flex items-center justify-center gap-1.5 text-sm font-bold py-2.5 px-4 rounded-xl border-transparent bg-indigo-500 text-white cursor-pointer transition-opacity hover:opacity-90",
|
|
970
952
|
onClick: handleConfirmUpload,
|
|
953
|
+
style: { flex: 1, display: "inline-flex", alignItems: "center", justifyContent: "center", gap: 6, fontSize: 14, fontWeight: 700, padding: "10px 16px", borderRadius: "var(--silo-radius)", border: "none", background: "var(--silo-accent)", color: "#fff", cursor: "pointer" },
|
|
971
954
|
children: staged.length > 1 ? `Enviar ${staged.length} arquivos` : "Enviar arquivo"
|
|
972
955
|
}
|
|
973
956
|
)
|
|
974
957
|
] })
|
|
975
958
|
] }),
|
|
976
|
-
isSingleUploading && !isBatch && (renderProgress ? renderProgress(singleProgress) : /* @__PURE__ */ jsxs("div", {
|
|
977
|
-
/* @__PURE__ */ jsxs("div", {
|
|
978
|
-
/* @__PURE__ */ jsx("span", {
|
|
979
|
-
/* @__PURE__ */ jsxs("span", {
|
|
959
|
+
isSingleUploading && !isBatch && (renderProgress ? renderProgress(singleProgress) : /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8, padding: "12px 16px", background: "var(--silo-bg)", borderRadius: "var(--silo-radius)", border: "1px solid var(--silo-border)" }, children: [
|
|
960
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
|
|
961
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 13, fontWeight: 600, color: "var(--silo-text)" }, children: uploadLabel3(single.state.status, singleProgress) }),
|
|
962
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: 13, fontWeight: 700, color: "var(--silo-accent)" }, children: [
|
|
980
963
|
singleProgress,
|
|
981
964
|
"%"
|
|
982
965
|
] })
|
|
@@ -990,17 +973,17 @@ function FileUploader({
|
|
|
990
973
|
const isPaused = st.status === "paused";
|
|
991
974
|
const isDone = st.status === "done";
|
|
992
975
|
const isErr = st.status === "error";
|
|
993
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
994
|
-
/* @__PURE__ */ jsxs("div", {
|
|
995
|
-
/* @__PURE__ */ jsx("span", {
|
|
996
|
-
/* @__PURE__ */ jsxs("div", {
|
|
997
|
-
/* @__PURE__ */ jsx("div", {
|
|
998
|
-
/* @__PURE__ */ jsx("div", {
|
|
976
|
+
return /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "stretch", gap: 8, padding: "12px 14px", background: "var(--silo-bg)", borderRadius: "var(--silo-radius)", border: "1px solid var(--silo-border)" }, children: [
|
|
977
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
|
|
978
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 18, flexShrink: 0 }, children: getFileIcon(f.file.type) }),
|
|
979
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
980
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 13, fontWeight: 600, color: "var(--silo-text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: f.file.name }),
|
|
981
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--silo-text-muted)" }, children: formatBytes(f.file.size) })
|
|
999
982
|
] }),
|
|
1000
|
-
isDone && /* @__PURE__ */ jsx("span", {
|
|
1001
|
-
isErr && /* @__PURE__ */ jsx("span", {
|
|
1002
|
-
!isDone && !isErr && /* @__PURE__ */ jsx("span", {
|
|
1003
|
-
!isDone && !isErr && f.fileId && (isPaused ? /* @__PURE__ */ jsx("button", {
|
|
983
|
+
isDone && /* @__PURE__ */ jsx("span", { style: { fontSize: 18, flexShrink: 0 }, children: "\u2705" }),
|
|
984
|
+
isErr && /* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 600, color: "var(--silo-error)", flexShrink: 0 }, children: "Erro no envio" }),
|
|
985
|
+
!isDone && !isErr && /* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 700, flexShrink: 0, color: isPaused ? "var(--silo-text-muted)" : "var(--silo-accent)" }, children: isPaused ? "Pausado" : `${p}%` }),
|
|
986
|
+
!isDone && !isErr && f.fileId && (isPaused ? /* @__PURE__ */ jsx("button", { style: { fontSize: 11, fontWeight: 600, padding: "2px 10px", borderRadius: 6, border: "none", background: "#22c55e", color: "#fff", cursor: "pointer" }, onClick: () => batch.resumeFile(f.fileId), children: "Retomar" }) : st.status === "uploading" ? /* @__PURE__ */ jsx("button", { style: { fontSize: 11, fontWeight: 600, padding: "2px 10px", borderRadius: 6, border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text)", cursor: "pointer" }, onClick: () => batch.pauseFile(f.fileId), children: "Pausar" }) : null)
|
|
1004
987
|
] }),
|
|
1005
988
|
!isDone && !isErr && /* @__PURE__ */ jsx(ProgressBar, { progress: p })
|
|
1006
989
|
] }, i);
|
|
@@ -1009,51 +992,51 @@ function FileUploader({
|
|
|
1009
992
|
batch.state.status !== "done" && /* @__PURE__ */ jsx(
|
|
1010
993
|
"button",
|
|
1011
994
|
{
|
|
1012
|
-
className: `flex-1 inline-flex items-center justify-center gap-1.5 text-sm font-bold py-2.5 px-4 rounded-xl border-transparent text-white cursor-pointer hover:opacity-90${isBatchUploading ? "bg-amber-500" : "bg-emerald-500"}`,
|
|
1013
995
|
onClick: isBatchUploading ? batch.pauseAll : batch.resumeAll,
|
|
996
|
+
style: { flex: 1, display: "inline-flex", alignItems: "center", justifyContent: "center", gap: 6, fontSize: 14, fontWeight: 700, padding: "10px 16px", borderRadius: "var(--silo-radius)", border: "none", background: isBatchUploading ? "#f59e0b" : "#22c55e", color: "#fff", cursor: "pointer" },
|
|
1014
997
|
children: isBatchUploading ? "\u23F8 Pausar tudo" : "\u25B6 Retomar tudo"
|
|
1015
998
|
}
|
|
1016
999
|
),
|
|
1017
1000
|
/* @__PURE__ */ jsx(
|
|
1018
1001
|
"button",
|
|
1019
1002
|
{
|
|
1020
|
-
className: `inline-flex items-center justify-center gap-1.5 text-sm font-bold py-2.5 px-4 rounded-xl border-transparent text-white cursor-pointer hover:opacity-90${batch.state.status === "done" ? "bg-indigo-500" : "bg-red-500/90"}`,
|
|
1021
1003
|
onClick: batch.state.status === "done" ? batch.reset : batch.abortAll,
|
|
1004
|
+
style: { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: 6, fontSize: 14, fontWeight: 700, padding: "10px 16px", borderRadius: "var(--silo-radius)", border: "none", background: batch.state.status === "done" ? "var(--silo-accent)" : "#ef4444cc", color: "#fff", cursor: "pointer" },
|
|
1022
1005
|
children: batch.state.status === "done" ? "Enviar mais arquivos" : "Cancelar"
|
|
1023
1006
|
}
|
|
1024
1007
|
)
|
|
1025
1008
|
] }),
|
|
1026
|
-
batch.state.status === "done" && /* @__PURE__ */ jsxs("div", {
|
|
1027
|
-
/* @__PURE__ */ jsx("span", {
|
|
1028
|
-
/* @__PURE__ */ jsx("span", {
|
|
1009
|
+
batch.state.status === "done" && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "10px 12px", background: "rgba(34,197,94,0.08)", borderRadius: "var(--silo-radius)", border: "1px solid rgba(34,197,94,0.2)" }, children: [
|
|
1010
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 20 }, children: "\u{1F389}" }),
|
|
1011
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 14, fontWeight: 600, color: "#16a34a" }, children: batch.state.files.length === 1 ? "Arquivo enviado com sucesso!" : `${batch.state.files.length} arquivos enviados com sucesso!` })
|
|
1029
1012
|
] })
|
|
1030
1013
|
] }),
|
|
1031
|
-
single.state.status === "done" && !renderSuccess && /* @__PURE__ */ jsxs("div", {
|
|
1032
|
-
/* @__PURE__ */ jsx("span", {
|
|
1033
|
-
/* @__PURE__ */ jsxs("div", {
|
|
1034
|
-
/* @__PURE__ */ jsx("div", {
|
|
1035
|
-
/* @__PURE__ */ jsx("div", {
|
|
1014
|
+
single.state.status === "done" && !renderSuccess && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "14px 16px", background: "rgba(34,197,94,0.08)", borderRadius: "var(--silo-radius)", border: "1px solid rgba(34,197,94,0.2)" }, children: [
|
|
1015
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 24 }, children: "\u2705" }),
|
|
1016
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
1017
|
+
/* @__PURE__ */ jsx("div", { style: { fontWeight: 700, fontSize: 14, color: "#16a34a" }, children: "Arquivo enviado com sucesso!" }),
|
|
1018
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--silo-text-muted)", marginTop: 2 }, children: formatBytes(single.state.result.size) })
|
|
1036
1019
|
] }),
|
|
1037
1020
|
/* @__PURE__ */ jsx(
|
|
1038
1021
|
"button",
|
|
1039
1022
|
{
|
|
1040
|
-
className: "inline-flex items-center justify-center text-xs font-semibold py-1 px-2.5 rounded-lg border border-green-500/30 text-green-700 bg-transparent cursor-pointer hover:bg-green-500/10 shrink-0",
|
|
1041
1023
|
onClick: single.reset,
|
|
1024
|
+
style: { display: "inline-flex", alignItems: "center", justifyContent: "center", fontSize: 12, fontWeight: 600, padding: "4px 10px", borderRadius: 6, border: "1px solid rgba(34,197,94,0.3)", color: "#16a34a", background: "transparent", cursor: "pointer", flexShrink: 0 },
|
|
1042
1025
|
children: "Enviar outro"
|
|
1043
1026
|
}
|
|
1044
1027
|
)
|
|
1045
1028
|
] }),
|
|
1046
|
-
single.state.status === "error" && !renderError && /* @__PURE__ */ jsxs("div", {
|
|
1047
|
-
/* @__PURE__ */ jsx("span", {
|
|
1048
|
-
/* @__PURE__ */ jsxs("div", {
|
|
1049
|
-
/* @__PURE__ */ jsx("div", {
|
|
1050
|
-
/* @__PURE__ */ jsx("div", {
|
|
1029
|
+
single.state.status === "error" && !renderError && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "14px 16px", background: "rgba(239,68,68,0.07)", borderRadius: "var(--silo-radius)", border: "1px solid rgba(239,68,68,0.2)" }, children: [
|
|
1030
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 22 }, children: "\u26A0\uFE0F" }),
|
|
1031
|
+
/* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
1032
|
+
/* @__PURE__ */ jsx("div", { style: { fontWeight: 700, fontSize: 13, color: "var(--silo-error)" }, children: "N\xE3o foi poss\xEDvel enviar o arquivo" }),
|
|
1033
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--silo-text-muted)", marginTop: 2 }, children: single.state.error.message })
|
|
1051
1034
|
] }),
|
|
1052
1035
|
/* @__PURE__ */ jsx(
|
|
1053
1036
|
"button",
|
|
1054
1037
|
{
|
|
1055
|
-
className: "inline-flex items-center justify-center text-xs font-semibold py-1 px-2.5 rounded-lg border border-red-500/30 text-red-500 bg-transparent cursor-pointer hover:bg-red-500/10 shrink-0",
|
|
1056
1038
|
onClick: single.reset,
|
|
1039
|
+
style: { display: "inline-flex", alignItems: "center", justifyContent: "center", fontSize: 12, fontWeight: 600, padding: "4px 10px", borderRadius: 6, border: "1px solid rgba(239,68,68,0.3)", color: "var(--silo-error)", background: "transparent", cursor: "pointer", flexShrink: 0 },
|
|
1057
1040
|
children: "Tentar novamente"
|
|
1058
1041
|
}
|
|
1059
1042
|
)
|