@retinalabsllc/zairusjs 1.1.0 → 1.2.0

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/index.d.mts CHANGED
@@ -885,7 +885,6 @@ interface UniversalDriveViewProps {
885
885
  items: DriveItem[];
886
886
  uploadQueue: UploadQueueJob[];
887
887
  isLoading: boolean;
888
- isTrashView: boolean;
889
888
  searchQuery: string;
890
889
  currentPage: number;
891
890
  totalPages: number;
@@ -894,15 +893,14 @@ interface UniversalDriveViewProps {
894
893
  onCreateFolder: (name: string) => Promise<void>;
895
894
  onUploadFiles: (files: FileList) => Promise<void>;
896
895
  onMoveToTrash: (ids: string[]) => Promise<void>;
897
- onRestoreItems: (ids: string[]) => Promise<void>;
898
- onEmptyTrash: () => Promise<void>;
899
896
  onClearUploadQueue?: () => void;
900
897
  onPageChange: (page: number) => void;
901
- onToggleTrashView: () => void;
902
898
  onCopyItems: (ids: string[]) => void;
903
899
  onCutItems: (ids: string[]) => void;
904
900
  onPasteItems: () => Promise<void>;
905
901
  clipboardCount: number;
902
+ onOpenFile: (item: DriveItem) => void;
903
+ onShareItems: (items: DriveItem[]) => void;
906
904
  }
907
905
  declare const UniversalDriveView: React.FC<UniversalDriveViewProps>;
908
906
 
package/dist/index.d.ts CHANGED
@@ -885,7 +885,6 @@ interface UniversalDriveViewProps {
885
885
  items: DriveItem[];
886
886
  uploadQueue: UploadQueueJob[];
887
887
  isLoading: boolean;
888
- isTrashView: boolean;
889
888
  searchQuery: string;
890
889
  currentPage: number;
891
890
  totalPages: number;
@@ -894,15 +893,14 @@ interface UniversalDriveViewProps {
894
893
  onCreateFolder: (name: string) => Promise<void>;
895
894
  onUploadFiles: (files: FileList) => Promise<void>;
896
895
  onMoveToTrash: (ids: string[]) => Promise<void>;
897
- onRestoreItems: (ids: string[]) => Promise<void>;
898
- onEmptyTrash: () => Promise<void>;
899
896
  onClearUploadQueue?: () => void;
900
897
  onPageChange: (page: number) => void;
901
- onToggleTrashView: () => void;
902
898
  onCopyItems: (ids: string[]) => void;
903
899
  onCutItems: (ids: string[]) => void;
904
900
  onPasteItems: () => Promise<void>;
905
901
  clipboardCount: number;
902
+ onOpenFile: (item: DriveItem) => void;
903
+ onShareItems: (items: DriveItem[]) => void;
906
904
  }
907
905
  declare const UniversalDriveView: React.FC<UniversalDriveViewProps>;
908
906
 
package/dist/index.js CHANGED
@@ -3114,12 +3114,12 @@ var UniversalOverviewPage = ({
3114
3114
  },
3115
3115
  primaryAction.label,
3116
3116
  primaryAction.icon
3117
- ))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8" }, details.map((detail, idx) => /* @__PURE__ */ import_react56.default.createElement("div", { key: idx, className: "min-w-0" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1.5 uppercase" }, detail.label), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] text-black truncate" }, detail.value)))), alerts.map((alert2, idx) => {
3118
- const bgClass = alert2.type === "warning" ? "bg-amber-50/50" : alert2.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
3119
- const textClass = alert2.type === "warning" ? "text-amber-600" : alert2.type === "info" ? "text-blue-600" : "text-red-600";
3120
- const valClass = alert2.type === "warning" ? "text-amber-700" : alert2.type === "info" ? "text-blue-700" : "text-red-700";
3121
- const lblClass = alert2.type === "warning" ? "text-amber-400" : alert2.type === "info" ? "text-blue-400" : "text-red-400";
3122
- return /* @__PURE__ */ import_react56.default.createElement("div", { key: idx, className: `mt-4 p-5 rounded-xl flex flex-col gap-4 ${bgClass}` }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react56.default.createElement("span", { className: `text-[11px] tracking-widest uppercase ${textClass}` }, alert2.title)), alert2.items.map((item, itemIdx) => /* @__PURE__ */ import_react56.default.createElement("div", { key: itemIdx }, /* @__PURE__ */ import_react56.default.createElement("span", { className: `text-[11px] tracking-[0.2em] block mb-1 uppercase ${lblClass}` }, item.label), /* @__PURE__ */ import_react56.default.createElement("p", { className: `text-[13px] leading-relaxed ${valClass}` }, item.text))));
3117
+ ))), /* @__PURE__ */ import_react56.default.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8" }, details.map((detail, idx) => /* @__PURE__ */ import_react56.default.createElement("div", { key: idx, className: "min-w-0" }, /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1.5 uppercase" }, detail.label), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] text-black truncate" }, detail.value)))), alerts.map((alert, idx) => {
3118
+ const bgClass = alert.type === "warning" ? "bg-amber-50/50" : alert.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
3119
+ const textClass = alert.type === "warning" ? "text-amber-600" : alert.type === "info" ? "text-blue-600" : "text-red-600";
3120
+ const valClass = alert.type === "warning" ? "text-amber-700" : alert.type === "info" ? "text-blue-700" : "text-red-700";
3121
+ const lblClass = alert.type === "warning" ? "text-amber-400" : alert.type === "info" ? "text-blue-400" : "text-red-400";
3122
+ return /* @__PURE__ */ import_react56.default.createElement("div", { key: idx, className: `mt-4 p-5 rounded-xl flex flex-col gap-4 ${bgClass}` }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react56.default.createElement("span", { className: `text-[11px] tracking-widest uppercase ${textClass}` }, alert.title)), alert.items.map((item, itemIdx) => /* @__PURE__ */ import_react56.default.createElement("div", { key: itemIdx }, /* @__PURE__ */ import_react56.default.createElement("span", { className: `text-[11px] tracking-[0.2em] block mb-1 uppercase ${lblClass}` }, item.label), /* @__PURE__ */ import_react56.default.createElement("p", { className: `text-[13px] leading-relaxed ${valClass}` }, item.text))));
3123
3123
  }))));
3124
3124
  };
3125
3125
 
