@geekapps/silo-elements-nextjs 0.1.4 → 0.1.6

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.
@@ -375,6 +375,14 @@ var DEFAULT_VIDEO_OPTS = {
375
375
  codec: "h264",
376
376
  transcoding: "auto"
377
377
  };
378
+ function uploadLabel(status, progress) {
379
+ if (status === "preparing") return "Preparando\u2026";
380
+ if (status === "completing") return "Concluindo\u2026";
381
+ if (progress < 30) return "Iniciando envio\u2026";
382
+ if (progress < 70) return "Enviando\u2026";
383
+ if (progress < 95) return "Quase l\xE1\u2026";
384
+ return "Finalizando\u2026";
385
+ }
378
386
  function FileUploader({
379
387
  bucket,
380
388
  visibility = "private",
@@ -423,11 +431,8 @@ function FileUploader({
423
431
  function setRename(index, name, files) {
424
432
  setRenames((prev) => {
425
433
  const next = new Map(prev);
426
- if (name.trim() && name.trim() !== files[index]?.name) {
427
- next.set(index, name.trim());
428
- } else {
429
- next.delete(index);
430
- }
434
+ if (name.trim() && name.trim() !== files[index]?.name) next.set(index, name.trim());
435
+ else next.delete(index);
431
436
  return next;
432
437
  });
433
438
  }
@@ -441,8 +446,7 @@ function FileUploader({
441
446
  const effectiveVideo = showVideoOptions ? videoOpts : video ?? videoOpts;
442
447
  if (multiple && files.length > 1) {
443
448
  try {
444
- const opts = { ...bucket !== void 0 && { bucket }, visibility, image: effectiveImage, video: effectiveVideo };
445
- const results = await batch.upload(files, opts);
449
+ const results = await batch.upload(files, { ...bucket !== void 0 && { bucket }, visibility, image: effectiveImage, video: effectiveVideo });
446
450
  onBatchUpload?.(results);
447
451
  results.forEach((r) => onUpload?.(r));
448
452
  } catch (err) {
@@ -452,22 +456,20 @@ function FileUploader({
452
456
  const file = files[0];
453
457
  if (!file) return;
454
458
  try {
455
- const opts = { ...bucket !== void 0 && { bucket }, visibility, image: effectiveImage, video: effectiveVideo };
456
- const result = await single.upload(file, opts);
459
+ const result = await single.upload(file, { ...bucket !== void 0 && { bucket }, visibility, image: effectiveImage, video: effectiveVideo });
457
460
  if (result) onUpload?.(result);
458
461
  } catch (err) {
459
462
  onError?.(err instanceof Error ? err : new Error(String(err)));
460
463
  }
461
464
  }
462
- }, [single, batch, multiple, bucket, visibility, image, video, onUpload, onBatchUpload, onError]);
465
+ }, [single, batch, multiple, bucket, visibility, image, video, imageOpts, videoOpts, showImageOptions, showVideoOptions, onUpload, onBatchUpload, onError]);
463
466
  const handleFiles = useCallback(async (files) => {
464
- if (allowRename) {
467
+ const needsStaging = allowRename || showImageOptions && files.some((f) => f.type.startsWith("image/")) || showVideoOptions && files.some((f) => f.type.startsWith("video/"));
468
+ if (needsStaging) {
465
469
  setStaged(files);
466
470
  setRenames(/* @__PURE__ */ new Map());
467
- } else {
468
- await doUpload(files);
469
- }
470
- }, [allowRename, doUpload]);
471
+ } else await doUpload(files);
472
+ }, [allowRename, showImageOptions, showVideoOptions, doUpload]);
471
473
  async function handleConfirmUpload() {
472
474
  if (!staged) return;
473
475
  const filesToUpload = staged.map((f, i) => {
@@ -497,21 +499,22 @@ function FileUploader({
497
499
  onFiles: handleFiles,
498
500
  style: { padding: "28px 24px", textAlign: "center" },
499
501
  children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: "8px" }, children: [
500
- renderIcon ? renderIcon() : /* @__PURE__ */ jsx("svg", { width: "40", height: "40", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", style: { color: "var(--silo-text-muted)", opacity: 0.6 }, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M9 13h6m-3-3v6m5 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) }),
502
+ renderIcon ? renderIcon() : /* @__PURE__ */ jsx("svg", { width: "40", height: "40", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", style: { color: "var(--silo-text-muted)", opacity: 0.5 }, 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" }) }),
501
503
  children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
502
- /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: "var(--silo-text)" }, children: multiple ? "Arraste arquivos aqui" : "Arraste o arquivo aqui" }),
503
- /* @__PURE__ */ jsx("span", { style: { fontSize: "13px", color: "var(--silo-text-muted)" }, children: "ou clique para selecionar" }),
504
- maxSize && /* @__PURE__ */ jsxs("span", { style: { fontSize: "12px", color: "var(--silo-text-muted)" }, children: [
505
- "M\xE1x ",
504
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 700, fontSize: 15, color: "var(--silo-text)" }, children: multiple ? "Arraste seus arquivos aqui" : "Arraste seu arquivo aqui" }),
505
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 13, color: "var(--silo-text-muted)" }, children: "ou clique para escolher do seu dispositivo" }),
506
+ maxSize && /* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: "var(--silo-text-muted)" }, children: [
507
+ "Tamanho m\xE1ximo: ",
506
508
  formatBytes(maxSize)
507
509
  ] })
508
510
  ] })
509
511
  ] })
510
512
  }
511
513
  ),
512
- staged && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: [
513
- staged.map((f, i) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "10px", padding: "8px 10px", backgroundColor: "var(--silo-bg)", borderRadius: "8px", border: "1px solid var(--silo-border)" }, children: [
514
- /* @__PURE__ */ jsx("span", { style: { fontSize: "16px", flexShrink: 0 }, children: getFileIcon(f.type) }),
514
+ staged && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
515
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 13, fontWeight: 600, color: "var(--silo-text-muted)", marginBottom: 2 }, children: staged.length === 1 ? "1 arquivo selecionado" : `${staged.length} arquivos selecionados` }),
516
+ staged.map((f, i) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "10px 12px", backgroundColor: "var(--silo-bg)", borderRadius: 10, border: "1px solid var(--silo-border)" }, children: [
517
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 20, flexShrink: 0 }, children: getFileIcon(f.type) }),
515
518
  /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
516
519
  editingIndex === i ? /* @__PURE__ */ jsx(
517
520
  "input",
@@ -530,28 +533,28 @@ function FileUploader({
530
533
  }
531
534
  if (e.key === "Escape") setEditingIndex(null);
532
535
  },
533
- style: { width: "100%", fontSize: "13px", fontWeight: 500, border: "1px solid var(--silo-border-active, #6366f1)", borderRadius: "5px", padding: "2px 6px", outline: "none", background: "var(--silo-bg)", color: "var(--silo-text)", fontFamily: "var(--silo-font)" }
536
+ style: { width: "100%", fontSize: 13, fontWeight: 500, border: "1px solid var(--silo-accent, #6366f1)", borderRadius: 5, padding: "2px 8px", outline: "none", background: "var(--silo-bg)", color: "var(--silo-text)", fontFamily: "var(--silo-font)" }
534
537
  }
535
538
  ) : /* @__PURE__ */ jsxs(
536
539
  "div",
537
540
  {
538
- onClick: () => setEditingIndex(i),
539
- title: "Clique para renomear",
540
- style: { fontSize: "13px", fontWeight: 500, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", cursor: "text", color: "var(--silo-text)" },
541
+ style: { fontSize: 13, fontWeight: 600, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--silo-text)", cursor: allowRename ? "text" : "default" },
542
+ onClick: () => allowRename && setEditingIndex(i),
543
+ title: allowRename ? "Clique para renomear" : void 0,
541
544
  children: [
542
545
  effectiveName(i, staged),
543
546
  renames.has(i) && /* @__PURE__ */ jsx("span", { style: { marginLeft: 6, fontSize: 10, color: "var(--silo-accent)", fontWeight: 700 }, children: "renomeado" })
544
547
  ]
545
548
  }
546
549
  ),
547
- /* @__PURE__ */ jsx("div", { style: { fontSize: "11px", color: "var(--silo-text-muted)" }, children: formatBytes(f.size) })
550
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--silo-text-muted)", marginTop: 1 }, children: formatBytes(f.size) })
548
551
  ] }),