@@ -3358,7 +3358,6 @@ var UniversalDriveView = ({
3358
3358
  items,
3359
3359
  uploadQueue,
3360
3360
  isLoading,
3361
- isTrashView,
3362
3361
  searchQuery,
3363
3362
  currentPage,
3364
3363
  totalPages,
@@ -3367,15 +3366,14 @@ var UniversalDriveView = ({
3367
3366
  onCreateFolder,
3368
3367
  onUploadFiles,
3369
3368
  onMoveToTrash,
3370
- onRestoreItems,
3371
- onEmptyTrash,
3372
3369
  onClearUploadQueue,
3373
3370
  onPageChange,
3374
- onToggleTrashView,
3375
3371
  onCopyItems,
3376
3372
  onCutItems,
3377
3373
  onPasteItems,
3378
- clipboardCount
3374
+ clipboardCount,
3375
+ onOpenFile,
3376
+ onShareItems
3379
3377
  }) => {
3380
3378
  const [selectedIds, setSelectedIds] = (0, import_react65.useState)([]);
3381
3379
  const [isNewFolderModalOpen, setIsNewFolderModalOpen] = (0, import_react65.useState)(false);
@@ -3384,8 +3382,6 @@ var UniversalDriveView = ({
3384
3382
  const [localSearch, setLocalSearch] = (0, import_react65.useState)(searchQuery);
3385
3383
  const [isSearching, setIsSearching] = (0, import_react65.useState)(false);
3386
3384
  const [loadingFolderId, setLoadingFolderId] = (0, import_react65.useState)(null);
3387
- const [contextMenu, setContextMenu] = (0, import_react65.useState)(null);
3388
- const tableRef = (0, import_react65.useRef)(null);
3389
3385
  (0, import_react65.useEffect)(() => {
3390
3386
  if (localSearch !== searchQuery) setIsSearching(true);
3391
3387
  const delay = setTimeout(() => {
@@ -3397,11 +3393,6 @@ var UniversalDriveView = ({
3397
3393
  (0, import_react65.useEffect)(() => {
3398
3394
  if (!isLoading) setLoadingFolderId(null);
3399
3395
  }, [isLoading]);
3400
- (0, import_react65.useEffect)(() => {
3401
- const handleClickOutside = () => setContextMenu(null);
3402
- document.addEventListener("click", handleClickOutside);
3403
- return () => document.removeEventListener("click", handleClickOutside);
3404
- }, []);
3405
3396
  const formatBytes = (bytes) => {
3406
3397
  const num = Number(bytes);
3407
3398
  if (num === 0) return "0 Bytes";
@@ -3433,12 +3424,13 @@ var UniversalDriveView = ({
3433
3424
  setLoadingFolderId(item.id);
3434
3425
  setSelectedIds([]);
3435
3426
  onNavigateFolder(item.id);
3427
+ } else {
3428
+ onOpenFile(item);
3436
3429
  }
3437
3430
  };
3438
- const handleContextMenu = (e, itemId) => {
3431
+ const handleRightClickSelect = (e, itemId) => {
3439
3432
  e.preventDefault();
3440
- if (!selectedIds.includes(itemId)) setSelectedIds([itemId]);
3441
- setContextMenu({ x: e.clientX, y: e.clientY, itemId });
3433
+ setSelectedIds([itemId]);
3442
3434
  };
3443
3435
  const handleCreateFolderSubmit = async (e) => {
3444
3436
  e.preventDefault();
@@ -3451,21 +3443,16 @@ var UniversalDriveView = ({
3451
3443
  };
3452
3444
  const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
3453
3445
  const globalProgress = uploadQueue.length > 0 ? Math.round(uploadQueue.reduce((acc, job) => acc + job.progress, 0) / (uploadQueue.length * 100) * 100) : 0;
3454
- return /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col gap-6 max-w-5xl w-full mx-auto p-6 bg-white rounded-2xl animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react65.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4 pb-4 border-b border-neutral-100" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h1", { className: "text-xl text-black tracking-tight mb-1" }, " My Drive"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-xs text-neutral-500" }, "Secure cloud storage optimized for your workspace.")), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ import_react65.default.createElement(
3455
- "button",
3456
- {
3457
- onClick: onToggleTrashView,
3458
- title: "Trash",
3459
- className: `p-2.5 rounded-full transition-all outline-none flex items-center justify-center ${isTrashView ? "bg-red-50 text-red-600" : "bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100"}`
3460
- },
3461
- /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Delete02Icon, size: 18 })
3462
- ), !isTrashView && /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3446
+ const selectedItemsData = items.filter((i) => selectedIds.includes(i.id));
3447
+ return /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col gap-6 max-w-5xl w-full mx-auto p-6 bg-white rounded-2xl animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react65.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4 pb-4 border-b border-neutral-100" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h1", { className: "text-xl text-black tracking-tight mb-1" }, "Drive"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-xs text-neutral-500" }, "Secure cloud storage optimized for your workspace.")), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-2 shrink-0" }, selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3448
+ onShareItems(selectedItemsData);
3449
+ }, title: "Share", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Share01Icon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3463
3450
  onCopyItems(selectedIds);
3464
3451
  setSelectedIds([]);
3465
3452
  }, title: "Copy", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Copy01Icon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3466
3453
  onCutItems(selectedIds);
3467
3454
  setSelectedIds([]);
3468
- }, title: "Cut", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Scissor01Icon, size: 18 }))), clipboardCount > 0 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onPasteItems, title: `Paste ${clipboardCount} items`, className: "p-2.5 bg-black text-white hover:bg-neutral-800 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FilePasteIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" }), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => setIsNewFolderModalOpen(true), title: "New Folder", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FolderAddIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("label", { title: "Upload Files", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full cursor-pointer transition-all" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.CloudUploadIcon, size: 18 }), /* @__PURE__ */ import_react65.default.createElement("input", { type: "file", multiple: true, className: "hidden", onChange: (e) => e.target.files && onUploadFiles(e.target.files) }))))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ import_react65.default.createElement(
3455
+ }, title: "Cut", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Scissor01Icon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" })), clipboardCount > 0 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onPasteItems, title: `Paste ${clipboardCount} items`, className: "p-2.5 bg-black text-white hover:bg-neutral-800 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FilePasteIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => setIsNewFolderModalOpen(true), title: "New Folder", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FolderAddIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("label", { title: "Upload Files", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full cursor-pointer transition-all" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Upload02Icon, size: 18 }), /* @__PURE__ */ import_react65.default.createElement("input", { type: "file", multiple: true, className: "hidden", onChange: (e) => e.target.files && onUploadFiles(e.target.files) })))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ import_react65.default.createElement(
3469
3456
  "input",
3470
3457
  {
3471
3458
  type: "text",
@@ -3474,13 +3461,10 @@ var UniversalDriveView = ({
3474
3461
  value: localSearch,
3475
3462
  onChange: (e) => setLocalSearch(e.target.value)
3476
3463
  }
3477
- ), isSearching && /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute right-3 top-1/2 -translate-y-1/2" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 14, className: "animate-spin text-neutral-400" }))), selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-3 bg-neutral-50 border border-neutral-100 px-4 py-2 rounded-full animate-in fade-in duration-200" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-500 uppercase" }, selectedIds.length, " Selected"), isTrashView ? /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3478
- onRestoreItems(selectedIds);
3479
- setSelectedIds([]);
3480
- }, className: "text-emerald-600 hover:text-emerald-700 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.RestoreBinIcon, size: 14 }), " Restore") : /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3464
+ ), isSearching && /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute right-3 top-1/2 -translate-y-1/2" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 14, className: "animate-spin text-neutral-400" }))), selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-3 bg-neutral-50 border border-neutral-100 px-4 py-2 rounded-full animate-in fade-in duration-200" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-500 uppercase" }, selectedIds.length, " Selected"), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3481
3465
  onMoveToTrash(selectedIds);
3482
3466
  setSelectedIds([]);
3483
- }, className: "text-neutral-500 hover:text-red-600 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Delete02Icon, size: 14 }), " Move to Trash")), isTrashView && selectedIds.length === 0 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onEmptyTrash, className: "text-red-600 hover:text-red-700 p-2 text-xs flex items-center gap-2 outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Delete02Icon, size: 14 }), " Empty Trash")), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-1 border-b border-neutral-50 text-neutral-400 whitespace-nowrap" }, folderBreadcrumbs.map((crumb, idx) => /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ import_react65.default.createElement("span", null, "/"), /* @__PURE__ */ import_react65.default.createElement(
3467
+ }, className: "text-neutral-500 hover:text-red-600 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Delete02Icon, size: 14 }), " Trash"))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-1 border-b border-neutral-50 text-neutral-400 whitespace-nowrap" }, folderBreadcrumbs.map((crumb, idx) => /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ import_react65.default.createElement("span", null, "/"), /* @__PURE__ */ import_react65.default.createElement(
3484
3468
  "button",
3485
3469
  {
3486
3470
  onClick: () => {
@@ -3490,7 +3474,7 @@ var UniversalDriveView = ({
3490
3474
  className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black" : ""}`
3491
3475
  },
3492
3476
  crumb.name
3493
- )))), !isLoading && items.length === 0 && /* @__PURE__ */ import_react65.default.createElement("div", { className: "py-24 text-center flex flex-col items-center justify-center border border-dashed border-neutral-100 rounded-xl bg-neutral-50/50" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: isTrashView ? import_core_free_icons22.Delete02Icon : import_core_free_icons22.FolderIcon, size: 40, className: "text-neutral-300 mb-3" }), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-xs text-neutral-500" }, isTrashView ? "Trash is empty." : "This directory is empty.")), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full overflow-x-auto select-none flex-1", ref: tableRef }, /* @__PURE__ */ import_react65.default.createElement("table", { className: "w-full text-left border-collapse min-w-full" }, /* @__PURE__ */ import_react65.default.createElement("thead", null, /* @__PURE__ */ import_react65.default.createElement("tr", { className: "border-b border-neutral-100" }, /* @__PURE__ */ import_react65.default.createElement("th", { className: "w-10 p-3" }, /* @__PURE__ */ import_react65.default.createElement("input", { type: "checkbox", checked: selectedIds.length === items.length && items.length > 0, onChange: handleSelectAll, className: "rounded border-neutral-200 focus:ring-0 cursor-pointer" })), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Name"), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Modified"), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3 text-right" }, "Size"))), /* @__PURE__ */ import_react65.default.createElement("tbody", { className: "divide-y divide-neutral-50 relative" }, isLoading && items.length === 0 && /* @__PURE__ */ import_react65.default.createElement("tr", null, /* @__PURE__ */ import_react65.default.createElement("td", { colSpan: 4, className: "py-12 text-center" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, className: "animate-spin mx-auto text-neutral-400", size: 24 }))), items.map((item) => {
3477
+ )))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full overflow-x-auto select-none flex-1 relative min-h-75" }, /* @__PURE__ */ import_react65.default.createElement("table", { className: "w-full text-left border-collapse min-w-full relative z-10" }, /* @__PURE__ */ import_react65.default.createElement("thead", null, /* @__PURE__ */ import_react65.default.createElement("tr", { className: "border-b border-neutral-100 bg-white" }, /* @__PURE__ */ import_react65.default.createElement("th", { className: "w-10 p-3" }, /* @__PURE__ */ import_react65.default.createElement("input", { type: "checkbox", checked: selectedIds.length === items.length && items.length > 0, onChange: handleSelectAll, className: "rounded border-neutral-200 focus:ring-0 cursor-pointer" })), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Name"), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Modified"), /* @__PURE__ */ import_react65.default.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3 text-right" }, "Size"))), /* @__PURE__ */ import_react65.default.createElement("tbody", { className: "divide-y divide-neutral-50" }, items.length === 0 && !isLoading && /* @__PURE__ */ import_react65.default.createElement("tr", null, /* @__PURE__ */ import_react65.default.createElement("td", { colSpan: 4, className: "py-24 text-center" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex flex-col items-center justify-center" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FolderIcon, size: 40, className: "text-neutral-200 mb-3" }), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-xs text-neutral-400" }, "This directory is empty.")))), items.map((item) => {
3494
3478
  const isChecked = selectedIds.includes(item.id);
3495
3479
  return /* @__PURE__ */ import_react65.default.createElement(
3496
3480
  "tr",
@@ -3498,7 +3482,7 @@ var UniversalDriveView = ({
3498
3482
  key: item.id,
3499
3483
  onClick: (e) => handleRowClick(item.id, e),
3500
3484
  onDoubleClick: () => handleItemDoubleClick(item),
3501
- onContextMenu: (e) => handleContextMenu(e, item.id),
3485
+ onContextMenu: (e) => handleRightClickSelect(e, item.id),
3502
3486
  className: `hover:bg-neutral-50/70 transition-colors cursor-pointer group ${isChecked ? "bg-neutral-50" : ""}`
3503
3487
  },
3504
3488
  /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react65.default.createElement("input", { type: "checkbox", checked: isChecked, onChange: () => handleRowClick(item.id, { ctrlKey: true }), className: "rounded border-neutral-200 cursor-pointer" })),
@@ -3506,35 +3490,31 @@ var UniversalDriveView = ({
3506
3490
  /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3 text-xs text-neutral-500 whitespace-nowrap" }, formatDate3(item.updatedAt)),
3507
3491
  /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3 text-xs text-neutral-500 text-right whitespace-nowrap" }, formatBytes(item.size))
3508
3492
  );
3509
- })))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-between pt-4 border-t border-neutral-100" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", Math.max(1, totalPages)), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage <= 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.ArrowLeft01Icon, size: 14 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.ArrowRight01Icon, size: 14 })))), contextMenu && /* @__PURE__ */ import_react65.default.createElement(
3510
- "div",
3493
+ }))), isLoading && /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute inset-0 top-12 z-20 bg-white/60 backdrop-blur-[1px] flex items-start justify-center pt-20" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, className: "animate-spin text-neutral-400", size: 24 }))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-between pt-4 border-t border-neutral-100" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", Math.max(1, totalPages)), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage <= 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.ArrowLeft01Icon, size: 14 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.ArrowRight01Icon, size: 14 })))), activeJobs.length > 0 && /* @__PURE__ */ import_react65.default.createElement("div", { className: "fixed bottom-6 right-6 w-80 bg-white border border-neutral-200 shadow-2xl rounded-xl z-100 overflow-hidden flex flex-col animate-in slide-in-from-bottom-4 duration-300" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "p-4 border-b border-neutral-100 bg-neutral-50 flex items-center justify-between" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h4", { className: "text-xs text-black font-medium" }, "Processing Elements"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " active streams")), onClearUploadQueue && activeJobs.length === 0 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onClearUploadQueue, className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Cancel01Icon, size: 14 }))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full h-1 bg-neutral-100 relative" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "h-full transition-all duration-500 ease-out", style: { width: `${globalProgress}%`, background: "linear-gradient(to right, #f64b4d, #ffa360)" } })), /* @__PURE__ */ import_react65.default.createElement("div", { className: "max-h-40 overflow-y-auto divide-y divide-neutral-50 p-2" }, uploadQueue.map((job) => /* @__PURE__ */ import_react65.default.createElement("div", { key: job.id, className: "flex items-center justify-between p-2 text-[11px] gap-4" }, /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-black truncate flex-1 pr-2" }, job.name), /* @__PURE__ */ import_react65.default.createElement("div", { className: "shrink-0 whitespace-nowrap flex items-center gap-2" }, job.status === "COMPLETED" ? /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Tick01Icon, size: 12, className: "text-green-600" }) : job.status === "FAILED" ? /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-red-600 text-[10px]" }, "Failed") : /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-neutral-500 text-[10px]" }, job.progress, "%")))))), isNewFolderModalOpen && /* @__PURE__ */ import_react65.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute inset-0 bg-black/30 backdrop-blur-sm", onClick: () => !isCreatingFolder && setIsNewFolderModalOpen(false) }), /* @__PURE__ */ import_react65.default.createElement("form", { onSubmit: handleCreateFolderSubmit, className: "relative w-full max-w-sm bg-white shadow-2xl rounded-2xl p-8 flex flex-col gap-6 animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h3", { className: "text-lg text-black tracking-tight mb-1" }, "Create Directory"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[11px] text-neutral-400" }, "Name your new folder structure.")), /* @__PURE__ */ import_react65.default.createElement(
3494
+ TextInput,
3511
3495
  {
3512
- className: "fixed bg-white border border-neutral-100 shadow-xl rounded-xl w-40 py-2 z-50 flex flex-col text-xs text-black animate-in fade-in zoom-in-95 duration-100",
3513
- style: { top: contextMenu.y, left: contextMenu.x }
3496
+ placeholder: "Folder name (e.g., Q3 Invoices)",
3497
+ value: newFolderName,
3498
+ onChange: setNewFolderName
3499
+ }
3500
+ ), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ import_react65.default.createElement(
3501
+ "button",
3502
+ {
3503
+ type: "button",
3504
+ onClick: () => setIsNewFolderModalOpen(false),
3505
+ disabled: isCreatingFolder,
3506
+ className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors"
3514
3507
  },
3515
- /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3516
- onCopyItems(selectedIds);
3517
- setContextMenu(null);
3518
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Copy01Icon, size: 14 }), " Copy"),
3519
- /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3520
- onCutItems(selectedIds);
3521
- setContextMenu(null);
3522
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Scissor01Icon, size: 14 }), " Cut"),
3523
- /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3524
- alert("Share functionality coming soon.");
3525
- setContextMenu(null);
3526
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Share01Icon, size: 14 }), " Share"),
3527
- /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full h-px bg-neutral-100 my-1" }),
3528
- isTrashView ? /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3529
- onRestoreItems(selectedIds);
3530
- setSelectedIds([]);
3531
- setContextMenu(null);
3532
- }, className: "px-4 py-2 hover:bg-emerald-50 text-emerald-600 flex items-center gap-3 text-left" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.RestoreBinIcon, size: 14 }), " Restore") : /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
3533
- onMoveToTrash(selectedIds);
3534
- setSelectedIds([]);
3535
- setContextMenu(null);
3536
- }, className: "px-4 py-2 hover:bg-red-50 text-red-600 flex items-center gap-3 text-left" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Delete02Icon, size: 14 }), " Delete")
3537
- ), activeJobs.length > 0 && /* @__PURE__ */ import_react65.default.createElement("div", { className: "fixed bottom-6 right-6 w-80 bg-white border border-neutral-200 shadow-2xl rounded-xl z-100 overflow-hidden flex flex-col animate-in slide-in-from-bottom-4 duration-300" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "p-4 border-b border-neutral-100 bg-neutral-50 flex items-center justify-between" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h4", { className: "text-xs text-black font-medium" }, "Processing Elements"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " active streams")), onClearUploadQueue && activeJobs.length === 0 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onClearUploadQueue, className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Cancel01Icon, size: 14 }))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full h-1 bg-neutral-100 relative" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "h-full transition-all duration-500 ease-out", style: { width: `${globalProgress}%`, background: "linear-gradient(to right, #f64b4d, #ffa360)" } }))), isNewFolderModalOpen && /* @__PURE__ */ import_react65.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute inset-0 bg-black/20", onClick: () => !isCreatingFolder && setIsNewFolderModalOpen(false) }), /* @__PURE__ */ import_react65.default.createElement("form", { onSubmit: handleCreateFolderSubmit, className: "relative w-80 bg-white shadow-2xl rounded-2xl p-6 flex flex-col gap-4 animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h3", { className: "text-sm text-black tracking-tight mb-1" }, "Create Folder"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[11px] text-neutral-400" }, "Name your new directory structure.")), /* @__PURE__ */ import_react65.default.createElement("input", { type: "text", placeholder: "Folder name", value: newFolderName, onChange: (e) => setNewFolderName(e.target.value), disabled: isCreatingFolder, className: "w-full px-4 py-2 border border-neutral-200 rounded-lg text-sm outline-none focus:border-black disabled:opacity-50", autoFocus: true }), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-end gap-2 mt-2" }, /* @__PURE__ */ import_react65.default.createElement("button", { type: "button", onClick: () => setIsNewFolderModalOpen(false), disabled: isCreatingFolder, className: "px-4 py-2 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ import_react65.default.createElement("button", { type: "submit", disabled: !newFolderName.trim() || isCreatingFolder, className: "px-4 py-2 text-xs bg-black text-white rounded-full flex items-center gap-2 hover:bg-neutral-900 disabled:opacity-50 outline-none" }, isCreatingFolder ? /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 14, className: "animate-spin" }) : "Create")))));
3508
+ "Cancel"
3509
+ ), /* @__PURE__ */ import_react65.default.createElement(
3510
+ ThreeDActionButton,
3511
+ {
3512
+ type: "submit",
3513
+ isLoading: isCreatingFolder,
3514
+ disabled: !newFolderName.trim()
3515
+ },
3516
+ "Create"
3517
+ )))));
3538
3518
  };