549
- /* @__PURE__ */ jsx(
552
+ allowRename && /* @__PURE__ */ jsx(
550
553
  "button",
551
554
  {
552
555
  onClick: () => setEditingIndex(i),
553
556
  title: "Renomear",
554
- style: { background: "none", border: "none", cursor: "pointer", fontSize: "13px", color: "var(--silo-text-muted)", padding: "0 2px", flexShrink: 0 },
557
+ style: { background: "none", border: "none", cursor: "pointer", fontSize: 14, color: "var(--silo-text-muted)", padding: "0 4px", flexShrink: 0 },
555
558
  children: "\u270F\uFE0F"
556
559
  }
557
560
  ),
@@ -560,39 +563,28 @@ function FileUploader({
560
563
  {
561
564
  onClick: () => {
562
565
  const next = staged.filter((_, j) => j !== i);
563
- if (next.length === 0) {
564
- clearStaging();
565
- } else {
566
- setStaged(next);
567
- }
566
+ if (next.length === 0) clearStaging();
567
+ else setStaged(next);
568
568
  },
569
- style: { background: "none", border: "none", cursor: "pointer", fontSize: "16px", color: "var(--silo-text-muted)", padding: "0 4px", lineHeight: 1, flexShrink: 0 },
569
+ style: { background: "none", border: "none", cursor: "pointer", fontSize: 18, color: "var(--silo-text-muted)", padding: "0 4px", lineHeight: 1, flexShrink: 0 },
570
570
  children: "\xD7"
571
571
  }
572
572
  )
573
573
  ] }, i)),
574
- showImageOptions && staged.some((f) => f.type.startsWith("image/")) && /* @__PURE__ */ jsx(
575
- ImageOptions,
576
- {
577
- value: imageOpts,
578
- onChange: setImageOpts,
579
- style: { padding: "12px 14px", borderRadius: 8, border: "1px solid var(--silo-border)", background: "var(--silo-bg-hover, #f8fafc)", marginTop: 4 }
580
- }
581
- ),
582
- showVideoOptions && staged.some((f) => f.type.startsWith("video/")) && /* @__PURE__ */ jsx(
583
- VideoOptions,
584
- {
585
- value: videoOpts,
586
- onChange: setVideoOpts,
587
- style: { padding: "12px 14px", borderRadius: 8, border: "1px solid var(--silo-border)", background: "var(--silo-bg-hover, #f8fafc)", marginTop: 4 }
588
- }
589
- ),
590
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", marginTop: "4px" }, children: [
574
+ showImageOptions && staged.some((f) => f.type.startsWith("image/")) && /* @__PURE__ */ jsxs("div", { style: { borderRadius: 10, border: "1px solid var(--silo-border)", overflow: "hidden" }, children: [
575
+ /* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", background: "var(--silo-bg-hover, #f1f5f9)", fontSize: 12, fontWeight: 700, color: "var(--silo-text-muted)", letterSpacing: "0.04em" }, children: "\u{1F5BC}\uFE0F Configura\xE7\xF5es de imagem" }),
576
+ /* @__PURE__ */ jsx(ImageOptions, { value: imageOpts, onChange: setImageOpts, style: { padding: "12px 14px" } })
577
+ ] }),
578
+ showVideoOptions && staged.some((f) => f.type.startsWith("video/")) && /* @__PURE__ */ jsxs("div", { style: { borderRadius: 10, border: "1px solid var(--silo-border)", overflow: "hidden" }, children: [
579
+ /* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", background: "var(--silo-bg-hover, #f1f5f9)", fontSize: 12, fontWeight: 700, color: "var(--silo-text-muted)", letterSpacing: "0.04em" }, children: "\u{1F3AC} Configura\xE7\xF5es de v\xEDdeo" }),
580
+ /* @__PURE__ */ jsx(VideoOptions, { value: videoOpts, onChange: setVideoOpts, style: { padding: "12px 14px" } })
581
+ ] }),
582
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, marginTop: 4 }, children: [
591
583
  /* @__PURE__ */ jsx(
592
584
  "button",
593
585
  {
594
586
  onClick: clearStaging,
595
- style: { padding: "8px 14px", borderRadius: "6px", border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text-muted)", fontSize: "13px", fontWeight: 600, cursor: "pointer" },
587
+ style: { padding: "10px 16px", borderRadius: 8, border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text-muted)", fontSize: 13, fontWeight: 600, cursor: "pointer" },
596
588
  children: "Cancelar"
597
589
  }
598
590
  ),
@@ -600,72 +592,82 @@ function FileUploader({
600
592
  "button",
601
593
  {
602
594
  onClick: handleConfirmUpload,
603
- style: { flex: 1, padding: "8px", borderRadius: "6px", border: "none", backgroundColor: "var(--silo-accent)", color: "#fff", fontSize: "13px", fontWeight: 600, cursor: "pointer" },
595
+ style: { flex: 1, padding: "10px", borderRadius: 8, border: "none", background: "var(--silo-accent, #6366f1)", color: "#fff", fontSize: 14, fontWeight: 700, cursor: "pointer" },
604
596
  children: staged.length > 1 ? `Enviar ${staged.length} arquivos` : "Enviar arquivo"
605
597
  }
606
598
  )
607
599
  ] })