3539
3519
 
3540
3520
  // src/components/AiApproveDecline.tsx
@@ -4521,7 +4501,7 @@ var ContentGridBlock = ({
4521
4501
  middleBottomCard,
4522
4502
  rightCards
4523
4503
  }) => {
4524
- return /* @__PURE__ */ import_react80.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react80.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react80.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react80.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react80.default.createElement("div", null, /* @__PURE__ */ import_react80.default.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react80.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react80.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react80.default.createElement("div", null, /* @__PURE__ */ import_react80.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react80.default.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react80.default.createElement(
4504
+ return /* @__PURE__ */ import_react80.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react80.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react80.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "bg-amber-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react80.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react80.default.createElement("div", null, /* @__PURE__ */ import_react80.default.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "bg-purple-100 rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react80.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react80.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react80.default.createElement("div", null, /* @__PURE__ */ import_react80.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react80.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react80.default.createElement(import_image13.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react80.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react80.default.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react80.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react80.default.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react80.default.createElement(
4525
4505
  ImageWithLoader2,
4526
4506
  {
4527
4507
  src: card.bgImageSrc,
package/dist/index.mjs CHANGED
@@ -3074,12 +3074,12 @@ var UniversalOverviewPage = ({
3074
3074
  },
3075
3075
  primaryAction.label,
3076
3076
  primaryAction.icon
3077
- ))), /* @__PURE__ */ React35.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8" }, details.map((detail, idx) => /* @__PURE__ */ React35.createElement("div", { key: idx, className: "min-w-0" }, /* @__PURE__ */ React35.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1.5 uppercase" }, detail.label), /* @__PURE__ */ React35.createElement("p", { className: "text-[13px] text-black truncate" }, detail.value)))), alerts.map((alert2, idx) => {
3078
- const bgClass = alert2.type === "warning" ? "bg-amber-50/50" : alert2.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
3079
- const textClass = alert2.type === "warning" ? "text-amber-600" : alert2.type === "info" ? "text-blue-600" : "text-red-600";
3080
- const valClass = alert2.type === "warning" ? "text-amber-700" : alert2.type === "info" ? "text-blue-700" : "text-red-700";
3081
- const lblClass = alert2.type === "warning" ? "text-amber-400" : alert2.type === "info" ? "text-blue-400" : "text-red-400";
3082
- return /* @__PURE__ */ React35.createElement("div", { key: idx, className: `mt-4 p-5 rounded-xl flex flex-col gap-4 ${bgClass}` }, /* @__PURE__ */ React35.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React35.createElement("span", { className: `text-[11px] tracking-widest uppercase ${textClass}` }, alert2.title)), alert2.items.map((item, itemIdx) => /* @__PURE__ */ React35.createElement("div", { key: itemIdx }, /* @__PURE__ */ React35.createElement("span", { className: `text-[11px] tracking-[0.2em] block mb-1 uppercase ${lblClass}` }, item.label), /* @__PURE__ */ React35.createElement("p", { className: `text-[13px] leading-relaxed ${valClass}` }, item.text))));
3077
+ ))), /* @__PURE__ */ React35.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8" }, details.map((detail, idx) => /* @__PURE__ */ React35.createElement("div", { key: idx, className: "min-w-0" }, /* @__PURE__ */ React35.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1.5 uppercase" }, detail.label), /* @__PURE__ */ React35.createElement("p", { className: "text-[13px] text-black truncate" }, detail.value)))), alerts.map((alert, idx) => {
3078
+ const bgClass = alert.type === "warning" ? "bg-amber-50/50" : alert.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
3079
+ const textClass = alert.type === "warning" ? "text-amber-600" : alert.type === "info" ? "text-blue-600" : "text-red-600";
3080
+ const valClass = alert.type === "warning" ? "text-amber-700" : alert.type === "info" ? "text-blue-700" : "text-red-700";
3081
+ const lblClass = alert.type === "warning" ? "text-amber-400" : alert.type === "info" ? "text-blue-400" : "text-red-400";
3082
+ return /* @__PURE__ */ React35.createElement("div", { key: idx, className: `mt-4 p-5 rounded-xl flex flex-col gap-4 ${bgClass}` }, /* @__PURE__ */ React35.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React35.createElement("span", { className: `text-[11px] tracking-widest uppercase ${textClass}` }, alert.title)), alert.items.map((item, itemIdx) => /* @__PURE__ */ React35.createElement("div", { key: itemIdx }, /* @__PURE__ */ React35.createElement("span", { className: `text-[11px] tracking-[0.2em] block mb-1 uppercase ${lblClass}` }, item.label), /* @__PURE__ */ React35.createElement("p", { className: `text-[13px] leading-relaxed ${valClass}` }, item.text))));
3083
3083
  }))));