608
600
  ] }),
609
- isSingleUploading && !isBatch && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: renderProgress ? renderProgress(singleProgress) : /* @__PURE__ */ jsxs(Fragment, { children: [
610
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", fontSize: "13px", color: "var(--silo-text-muted)" }, children: [
611
- /* @__PURE__ */ jsx("span", { children: single.state.status === "completing" ? "Finalizando\u2026" : single.state.status === "preparing" ? "Preparando\u2026" : `Parte ${single.state.part} de ${single.state.totalParts}` }),
612
- /* @__PURE__ */ jsxs("span", { children: [
601
+ isSingleUploading && !isBatch && (renderProgress ? renderProgress(singleProgress) : /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8, padding: "16px", borderRadius: 10, border: "1px solid var(--silo-border)", background: "var(--silo-bg)" }, children: [
602
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
603
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 13, fontWeight: 600, color: "var(--silo-text)" }, children: uploadLabel(single.state.status, singleProgress) }),
604
+ /* @__PURE__ */ jsxs("span", { style: { fontSize: 13, fontWeight: 700, color: "var(--silo-accent, #6366f1)" }, children: [
613
605
  singleProgress,
614
606
  "%"
615
607
  ] })
616
608
  ] }),
617
609
  /* @__PURE__ */ jsx(ProgressBar, { progress: singleProgress })
618
- ] }) }),
619
- isBatch && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
610
+ ] })),
611
+ isBatch && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
620
612
  batch.state.files.map((f, i) => {
621
613
  const st = f.status;
622
614
  const p = st.status === "uploading" ? st.progress : st.status === "paused" ? st.progress : st.status === "done" ? 100 : st.status === "completing" ? 99 : 0;
623
615
  const isPaused = st.status === "paused";
624
616
  const isDone = st.status === "done";
625
617
  const isErr = st.status === "error";
626
- return /* @__PURE__ */ jsxs("div", { style: { padding: "10px 12px", backgroundColor: "var(--silo-bg)", borderRadius: "8px", border: "1px solid var(--silo-border)" }, children: [
627
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", marginBottom: isDone || isErr ? 0 : "6px" }, children: [
628
- /* @__PURE__ */ jsx("span", { style: { fontSize: "16px" }, children: getFileIcon(f.file.type) }),
618
+ return /* @__PURE__ */ jsxs("div", { style: { padding: "12px 14px", backgroundColor: "var(--silo-bg)", borderRadius: 10, border: "1px solid var(--silo-border)" }, children: [
619
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, marginBottom: isDone || isErr ? 0 : 8 }, children: [
620
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 18, flexShrink: 0 }, children: getFileIcon(f.file.type) }),
629
621
  /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
630
- /* @__PURE__ */ jsx("div", { style: { fontSize: "13px", fontWeight: 500, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: f.file.name }),
631
- /* @__PURE__ */ jsx("div", { style: { fontSize: "11px", color: "var(--silo-text-muted)" }, children: formatBytes(f.file.size) })
622
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 13, fontWeight: 600, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--silo-text)" }, children: f.file.name }),
623
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--silo-text-muted)" }, children: formatBytes(f.file.size) })
632
624
  ] }),
633
- /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", fontWeight: 600, color: isDone ? "#16a34a" : isErr ? "#ef4444" : isPaused ? "#f59e0b" : "var(--silo-accent)", flexShrink: 0 }, children: isDone ? "\u2713" : isErr ? "Erro" : isPaused ? `Pausado ${p}%` : `${p}%` }),
634
- !isDone && !isErr && f.fileId && (isPaused ? /* @__PURE__ */ jsx("button", { onClick: () => batch.resumeFile(f.fileId), style: { fontSize: "11px", padding: "2px 8px", borderRadius: "4px", border: "none", backgroundColor: "#10b981", color: "#fff", cursor: "pointer" }, children: "Retomar" }) : st.status === "uploading" ? /* @__PURE__ */ jsx("button", { onClick: () => batch.pauseFile(f.fileId), style: { fontSize: "11px", padding: "2px 8px", borderRadius: "4px", border: "none", backgroundColor: "#f59e0b", color: "#fff", cursor: "pointer" }, children: "Pausar" }) : null)
625
+ isDone && /* @__PURE__ */ jsx("span", { style: { fontSize: 18, flexShrink: 0 }, children: "\u2705" }),
626
+ isErr && /* @__PURE__ */ jsx("span", { style: { fontSize: 12, color: "#ef4444", fontWeight: 600, flexShrink: 0 }, children: "Erro no envio" }),
627
+ !isDone && !isErr && /* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 700, color: isPaused ? "#f59e0b" : "var(--silo-accent, #6366f1)", flexShrink: 0 }, children: isPaused ? "Pausado" : `${p}%` }),
628
+ !isDone && !isErr && f.fileId && (isPaused ? /* @__PURE__ */ jsx("button", { onClick: () => batch.resumeFile(f.fileId), style: { fontSize: 11, padding: "3px 10px", borderRadius: 6, border: "none", background: "#10b981", color: "#fff", cursor: "pointer", fontWeight: 600 }, children: "Retomar" }) : st.status === "uploading" ? /* @__PURE__ */ jsx("button", { onClick: () => batch.pauseFile(f.fileId), style: { fontSize: 11, padding: "3px 10px", borderRadius: 6, border: "1px solid var(--silo-border)", background: "transparent", color: "var(--silo-text-muted)", cursor: "pointer" }, children: "Pausar" }) : null)
635
629
  ] }),
636
630
  !isDone && !isErr && /* @__PURE__ */ jsx(ProgressBar, { progress: p })
637
631
  ] }, i);
638
632
  }),
639
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", marginTop: "4px" }, children: [
633
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8 }, children: [
640
634
  batch.state.status !== "done" && /* @__PURE__ */ jsx(
641
635
  "button",
642
636
  {
643
637
  onClick: isBatchUploading ? batch.pauseAll : batch.resumeAll,
644
- style: { flex: 1, padding: "8px", borderRadius: "6px", border: "none", backgroundColor: isBatchUploading ? "#f59e0b" : "#10b981", color: "#fff", fontSize: "13px", fontWeight: 600, cursor: "pointer" },
645
- children: isBatchUploading ? "Pausar tudo" : "Retomar tudo"
638
+ style: { flex: 1, padding: "10px", borderRadius: 8, border: "none", background: isBatchUploading ? "#f59e0b" : "#10b981", color: "#fff", fontSize: 13, fontWeight: 700, cursor: "pointer" },
639
+ children: isBatchUploading ? "\u23F8 Pausar tudo" : "\u25B6 Retomar tudo"
646
640
  }
647
641
  ),
648
642
  /* @__PURE__ */ jsx(
649
643
  "button",
650
644
  {
651
645
  onClick: batch.state.status === "done" ? batch.reset : batch.abortAll,
652
- style: { padding: "8px 14px", borderRadius: "6px", border: "none", backgroundColor: batch.state.status === "done" ? "var(--silo-accent)" : "rgba(239,68,68,0.1)", color: batch.state.status === "done" ? "#fff" : "#ef4444", fontSize: "13px", fontWeight: 600, cursor: "pointer" },
653
- children: batch.state.status === "done" ? "Novo upload" : "Cancelar"
646
+ style: { padding: "10px 16px", borderRadius: 8, border: "none", background: batch.state.status === "done" ? "var(--silo-accent, #6366f1)" : "rgba(239,68,68,0.1)", color: batch.state.status === "done" ? "#fff" : "#ef4444", fontSize: 13, fontWeight: 700, cursor: "pointer" },
647
+ children: batch.state.status === "done" ? "Enviar mais arquivos" : "Cancelar"
654
648
  }
655
649
  )
650
+ ] }),
651
+ batch.state.status === "done" && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "12px 14px", borderRadius: 10, background: "rgba(34,197,94,0.08)", border: "1px solid rgba(34,197,94,0.2)" }, children: [
652
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 20 }, children: "\u{1F389}" }),
653
+ /* @__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!` })
656
654
  ] })
657
655
  ] }),
658
- single.state.status === "done" && !renderSuccess && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "10px", padding: "10px 14px", borderRadius: "8px", backgroundColor: "rgba(34,197,94,0.08)", border: "1px solid rgba(34,197,94,0.2)", fontSize: "14px" }, children: [
659
- /* @__PURE__ */ jsx("svg", { width: "18", height: "18", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", style: { color: "#22c55e", flexShrink: 0 }, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }),
656
+ single.state.status === "done" && !renderSuccess && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "14px 16px", borderRadius: 10, background: "rgba(34,197,94,0.08)", border: "1px solid rgba(34,197,94,0.2)" }, children: [
657
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 24 }, children: "\u2705" }),
660
658
  /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