3084
3084
  };
3085
3085
 
@@ -3268,11 +3268,11 @@ var UniversalDirectoryPage = ({
3268
3268
  };
3269
3269
 
3270
3270
  // src/components/UniversalDriveView.tsx
3271
- import React40, { useState as useState24, useEffect as useEffect16, useRef as useRef11 } from "react";
3271
+ import React40, { useState as useState24, useEffect as useEffect16 } from "react";
3272
3272
  import { HugeiconsIcon as HugeiconsIcon26 } from "@hugeicons/react";
3273
3273
  import {
3274
3274
  Delete02Icon as Delete02Icon2,
3275
- CloudUploadIcon,
3275
+ Upload02Icon,
3276
3276
  FolderAddIcon,
3277
3277
  Cancel01Icon as Cancel01Icon3,
3278
3278
  FolderIcon as FolderIcon2,
@@ -3283,7 +3283,7 @@ import {
3283
3283
  Scissor01Icon,
3284
3284
  FilePasteIcon,
3285
3285
  Share01Icon,
3286
- RestoreBinIcon
3286
+ Tick01Icon
3287
3287
  } from "@hugeicons/core-free-icons";
3288
3288
 
3289
3289
  // src/components/FileIconMapper.tsx
@@ -3344,7 +3344,6 @@ var UniversalDriveView = ({
3344
3344
  items,
3345
3345
  uploadQueue,
3346
3346
  isLoading,
3347
- isTrashView,
3348
3347
  searchQuery,
3349
3348
  currentPage,
3350
3349
  totalPages,
@@ -3353,15 +3352,14 @@ var UniversalDriveView = ({
3353
3352
  onCreateFolder,
3354
3353
  onUploadFiles,
3355
3354
  onMoveToTrash,
3356
- onRestoreItems,
3357
- onEmptyTrash,
3358
3355
  onClearUploadQueue,
3359
3356
  onPageChange,
3360
- onToggleTrashView,
3361
3357
  onCopyItems,
3362
3358
  onCutItems,
3363
3359
  onPasteItems,
3364
- clipboardCount
3360
+ clipboardCount,
3361
+ onOpenFile,
3362
+ onShareItems
3365
3363
  }) => {
3366
3364
  const [selectedIds, setSelectedIds] = useState24([]);
3367
3365
  const [isNewFolderModalOpen, setIsNewFolderModalOpen] = useState24(false);
@@ -3370,8 +3368,6 @@ var UniversalDriveView = ({
3370
3368
  const [localSearch, setLocalSearch] = useState24(searchQuery);
3371
3369
  const [isSearching, setIsSearching] = useState24(false);
3372
3370
  const [loadingFolderId, setLoadingFolderId] = useState24(null);
3373
- const [contextMenu, setContextMenu] = useState24(null);
3374
- const tableRef = useRef11(null);
3375
3371
  useEffect16(() => {
3376
3372
  if (localSearch !== searchQuery) setIsSearching(true);
3377
3373
  const delay = setTimeout(() => {
@@ -3383,11 +3379,6 @@ var UniversalDriveView = ({
3383
3379
  useEffect16(() => {
3384
3380
  if (!isLoading) setLoadingFolderId(null);
3385
3381
  }, [isLoading]);
3386
- useEffect16(() => {
3387
- const handleClickOutside = () => setContextMenu(null);
3388
- document.addEventListener("click", handleClickOutside);
3389
- return () => document.removeEventListener("click", handleClickOutside);
3390
- }, []);
3391
3382
  const formatBytes = (bytes) => {
3392
3383
  const num = Number(bytes);
3393
3384
  if (num === 0) return "0 Bytes";
@@ -3419,12 +3410,13 @@ var UniversalDriveView = ({
3419
3410
  setLoadingFolderId(item.id);
3420
3411
  setSelectedIds([]);
3421
3412
  onNavigateFolder(item.id);
3413
+ } else {
3414
+ onOpenFile(item);
3422
3415
  }
3423
3416
  };
3424
- const handleContextMenu = (e, itemId) => {
3417
+ const handleRightClickSelect = (e, itemId) => {
3425
3418
  e.preventDefault();
3426
- if (!selectedIds.includes(itemId)) setSelectedIds([itemId]);
3427
- setContextMenu({ x: e.clientX, y: e.clientY, itemId });
3419
+ setSelectedIds([itemId]);
3428
3420
  };
3429
3421
  const handleCreateFolderSubmit = async (e) => {
3430
3422
  e.preventDefault();
@@ -3437,21 +3429,16 @@ var UniversalDriveView = ({
3437
3429
  };
3438
3430
  const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
3439
3431
  const globalProgress = uploadQueue.length > 0 ? Math.round(uploadQueue.reduce((acc, job) => acc + job.progress, 0) / (uploadQueue.length * 100) * 100) : 0;
3440
- return /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6 max-w-5xl w-full mx-auto p-6 bg-white rounded-2xl animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React40.createElement(ManagedToaster, null), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4 pb-4 border-b border-neutral-100" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h1", { className: "text-xl text-black tracking-tight mb-1" }, " My Drive"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500" }, "Secure cloud storage optimized for your workspace.")), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ React40.createElement(
3441
- "button",
3442
- {
3443
- onClick: onToggleTrashView,
3444
- title: "Trash",
3445
- className: `p-2.5 rounded-full transition-all outline-none flex items-center justify-center ${isTrashView ? "bg-red-50 text-red-600" : "bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100"}`
3446
- },
3447
- /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Delete02Icon2, size: 18 })
3448
- ), !isTrashView && /* @__PURE__ */ React40.createElement(React40.Fragment, null, selectedIds.length > 0 && /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3432
+ const selectedItemsData = items.filter((i) => selectedIds.includes(i.id));
3433
+ return /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6 max-w-5xl w-full mx-auto p-6 bg-white rounded-2xl animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React40.createElement(ManagedToaster, null), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4 pb-4 border-b border-neutral-100" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h1", { className: "text-xl text-black tracking-tight mb-1" }, "Drive"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500" }, "Secure cloud storage optimized for your workspace.")), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2 shrink-0" }, selectedIds.length > 0 && /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3434
+ onShareItems(selectedItemsData);
3435
+ }, title: "Share", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Share01Icon, size: 18 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3449
3436
  onCopyItems(selectedIds);
3450
3437
  setSelectedIds([]);
3451
3438
  }, title: "Copy", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Copy01Icon, size: 18 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3452
3439
  onCutItems(selectedIds);
3453
3440
  setSelectedIds([]);
3454
- }, title: "Cut", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Scissor01Icon, size: 18 }))), clipboardCount > 0 && /* @__PURE__ */ React40.createElement("button", { onClick: onPasteItems, title: `Paste ${clipboardCount} items`, className: "p-2.5 bg-black text-white hover:bg-neutral-800 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FilePasteIcon, size: 18 })), /* @__PURE__ */ React40.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" }), /* @__PURE__ */ React40.createElement("button", { onClick: () => setIsNewFolderModalOpen(true), title: "New Folder", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FolderAddIcon, size: 18 })), /* @__PURE__ */ React40.createElement("label", { title: "Upload Files", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full cursor-pointer transition-all" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: CloudUploadIcon, size: 18 }), /* @__PURE__ */ React40.createElement("input", { type: "file", multiple: true, className: "hidden", onChange: (e) => e.target.files && onUploadFiles(e.target.files) }))))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, /* @__PURE__ */ React40.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ React40.createElement(
3441
+ }, title: "Cut", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Scissor01Icon, size: 18 })), /* @__PURE__ */ React40.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" })), clipboardCount > 0 && /* @__PURE__ */ React40.createElement("button", { onClick: onPasteItems, title: `Paste ${clipboardCount} items`, className: "p-2.5 bg-black text-white hover:bg-neutral-800 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FilePasteIcon, size: 18 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => setIsNewFolderModalOpen(true), title: "New Folder", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FolderAddIcon, size: 18 })), /* @__PURE__ */ React40.createElement("label", { title: "Upload Files", className: "p-2.5 bg-neutral-50 text-neutral-500 hover:text-black hover:bg-neutral-100 rounded-full cursor-pointer transition-all" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Upload02Icon, size: 18 }), /* @__PURE__ */ React40.createElement("input", { type: "file", multiple: true, className: "hidden", onChange: (e) => e.target.files && onUploadFiles(e.target.files) })))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between gap-4" }, /* @__PURE__ */ React40.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ React40.createElement(
3455
3442
  "input",