661
- /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, color: "var(--silo-text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: single.state.result.key }),
662
- /* @__PURE__ */ jsx("div", { style: { fontSize: "12px", color: "var(--silo-text-muted)" }, children: formatBytes(single.state.result.size) })
659
+ /* @__PURE__ */ jsx("div", { style: { fontWeight: 700, fontSize: 14, color: "#16a34a" }, children: "Arquivo enviado com sucesso!" }),
660
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--silo-text-muted)", marginTop: 2 }, children: formatBytes(single.state.result.size) })
663
661
  ] }),
664
- /* @__PURE__ */ jsx("button", { onClick: single.reset, style: { background: "none", border: "none", cursor: "pointer", fontSize: "12px", color: "var(--silo-text-muted)", flexShrink: 0 }, children: "Enviar outro" })
662
+ /* @__PURE__ */ jsx("button", { onClick: single.reset, style: { background: "none", border: "1px solid rgba(34,197,94,0.3)", borderRadius: 6, cursor: "pointer", fontSize: 12, fontWeight: 600, color: "#16a34a", padding: "4px 10px", flexShrink: 0 }, children: "Enviar outro" })
665
663
  ] }),
666
- single.state.status === "error" && !renderError && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", padding: "10px 14px", borderRadius: "8px", backgroundColor: "rgba(239,68,68,0.1)", color: "var(--silo-error, #ef4444)", fontSize: "14px" }, children: [
667
- /* @__PURE__ */ jsx("span", { children: single.state.error.message }),
668
- /* @__PURE__ */ jsx("button", { onClick: single.reset, style: { marginLeft: "auto", background: "none", border: "none", cursor: "pointer", fontSize: "12px" }, children: "Tentar novamente" })
664
+ single.state.status === "error" && !renderError && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "14px 16px", borderRadius: 10, background: "rgba(239,68,68,0.07)", border: "1px solid rgba(239,68,68,0.2)" }, children: [
665
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 22 }, children: "\u26A0\uFE0F" }),
666
+ /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
667
+ /* @__PURE__ */ jsx("div", { style: { fontWeight: 700, fontSize: 13, color: "#ef4444" }, children: "N\xE3o foi poss\xEDvel enviar o arquivo" }),
668
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--silo-text-muted)", marginTop: 2 }, children: single.state.error.message })
669
+ ] }),
670
+ /* @__PURE__ */ jsx("button", { onClick: single.reset, style: { background: "none", border: "1px solid rgba(239,68,68,0.3)", borderRadius: 6, cursor: "pointer", fontSize: 12, fontWeight: 600, color: "#ef4444", padding: "4px 10px", flexShrink: 0 }, children: "Tentar novamente" })
669
671
  ] })
670
672
  ] });
671
673
  }