3456
3443
  {
3457
3444
  type: "text",
@@ -3460,13 +3447,10 @@ var UniversalDriveView = ({
3460
3447
  value: localSearch,
3461
3448
  onChange: (e) => setLocalSearch(e.target.value)
3462
3449
  }
3463
- ), isSearching && /* @__PURE__ */ React40.createElement("div", { className: "absolute right-3 top-1/2 -translate-y-1/2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, size: 14, className: "animate-spin text-neutral-400" }))), selectedIds.length > 0 && /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 bg-neutral-50 border border-neutral-100 px-4 py-2 rounded-full animate-in fade-in duration-200" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] tracking-widest text-neutral-500 uppercase" }, selectedIds.length, " Selected"), isTrashView ? /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3464
- onRestoreItems(selectedIds);
3465
- setSelectedIds([]);
3466
- }, className: "text-emerald-600 hover:text-emerald-700 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: RestoreBinIcon, size: 14 }), " Restore") : /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3450
+ ), isSearching && /* @__PURE__ */ React40.createElement("div", { className: "absolute right-3 top-1/2 -translate-y-1/2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, size: 14, className: "animate-spin text-neutral-400" }))), selectedIds.length > 0 && /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 bg-neutral-50 border border-neutral-100 px-4 py-2 rounded-full animate-in fade-in duration-200" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] tracking-widest text-neutral-500 uppercase" }, selectedIds.length, " Selected"), /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3467
3451
  onMoveToTrash(selectedIds);
3468
3452
  setSelectedIds([]);
3469
- }, className: "text-neutral-500 hover:text-red-600 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Delete02Icon2, size: 14 }), " Move to Trash")), isTrashView && selectedIds.length === 0 && /* @__PURE__ */ React40.createElement("button", { onClick: onEmptyTrash, className: "text-red-600 hover:text-red-700 p-2 text-xs flex items-center gap-2 outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Delete02Icon2, size: 14 }), " Empty Trash")), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-1 border-b border-neutral-50 text-neutral-400 whitespace-nowrap" }, folderBreadcrumbs.map((crumb, idx) => /* @__PURE__ */ React40.createElement(React40.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ React40.createElement("span", null, "/"), /* @__PURE__ */ React40.createElement(
3453
+ }, className: "text-neutral-500 hover:text-red-600 p-1 flex items-center gap-1.5 text-xs outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Delete02Icon2, size: 14 }), " Trash"))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-1 border-b border-neutral-50 text-neutral-400 whitespace-nowrap" }, folderBreadcrumbs.map((crumb, idx) => /* @__PURE__ */ React40.createElement(React40.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ React40.createElement("span", null, "/"), /* @__PURE__ */ React40.createElement(
3470
3454
  "button",
3471
3455
  {
3472
3456
  onClick: () => {
@@ -3476,7 +3460,7 @@ var UniversalDriveView = ({
3476
3460
  className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black" : ""}`
3477
3461
  },
3478
3462
  crumb.name
3479
- )))), !isLoading && items.length === 0 && /* @__PURE__ */ React40.createElement("div", { className: "py-24 text-center flex flex-col items-center justify-center border border-dashed border-neutral-100 rounded-xl bg-neutral-50/50" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: isTrashView ? Delete02Icon2 : FolderIcon2, size: 40, className: "text-neutral-300 mb-3" }), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500" }, isTrashView ? "Trash is empty." : "This directory is empty.")), /* @__PURE__ */ React40.createElement("div", { className: "w-full overflow-x-auto select-none flex-1", ref: tableRef }, /* @__PURE__ */ React40.createElement("table", { className: "w-full text-left border-collapse min-w-full" }, /* @__PURE__ */ React40.createElement("thead", null, /* @__PURE__ */ React40.createElement("tr", { className: "border-b border-neutral-100" }, /* @__PURE__ */ React40.createElement("th", { className: "w-10 p-3" }, /* @__PURE__ */ React40.createElement("input", { type: "checkbox", checked: selectedIds.length === items.length && items.length > 0, onChange: handleSelectAll, className: "rounded border-neutral-200 focus:ring-0 cursor-pointer" })), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Name"), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Modified"), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3 text-right" }, "Size"))), /* @__PURE__ */ React40.createElement("tbody", { className: "divide-y divide-neutral-50 relative" }, isLoading && items.length === 0 && /* @__PURE__ */ React40.createElement("tr", null, /* @__PURE__ */ React40.createElement("td", { colSpan: 4, className: "py-12 text-center" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, className: "animate-spin mx-auto text-neutral-400", size: 24 }))), items.map((item) => {
3463
+ )))), /* @__PURE__ */ React40.createElement("div", { className: "w-full overflow-x-auto select-none flex-1 relative min-h-75" }, /* @__PURE__ */ React40.createElement("table", { className: "w-full text-left border-collapse min-w-full relative z-10" }, /* @__PURE__ */ React40.createElement("thead", null, /* @__PURE__ */ React40.createElement("tr", { className: "border-b border-neutral-100 bg-white" }, /* @__PURE__ */ React40.createElement("th", { className: "w-10 p-3" }, /* @__PURE__ */ React40.createElement("input", { type: "checkbox", checked: selectedIds.length === items.length && items.length > 0, onChange: handleSelectAll, className: "rounded border-neutral-200 focus:ring-0 cursor-pointer" })), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Name"), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3" }, "Modified"), /* @__PURE__ */ React40.createElement("th", { className: "text-[11px] uppercase tracking-[0.2em] text-neutral-400 p-3 text-right" }, "Size"))), /* @__PURE__ */ React40.createElement("tbody", { className: "divide-y divide-neutral-50" }, items.length === 0 && !isLoading && /* @__PURE__ */ React40.createElement("tr", null, /* @__PURE__ */ React40.createElement("td", { colSpan: 4, className: "py-24 text-center" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col items-center justify-center" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FolderIcon2, size: 40, className: "text-neutral-200 mb-3" }), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-400" }, "This directory is empty.")))), items.map((item) => {
3480
3464
  const isChecked = selectedIds.includes(item.id);
3481
3465
  return /* @__PURE__ */ React40.createElement(
3482
3466
  "tr",
@@ -3484,7 +3468,7 @@ var UniversalDriveView = ({
3484
3468
  key: item.id,
3485
3469
  onClick: (e) => handleRowClick(item.id, e),
3486
3470
  onDoubleClick: () => handleItemDoubleClick(item),
3487
- onContextMenu: (e) => handleContextMenu(e, item.id),
3471
+ onContextMenu: (e) => handleRightClickSelect(e, item.id),
3488
3472
  className: `hover:bg-neutral-50/70 transition-colors cursor-pointer group ${isChecked ? "bg-neutral-50" : ""}`
3489
3473
  },
3490
3474
  /* @__PURE__ */ React40.createElement("td", { className: "p-3", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React40.createElement("input", { type: "checkbox", checked: isChecked, onChange: () => handleRowClick(item.id, { ctrlKey: true }), className: "rounded border-neutral-200 cursor-pointer" })),
@@ -3492,35 +3476,31 @@ var UniversalDriveView = ({
3492
3476
  /* @__PURE__ */ React40.createElement("td", { className: "p-3 text-xs text-neutral-500 whitespace-nowrap" }, formatDate3(item.updatedAt)),
3493
3477
  /* @__PURE__ */ React40.createElement("td", { className: "p-3 text-xs text-neutral-500 text-right whitespace-nowrap" }, formatBytes(item.size))
3494
3478
  );
3495
- })))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between pt-4 border-t border-neutral-100" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", Math.max(1, totalPages)), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React40.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage <= 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: ArrowLeft01Icon8, size: 14 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: ArrowRight01Icon7, size: 14 })))), contextMenu && /* @__PURE__ */ React40.createElement(
3496
- "div",
3479
+ }))), isLoading && /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 top-12 z-20 bg-white/60 backdrop-blur-[1px] flex items-start justify-center pt-20" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, className: "animate-spin text-neutral-400", size: 24 }))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between pt-4 border-t border-neutral-100" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", Math.max(1, totalPages)), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React40.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage <= 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: ArrowLeft01Icon8, size: 14 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black disabled:opacity-30 transition-all outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: ArrowRight01Icon7, size: 14 })))), activeJobs.length > 0 && /* @__PURE__ */ React40.createElement("div", { className: "fixed bottom-6 right-6 w-80 bg-white border border-neutral-200 shadow-2xl rounded-xl z-100 overflow-hidden flex flex-col animate-in slide-in-from-bottom-4 duration-300" }, /* @__PURE__ */ React40.createElement("div", { className: "p-4 border-b border-neutral-100 bg-neutral-50 flex items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-xs text-black font-medium" }, "Processing Elements"), /* @__PURE__ */ React40.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " active streams")), onClearUploadQueue && activeJobs.length === 0 && /* @__PURE__ */ React40.createElement("button", { onClick: onClearUploadQueue, className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Cancel01Icon3, size: 14 }))), /* @__PURE__ */ React40.createElement("div", { className: "w-full h-1 bg-neutral-100 relative" }, /* @__PURE__ */ React40.createElement("div", { className: "h-full transition-all duration-500 ease-out", style: { width: `${globalProgress}%`, background: "linear-gradient(to right, #f64b4d, #ffa360)" } })), /* @__PURE__ */ React40.createElement("div", { className: "max-h-40 overflow-y-auto divide-y divide-neutral-50 p-2" }, uploadQueue.map((job) => /* @__PURE__ */ React40.createElement("div", { key: job.id, className: "flex items-center justify-between p-2 text-[11px] gap-4" }, /* @__PURE__ */ React40.createElement("span", { className: "text-black truncate flex-1 pr-2" }, job.name), /* @__PURE__ */ React40.createElement("div", { className: "shrink-0 whitespace-nowrap flex items-center gap-2" }, job.status === "COMPLETED" ? /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Tick01Icon, size: 12, className: "text-green-600" }) : job.status === "FAILED" ? /* @__PURE__ */ React40.createElement("span", { className: "text-red-600 text-[10px]" }, "Failed") : /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[10px]" }, job.progress, "%")))))), isNewFolderModalOpen && /* @__PURE__ */ React40.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/30 backdrop-blur-sm", onClick: () => !isCreatingFolder && setIsNewFolderModalOpen(false) }), /* @__PURE__ */ React40.createElement("form", { onSubmit: handleCreateFolderSubmit, className: "relative w-full max-w-sm bg-white shadow-2xl rounded-2xl p-8 flex flex-col gap-6 animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h3", { className: "text-lg text-black tracking-tight mb-1" }, "Create Directory"), /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400" }, "Name your new folder structure.")), /* @__PURE__ */ React40.createElement(
3480
+ TextInput,
3497
3481
  {
3498
- className: "fixed bg-white border border-neutral-100 shadow-xl rounded-xl w-40 py-2 z-50 flex flex-col text-xs text-black animate-in fade-in zoom-in-95 duration-100",
3499
- style: { top: contextMenu.y, left: contextMenu.x }
3482
+ placeholder: "Folder name (e.g., Q3 Invoices)",
3483
+ value: newFolderName,
3484
+ onChange: setNewFolderName
3485
+ }
3486
+ ), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ React40.createElement(
3487
+ "button",
3488
+ {
3489
+ type: "button",
3490
+ onClick: () => setIsNewFolderModalOpen(false),
3491
+ disabled: isCreatingFolder,
3492
+ className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors"
3500
3493
  },
3501
- /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3502
- onCopyItems(selectedIds);
3503
- setContextMenu(null);
3504
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Copy01Icon, size: 14 }), " Copy"),
3505
- /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3506
- onCutItems(selectedIds);
3507
- setContextMenu(null);
3508
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Scissor01Icon, size: 14 }), " Cut"),
3509
- /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3510
- alert("Share functionality coming soon.");
3511
- setContextMenu(null);
3512
- }, className: "px-4 py-2 hover:bg-neutral-50 flex items-center gap-3 text-left" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Share01Icon, size: 14 }), " Share"),
3513
- /* @__PURE__ */ React40.createElement("div", { className: "w-full h-px bg-neutral-100 my-1" }),
3514
- isTrashView ? /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3515
- onRestoreItems(selectedIds);
3516
- setSelectedIds([]);
3517
- setContextMenu(null);
3518
- }, className: "px-4 py-2 hover:bg-emerald-50 text-emerald-600 flex items-center gap-3 text-left" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: RestoreBinIcon, size: 14 }), " Restore") : /* @__PURE__ */ React40.createElement("button", { onClick: () => {
3519
- onMoveToTrash(selectedIds);
3520
- setSelectedIds([]);
3521
- setContextMenu(null);
3522
- }, className: "px-4 py-2 hover:bg-red-50 text-red-600 flex items-center gap-3 text-left" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Delete02Icon2, size: 14 }), " Delete")
3523
- ), activeJobs.length > 0 && /* @__PURE__ */ React40.createElement("div", { className: "fixed bottom-6 right-6 w-80 bg-white border border-neutral-200 shadow-2xl rounded-xl z-100 overflow-hidden flex flex-col animate-in slide-in-from-bottom-4 duration-300" }, /* @__PURE__ */ React40.createElement("div", { className: "p-4 border-b border-neutral-100 bg-neutral-50 flex items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h4", { className: "text-xs text-black font-medium" }, "Processing Elements"), /* @__PURE__ */ React40.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " active streams")), onClearUploadQueue && activeJobs.length === 0 && /* @__PURE__ */ React40.createElement("button", { onClick: onClearUploadQueue, className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Cancel01Icon3, size: 14 }))), /* @__PURE__ */ React40.createElement("div", { className: "w-full h-1 bg-neutral-100 relative" }, /* @__PURE__ */ React40.createElement("div", { className: "h-full transition-all duration-500 ease-out", style: { width: `${globalProgress}%`, background: "linear-gradient(to right, #f64b4d, #ffa360)" } }))), isNewFolderModalOpen && /* @__PURE__ */ React40.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/20", onClick: () => !isCreatingFolder && setIsNewFolderModalOpen(false) }), /* @__PURE__ */ React40.createElement("form", { onSubmit: handleCreateFolderSubmit, className: "relative w-80 bg-white shadow-2xl rounded-2xl p-6 flex flex-col gap-4 animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm text-black tracking-tight mb-1" }, "Create Folder"), /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400" }, "Name your new directory structure.")), /* @__PURE__ */ React40.createElement("input", { type: "text", placeholder: "Folder name", value: newFolderName, onChange: (e) => setNewFolderName(e.target.value), disabled: isCreatingFolder, className: "w-full px-4 py-2 border border-neutral-200 rounded-lg text-sm outline-none focus:border-black disabled:opacity-50", autoFocus: true }), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-end gap-2 mt-2" }, /* @__PURE__ */ React40.createElement("button", { type: "button", onClick: () => setIsNewFolderModalOpen(false), disabled: isCreatingFolder, className: "px-4 py-2 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React40.createElement("button", { type: "submit", disabled: !newFolderName.trim() || isCreatingFolder, className: "px-4 py-2 text-xs bg-black text-white rounded-full flex items-center gap-2 hover:bg-neutral-900 disabled:opacity-50 outline-none" }, isCreatingFolder ? /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, size: 14, className: "animate-spin" }) : "Create")))));
3494
+ "Cancel"
3495
+ ), /* @__PURE__ */ React40.createElement(
3496
+ ThreeDActionButton,
3497
+ {
3498
+ type: "submit",
3499
+ isLoading: isCreatingFolder,
3500
+ disabled: !newFolderName.trim()
3501
+ },
3502
+ "Create"
3503
+ )))));
3524
3504
  };
3525
3505
 
3526
3506
  // src/components/AiApproveDecline.tsx
@@ -3556,13 +3536,13 @@ var AiStageCheck = ({ tasks }) => {
3556
3536
  // src/components/Stagger.tsx
3557
3537
  import React43 from "react";
3558
3538
  import { HugeiconsIcon as HugeiconsIcon29 } from "@hugeicons/react";
3559
- import { Briefcase02Icon, Upload01Icon as Upload01Icon2, FileSyncIcon, CloudUploadIcon as CloudUploadIcon2 } from "@hugeicons/core-free-icons";
3539
+ import { Briefcase02Icon, Upload01Icon as Upload01Icon2, FileSyncIcon, CloudUploadIcon } from "@hugeicons/core-free-icons";
3560
3540
  var Stagger = ({ steps, currentStep }) => {
3561
3541
  const getIconForStep = (stepName) => {
3562
3542
  const lowerName = stepName.toLowerCase();
3563
3543
  if (lowerName.includes("document")) return Upload01Icon2;
3564
3544
  if (lowerName.includes("review")) return FileSyncIcon;
3565
- if (lowerName.includes("submit")) return CloudUploadIcon2;
3545
+ if (lowerName.includes("submit")) return CloudUploadIcon;
3566
3546
  return Briefcase02Icon;
3567
3547
  };
3568
3548
  return /* @__PURE__ */ React43.createElement("div", { className: "w-full flex items-center justify-between relative z-0" }, /* @__PURE__ */ React43.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 w-full h-px bg-neutral-100 -z-10" }), /* @__PURE__ */ React43.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 h-px bg-emerald-500 -z-10 transition-all duration-500", style: { width: `${currentStep / (steps.length - 1) * 100}%` } }), steps.map((step, idx) => {
@@ -4507,7 +4487,7 @@ var ContentGridBlock = ({
4507
4487
  middleBottomCard,
4508
4488
  rightCards
4509
4489
  }) => {
4510
- return /* @__PURE__ */ React48.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React48.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React48.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React48.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React48.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React48.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React48.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React48.createElement("div", null, /* @__PURE__ */ React48.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ React48.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React48.createElement(Image13, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React48.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React48.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React48.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React48.createElement(Image13, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React48.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React48.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ React48.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React48.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React48.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React48.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React48.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React48.createElement("div", null, /* @__PURE__ */ React48.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React48.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React48.createElement(Image13, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React48.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React48.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ React48.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ React48.createElement(
4490
+ return /* @__PURE__ */ React48.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React48.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React48.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React48.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React48.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React48.createElement("div", { className: "bg-amber-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React48.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React48.createElement("div", null, /* @__PURE__ */ React48.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ React48.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React48.createElement(Image13, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "bg-purple-100 rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ React48.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React48.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React48.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React48.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React48.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React48.createElement(Image13, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React48.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React48.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ React48.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-100 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ React48.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React48.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React48.createElement("div", { className: "border border-neutral-100 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React48.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React48.createElement("div", null, /* @__PURE__ */ React48.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React48.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React48.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React48.createElement(Image13, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React48.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React48.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React48.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ React48.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ React48.createElement(
4511
4491
  ImageWithLoader2,
4512
4492
  {
4513
4493
  src: card.bgImageSrc,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "1.1.0",
3
+ "version": "1.2.0",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",