@retinalabsllc/zairusjs 1.3.0 → 1.3.2
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 +7 -5
- package/dist/index.d.ts +7 -5
- package/dist/index.js +71 -106
- package/dist/index.mjs +85 -119
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -867,7 +867,6 @@ interface DriveItem {
|
|
|
867
867
|
mimeType?: string;
|
|
868
868
|
size: number | bigint;
|
|
869
869
|
parentId: string | null;
|
|
870
|
-
isTrashed: boolean;
|
|
871
870
|
updatedAt: string | Date;
|
|
872
871
|
}
|
|
873
872
|
interface UploadQueueJob {
|
|
@@ -891,14 +890,17 @@ interface UniversalDriveViewProps {
|
|
|
891
890
|
onSearchChange: (val: string) => void;
|
|
892
891
|
onNavigateFolder: (folderId: string | null) => void;
|
|
893
892
|
onCreateFolder: (name: string) => Promise<void>;
|
|
893
|
+
onRenameItem: (itemId: string, newName: string) => Promise<void>;
|
|
894
894
|
onUploadFiles: (files: FileList) => Promise<void>;
|
|
895
895
|
onMoveToTrash: (ids: string[]) => Promise<void>;
|
|
896
896
|
onClearUploadQueue?: () => void;
|
|
897
897
|
onPageChange: (page: number) => void;
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
898
|
+
onRefresh: () => void;
|
|
899
|
+
onFetchFoldersForExplorer: (folderId: string | null) => Promise<{
|
|
900
|
+
folders: DriveItem[];
|
|
901
|
+
breadcrumbs: any[];
|
|
902
|
+
}>;
|
|
903
|
+
onExecuteMoveCopy: (action: 'copy' | 'move', targetFolderId: string | null, itemIds: string[]) => Promise<void>;
|
|
902
904
|
onOpenFile: (item: DriveItem) => void;
|
|
903
905
|
onShareItems: (items: DriveItem[]) => void;
|
|
904
906
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -867,7 +867,6 @@ interface DriveItem {
|
|
|
867
867
|
mimeType?: string;
|
|
868
868
|
size: number | bigint;
|
|
869
869
|
parentId: string | null;
|
|
870
|
-
isTrashed: boolean;
|
|
871
870
|
updatedAt: string | Date;
|
|
872
871
|
}
|
|
873
872
|
interface UploadQueueJob {
|
|
@@ -891,14 +890,17 @@ interface UniversalDriveViewProps {
|
|
|
891
890
|
onSearchChange: (val: string) => void;
|
|
892
891
|
onNavigateFolder: (folderId: string | null) => void;
|
|
893
892
|
onCreateFolder: (name: string) => Promise<void>;
|
|
893
|
+
onRenameItem: (itemId: string, newName: string) => Promise<void>;
|
|
894
894
|
onUploadFiles: (files: FileList) => Promise<void>;
|
|
895
895
|
onMoveToTrash: (ids: string[]) => Promise<void>;
|
|
896
896
|
onClearUploadQueue?: () => void;
|
|
897
897
|
onPageChange: (page: number) => void;
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
898
|
+
onRefresh: () => void;
|
|
899
|
+
onFetchFoldersForExplorer: (folderId: string | null) => Promise<{
|
|
900
|
+
folders: DriveItem[];
|
|
901
|
+
breadcrumbs: any[];
|
|
902
|
+
}>;
|
|
903
|
+
onExecuteMoveCopy: (action: 'copy' | 'move', targetFolderId: string | null, itemIds: string[]) => Promise<void>;
|
|
902
904
|
onOpenFile: (item: DriveItem) => void;
|
|
903
905
|
onShareItems: (items: DriveItem[]) => void;
|
|
904
906
|
}
|
package/dist/index.js
CHANGED
|
@@ -3355,7 +3355,6 @@ var FileIconMapper = ({ type, mimeType }) => {
|
|
|
3355
3355
|
|
|
3356
3356
|
// src/components/UniversalDriveView.tsx
|
|
3357
3357
|
var UniversalDriveView = ({
|
|
3358
|
-
currentFolderId,
|
|
3359
3358
|
folderBreadcrumbs,
|
|
3360
3359
|
items,
|
|
3361
3360
|
uploadQueue,
|
|
@@ -3366,35 +3365,39 @@ var UniversalDriveView = ({
|
|
|
3366
3365
|
onSearchChange,
|
|
3367
3366
|
onNavigateFolder,
|
|
3368
3367
|
onCreateFolder,
|
|
3368
|
+
onRenameItem,
|
|
3369
3369
|
onUploadFiles,
|
|
3370
3370
|
onMoveToTrash,
|
|
3371
3371
|
onClearUploadQueue,
|
|
3372
3372
|
onPageChange,
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
clipboardCount,
|
|
3373
|
+
onRefresh,
|
|
3374
|
+
onFetchFoldersForExplorer,
|
|
3375
|
+
onExecuteMoveCopy,
|
|
3377
3376
|
onOpenFile,
|
|
3378
3377
|
onShareItems
|
|
3379
3378
|
}) => {
|
|
3380
3379
|
const [selectedIds, setSelectedIds] = (0, import_react65.useState)([]);
|
|
3381
|
-
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = (0, import_react65.useState)(false);
|
|
3382
|
-
const [newFolderName, setNewFolderName] = (0, import_react65.useState)("");
|
|
3383
|
-
const [isCreatingFolder, setIsCreatingFolder] = (0, import_react65.useState)(false);
|
|
3384
3380
|
const [localSearch, setLocalSearch] = (0, import_react65.useState)(searchQuery);
|
|
3385
|
-
const [
|
|
3386
|
-
const [
|
|
3381
|
+
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = (0, import_react65.useState)(false);
|
|
3382
|
+
const [renameModal, setRenameModal] = (0, import_react65.useState)({ isOpen: false, id: "", name: "" });
|
|
3383
|
+
const [folderInputVal, setFolderInputVal] = (0, import_react65.useState)("");
|
|
3384
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react65.useState)(false);
|
|
3385
|
+
const [explorer, setExplorer] = (0, import_react65.useState)({
|
|
3386
|
+
isOpen: false,
|
|
3387
|
+
action: "copy",
|
|
3388
|
+
currentId: null,
|
|
3389
|
+
folders: [],
|
|
3390
|
+
breadcrumbs: [],
|
|
3391
|
+
loading: false
|
|
3392
|
+
});
|
|
3387
3393
|
(0, import_react65.useEffect)(() => {
|
|
3388
|
-
if (localSearch !== searchQuery)
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3394
|
+
if (localSearch !== searchQuery) {
|
|
3395
|
+
const delay = setTimeout(() => {
|
|
3396
|
+
onSearchChange(localSearch);
|
|
3397
|
+
}, 1500);
|
|
3398
|
+
return () => clearTimeout(delay);
|
|
3399
|
+
}
|
|
3394
3400
|
}, [localSearch, onSearchChange, searchQuery]);
|
|
3395
|
-
(0, import_react65.useEffect)(() => {
|
|
3396
|
-
if (!isLoading) setLoadingFolderId(null);
|
|
3397
|
-
}, [isLoading]);
|
|
3398
3401
|
const formatBytes = (bytes) => {
|
|
3399
3402
|
const num = Number(bytes);
|
|
3400
3403
|
if (num === 0) return "0 Bytes";
|
|
@@ -3404,11 +3407,7 @@ var UniversalDriveView = ({
|
|
|
3404
3407
|
return parseFloat((num / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
|
|
3405
3408
|
};
|
|
3406
3409
|
const formatDate3 = (dateString) => {
|
|
3407
|
-
return new Date(dateString).toLocaleDateString("en-US", {
|
|
3408
|
-
month: "short",
|
|
3409
|
-
day: "numeric",
|
|
3410
|
-
year: "numeric"
|
|
3411
|
-
});
|
|
3410
|
+
return new Date(dateString).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
|
|
3412
3411
|
};
|
|
3413
3412
|
const handleRowClick = (id, e) => {
|
|
3414
3413
|
if (e.ctrlKey || e.metaKey) {
|
|
@@ -3423,100 +3422,66 @@ var UniversalDriveView = ({
|
|
|
3423
3422
|
};
|
|
3424
3423
|
const handleItemDoubleClick = (item) => {
|
|
3425
3424
|
if (item.type === "FOLDER") {
|
|
3426
|
-
setLoadingFolderId(item.id);
|
|
3427
3425
|
setSelectedIds([]);
|
|
3428
3426
|
onNavigateFolder(item.id);
|
|
3429
3427
|
} else {
|
|
3430
3428
|
onOpenFile(item);
|
|
3431
3429
|
}
|
|
3432
3430
|
};
|
|
3433
|
-
const
|
|
3434
|
-
|
|
3435
|
-
|
|
3431
|
+
const openExplorer = async (action) => {
|
|
3432
|
+
setExplorer((p) => ({ ...p, isOpen: true, action, loading: true, currentId: null }));
|
|
3433
|
+
const data = await onFetchFoldersForExplorer(null);
|
|
3434
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3436
3435
|
};
|
|
3437
|
-
const
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3436
|
+
const navigateExplorer = async (folderId) => {
|
|
3437
|
+
setExplorer((p) => ({ ...p, loading: true, currentId: folderId }));
|
|
3438
|
+
const data = await onFetchFoldersForExplorer(folderId);
|
|
3439
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3440
|
+
};
|
|
3441
|
+
const executeExplorerAction = async () => {
|
|
3442
|
+
setIsSubmitting(true);
|
|
3443
|
+
await onExecuteMoveCopy(explorer.action, explorer.currentId, selectedIds);
|
|
3444
|
+
setSelectedIds([]);
|
|
3445
|
+
setExplorer((p) => ({ ...p, isOpen: false }));
|
|
3446
|
+
setIsSubmitting(false);
|
|
3445
3447
|
};
|
|
3446
3448
|
const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
|
|
3447
3449
|
const globalProgress = uploadQueue.length > 0 ? Math.round(uploadQueue.reduce((acc, job) => acc + job.progress, 0) / (uploadQueue.length * 100) * 100) : 0;
|
|
3448
|
-
const
|
|
3449
|
-
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
|
|
3454
|
-
}, 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: () => {
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
}, title: "
|
|
3458
|
-
"input",
|
|
3459
|
-
{
|
|
3460
|
-
type: "text",
|
|
3461
|
-
placeholder: "Search Drive...",
|
|
3462
|
-
className: "w-full pl-4 pr-10 py-2.5 text-xs bg-neutral-50 border border-neutral-100 rounded-full outline-none focus:border-black transition-colors",
|
|
3463
|
-
value: localSearch,
|
|
3464
|
-
onChange: (e) => setLocalSearch(e.target.value)
|
|
3465
|
-
}
|
|
3466
|
-
), 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: () => {
|
|
3450
|
+
const isUILocked = isLoading || isSubmitting;
|
|
3451
|
+
const lockClass = isUILocked ? "pointer-events-none opacity-60" : "";
|
|
3452
|
+
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 transition-opacity ${lockClass}` }, /* @__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" }, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: onRefresh, title: "Refresh Directory", 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.ReloadIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" }), selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, selectedIds.length === 1 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
|
|
3453
|
+
const item = items.find((i) => i.id === selectedIds[0]);
|
|
3454
|
+
if (item) setRenameModal({ isOpen: true, id: item.id, name: item.name });
|
|
3455
|
+
setFolderInputVal(item?.name || "");
|
|
3456
|
+
}, title: "Rename", 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.FileEditIcon, size: 18 })), /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => onShareItems(items.filter((i) => selectedIds.includes(i.id))), 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: () => openExplorer("copy"), 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: () => openExplorer("move"), title: "Move", 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.ArrowRight02Icon, 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: () => {
|
|
3457
|
+
setFolderInputVal("");
|
|
3458
|
+
setIsNewFolderModalOpen(true);
|
|
3459
|
+
}, 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 ${lockClass}` }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ import_react65.default.createElement("input", { type: "text", placeholder: "Search Drive...", value: localSearch, onChange: (e) => setLocalSearch(e.target.value), className: "w-full pl-4 pr-10 py-2.5 text-xs bg-neutral-50 border border-neutral-100 rounded-full outline-none focus:border-black transition-colors" })), 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: () => {
|
|
3467
3460
|
onMoveToTrash(selectedIds);
|
|
3468
3461
|
setSelectedIds([]);
|
|
3469
|
-
}, 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:
|
|
3470
|
-
|
|
3471
|
-
|
|
3472
|
-
|
|
3473
|
-
setSelectedIds([]);
|
|
3474
|
-
onNavigateFolder(crumb.id);
|
|
3475
|
-
},
|
|
3476
|
-
className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black" : ""}`
|
|
3477
|
-
},
|
|
3478
|
-
crumb.name
|
|
3479
|
-
)))), /* @__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) => {
|
|
3462
|
+
}, 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"))), /* @__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 ${lockClass}` }, 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("button", { onClick: () => {
|
|
3463
|
+
setSelectedIds([]);
|
|
3464
|
+
onNavigateFolder(crumb.id);
|
|
3465
|
+
}, className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black font-medium" : ""}` }, crumb.name)))), /* @__PURE__ */ import_react65.default.createElement("div", { className: `w-full overflow-x-auto select-none flex-1 relative min-h-[300px] ${lockClass}` }, /* @__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: () => items.length > 0 && (selectedIds.length === items.length ? setSelectedIds([]) : setSelectedIds(items.map((i) => i.id))), className: "rounded border-neutral-300 w-4 h-4 text-black focus:ring-black accent-black 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) => {
|
|
3480
3466
|
const isChecked = selectedIds.includes(item.id);
|
|
3481
|
-
return /* @__PURE__ */ import_react65.default.createElement(
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
|
|
3494
|
-
);
|
|
3495
|
-
}
|
|
3496
|
-
|
|
3497
|
-
{
|
|
3498
|
-
|
|
3499
|
-
value: newFolderName,
|
|
3500
|
-
onChange: setNewFolderName
|
|
3501
|
-
}
|
|
3502
|
-
), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ import_react65.default.createElement(
|
|
3503
|
-
"button",
|
|
3504
|
-
{
|
|
3505
|
-
type: "button",
|
|
3506
|
-
onClick: () => setIsNewFolderModalOpen(false),
|
|
3507
|
-
disabled: isCreatingFolder,
|
|
3508
|
-
className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors"
|
|
3509
|
-
},
|
|
3510
|
-
"Cancel"
|
|
3511
|
-
), /* @__PURE__ */ import_react65.default.createElement(
|
|
3512
|
-
ThreeDActionButton,
|
|
3513
|
-
{
|
|
3514
|
-
type: "submit",
|
|
3515
|
-
isLoading: isCreatingFolder,
|
|
3516
|
-
disabled: !newFolderName.trim()
|
|
3517
|
-
},
|
|
3518
|
-
"Create"
|
|
3519
|
-
)))));
|
|
3467
|
+
return /* @__PURE__ */ import_react65.default.createElement("tr", { key: item.id, onClick: (e) => handleRowClick(item.id, e), onDoubleClick: () => handleItemDoubleClick(item), onContextMenu: (e) => {
|
|
3468
|
+
e.preventDefault();
|
|
3469
|
+
setSelectedIds([item.id]);
|
|
3470
|
+
}, className: `hover:bg-neutral-50/70 transition-colors cursor-pointer group ${isChecked ? "bg-neutral-50" : ""}` }, /* @__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-300 w-4 h-4 text-black focus:ring-black accent-black cursor-pointer" })), /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3 flex items-center gap-3 min-w-0" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "w-8 h-8 shrink-0 bg-neutral-100 rounded-lg flex items-center justify-center relative" }, /* @__PURE__ */ import_react65.default.createElement(FileIconMapper, { type: item.type, mimeType: item.mimeType })), /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-xs text-black truncate pr-4" }, item.name)), /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3 text-xs text-neutral-500 whitespace-nowrap" }, formatDate3(item.updatedAt)), /* @__PURE__ */ import_react65.default.createElement("td", { className: "p-3 text-xs text-neutral-500 text-right whitespace-nowrap" }, formatBytes(item.size)));
|
|
3471
|
+
}))), 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 ${lockClass}` }, /* @__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, 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, 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" }, "Uploading Elements"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " 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 || renameModal.isOpen) && /* @__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: () => !isSubmitting && (setIsNewFolderModalOpen(false), setRenameModal({ isOpen: false, id: "", name: "" })) }), /* @__PURE__ */ import_react65.default.createElement("form", { onSubmit: async (e) => {
|
|
3472
|
+
e.preventDefault();
|
|
3473
|
+
if (!folderInputVal.trim() || isSubmitting) return;
|
|
3474
|
+
setIsSubmitting(true);
|
|
3475
|
+
if (isNewFolderModalOpen) await onCreateFolder(folderInputVal.trim());
|
|
3476
|
+
else await onRenameItem(renameModal.id, folderInputVal.trim());
|
|
3477
|
+
setFolderInputVal("");
|
|
3478
|
+
setIsSubmitting(false);
|
|
3479
|
+
setIsNewFolderModalOpen(false);
|
|
3480
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3481
|
+
}, 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" }, isNewFolderModalOpen ? "Create Directory" : "Rename Element"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[11px] text-neutral-400" }, "Please provide a valid alphanumeric name.")), /* @__PURE__ */ import_react65.default.createElement(TextInput, { placeholder: "Name (e.g., Q3 Invoices)", value: folderInputVal, onChange: setFolderInputVal }), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ import_react65.default.createElement("button", { type: "button", onClick: () => {
|
|
3482
|
+
setIsNewFolderModalOpen(false);
|
|
3483
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3484
|
+
}, disabled: isSubmitting, className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors" }, "Cancel"), /* @__PURE__ */ import_react65.default.createElement(ThreeDActionButton, { type: "submit", isLoading: isSubmitting, disabled: !folderInputVal.trim() }, isNewFolderModalOpen ? "Create" : "Rename")))), explorer.isOpen && /* @__PURE__ */ import_react65.default.createElement("div", { className: "fixed inset-0 z-[120] flex items-center justify-center p-4" }, /* @__PURE__ */ import_react65.default.createElement("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-sm", onClick: () => !isSubmitting && setExplorer((p) => ({ ...p, isOpen: false })) }), /* @__PURE__ */ import_react65.default.createElement("div", { className: "relative w-full max-w-md bg-white shadow-2xl rounded-2xl p-6 flex flex-col gap-4 animate-in zoom-in-95 duration-200 min-h-[400px]" }, /* @__PURE__ */ import_react65.default.createElement("div", null, /* @__PURE__ */ import_react65.default.createElement("h3", { className: "text-lg text-black tracking-tight mb-1 capitalize" }, explorer.action, " Items"), /* @__PURE__ */ import_react65.default.createElement("p", { className: "text-[11px] text-neutral-400" }, "Select destination directory.")), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-2 border-b border-neutral-100 text-neutral-400 whitespace-nowrap bg-neutral-50 px-3 rounded-lg" }, explorer.breadcrumbs.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("button", { disabled: explorer.loading, onClick: () => navigateExplorer(crumb.id), className: `hover:text-black outline-none ${idx === explorer.breadcrumbs.length - 1 ? "text-black font-medium" : ""}` }, crumb.name)))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex-1 overflow-y-auto border border-neutral-100 rounded-xl" }, explorer.loading ? /* @__PURE__ */ import_react65.default.createElement("div", { className: "h-full flex items-center justify-center p-10" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, className: "animate-spin text-neutral-400", size: 20 })) : explorer.folders.length === 0 ? /* @__PURE__ */ import_react65.default.createElement("div", { className: "h-full flex items-center justify-center p-10 text-xs text-neutral-400" }, "No sub-directories.") : /* @__PURE__ */ import_react65.default.createElement("div", { className: "divide-y divide-neutral-50" }, explorer.folders.map((f) => /* @__PURE__ */ import_react65.default.createElement("div", { key: f.id, onClick: () => navigateExplorer(f.id), className: "flex items-center gap-3 p-3 hover:bg-neutral-50 cursor-pointer transition-colors" }, /* @__PURE__ */ import_react65.default.createElement(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.FolderIcon, size: 16, className: "text-black" }), /* @__PURE__ */ import_react65.default.createElement("span", { className: "text-sm text-black truncate" }, f.name))))), /* @__PURE__ */ import_react65.default.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => setExplorer((p) => ({ ...p, isOpen: false })), disabled: isSubmitting, className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors" }, "Cancel"), /* @__PURE__ */ import_react65.default.createElement(ThreeDActionButton, { onClick: executeExplorerAction, isLoading: isSubmitting }, "Paste Here")))));
|
|
3520
3485
|
};
|
|
3521
3486
|
|
|
3522
3487
|
// src/components/DriveItemOpener.tsx
|
|
@@ -4541,7 +4506,7 @@ var ContentGridBlock = ({
|
|
|
4541
4506
|
middleBottomCard,
|
|
4542
4507
|
rightCards
|
|
4543
4508
|
}) => {
|
|
4544
|
-
return /* @__PURE__ */ import_react83.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react83.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "bg-
|
|
4509
|
+
return /* @__PURE__ */ import_react83.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react83.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "bg-orange-50 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react83.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react83.default.createElement("div", null, /* @__PURE__ */ import_react83.default.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react83.default.createElement(import_image13.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react83.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react83.default.createElement(import_image13.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react83.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_react83.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "bg-red-50 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react83.default.createElement("div", null, /* @__PURE__ */ import_react83.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react83.default.createElement(import_image13.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react83.default.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react83.default.createElement(
|
|
4545
4510
|
ImageWithLoader2,
|
|
4546
4511
|
{
|
|
4547
4512
|
src: card.bgImageSrc,
|
package/dist/index.mjs
CHANGED
|
@@ -3274,16 +3274,17 @@ import {
|
|
|
3274
3274
|
Delete02Icon as Delete02Icon2,
|
|
3275
3275
|
Upload02Icon,
|
|
3276
3276
|
FolderAddIcon,
|
|
3277
|
-
Cancel01Icon as Cancel01Icon3,
|
|
3278
3277
|
FolderIcon as FolderIcon2,
|
|
3279
3278
|
Loading03Icon as Loading03Icon12,
|
|
3280
3279
|
ArrowLeft01Icon as ArrowLeft01Icon8,
|
|
3281
3280
|
ArrowRight01Icon as ArrowRight01Icon7,
|
|
3282
3281
|
Copy01Icon,
|
|
3283
|
-
Scissor01Icon,
|
|
3284
|
-
FilePasteIcon,
|
|
3285
3282
|
Share01Icon,
|
|
3286
|
-
Tick01Icon
|
|
3283
|
+
Tick01Icon,
|
|
3284
|
+
FileEditIcon,
|
|
3285
|
+
ArrowRight02Icon,
|
|
3286
|
+
Cancel01Icon as Cancel01Icon3,
|
|
3287
|
+
ReloadIcon
|
|
3287
3288
|
} from "@hugeicons/core-free-icons";
|
|
3288
3289
|
|
|
3289
3290
|
// src/components/FileIconMapper.tsx
|
|
@@ -3339,7 +3340,6 @@ var FileIconMapper = ({ type, mimeType }) => {
|
|
|
3339
3340
|
|
|
3340
3341
|
// src/components/UniversalDriveView.tsx
|
|
3341
3342
|
var UniversalDriveView = ({
|
|
3342
|
-
currentFolderId,
|
|
3343
3343
|
folderBreadcrumbs,
|
|
3344
3344
|
items,
|
|
3345
3345
|
uploadQueue,
|
|
@@ -3350,35 +3350,39 @@ var UniversalDriveView = ({
|
|
|
3350
3350
|
onSearchChange,
|
|
3351
3351
|
onNavigateFolder,
|
|
3352
3352
|
onCreateFolder,
|
|
3353
|
+
onRenameItem,
|
|
3353
3354
|
onUploadFiles,
|
|
3354
3355
|
onMoveToTrash,
|
|
3355
3356
|
onClearUploadQueue,
|
|
3356
3357
|
onPageChange,
|
|
3357
|
-
|
|
3358
|
-
|
|
3359
|
-
|
|
3360
|
-
clipboardCount,
|
|
3358
|
+
onRefresh,
|
|
3359
|
+
onFetchFoldersForExplorer,
|
|
3360
|
+
onExecuteMoveCopy,
|
|
3361
3361
|
onOpenFile,
|
|
3362
3362
|
onShareItems
|
|
3363
3363
|
}) => {
|
|
3364
3364
|
const [selectedIds, setSelectedIds] = useState24([]);
|
|
3365
|
-
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = useState24(false);
|
|
3366
|
-
const [newFolderName, setNewFolderName] = useState24("");
|
|
3367
|
-
const [isCreatingFolder, setIsCreatingFolder] = useState24(false);
|
|
3368
3365
|
const [localSearch, setLocalSearch] = useState24(searchQuery);
|
|
3369
|
-
const [
|
|
3370
|
-
const [
|
|
3366
|
+
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = useState24(false);
|
|
3367
|
+
const [renameModal, setRenameModal] = useState24({ isOpen: false, id: "", name: "" });
|
|
3368
|
+
const [folderInputVal, setFolderInputVal] = useState24("");
|
|
3369
|
+
const [isSubmitting, setIsSubmitting] = useState24(false);
|
|
3370
|
+
const [explorer, setExplorer] = useState24({
|
|
3371
|
+
isOpen: false,
|
|
3372
|
+
action: "copy",
|
|
3373
|
+
currentId: null,
|
|
3374
|
+
folders: [],
|
|
3375
|
+
breadcrumbs: [],
|
|
3376
|
+
loading: false
|
|
3377
|
+
});
|
|
3371
3378
|
useEffect16(() => {
|
|
3372
|
-
if (localSearch !== searchQuery)
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
|
|
3377
|
-
|
|
3379
|
+
if (localSearch !== searchQuery) {
|
|
3380
|
+
const delay = setTimeout(() => {
|
|
3381
|
+
onSearchChange(localSearch);
|
|
3382
|
+
}, 1500);
|
|
3383
|
+
return () => clearTimeout(delay);
|
|
3384
|
+
}
|
|
3378
3385
|
}, [localSearch, onSearchChange, searchQuery]);
|
|
3379
|
-
useEffect16(() => {
|
|
3380
|
-
if (!isLoading) setLoadingFolderId(null);
|
|
3381
|
-
}, [isLoading]);
|
|
3382
3386
|
const formatBytes = (bytes) => {
|
|
3383
3387
|
const num = Number(bytes);
|
|
3384
3388
|
if (num === 0) return "0 Bytes";
|
|
@@ -3388,11 +3392,7 @@ var UniversalDriveView = ({
|
|
|
3388
3392
|
return parseFloat((num / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
|
|
3389
3393
|
};
|
|
3390
3394
|
const formatDate3 = (dateString) => {
|
|
3391
|
-
return new Date(dateString).toLocaleDateString("en-US", {
|
|
3392
|
-
month: "short",
|
|
3393
|
-
day: "numeric",
|
|
3394
|
-
year: "numeric"
|
|
3395
|
-
});
|
|
3395
|
+
return new Date(dateString).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
|
|
3396
3396
|
};
|
|
3397
3397
|
const handleRowClick = (id, e) => {
|
|
3398
3398
|
if (e.ctrlKey || e.metaKey) {
|
|
@@ -3407,100 +3407,66 @@ var UniversalDriveView = ({
|
|
|
3407
3407
|
};
|
|
3408
3408
|
const handleItemDoubleClick = (item) => {
|
|
3409
3409
|
if (item.type === "FOLDER") {
|
|
3410
|
-
setLoadingFolderId(item.id);
|
|
3411
3410
|
setSelectedIds([]);
|
|
3412
3411
|
onNavigateFolder(item.id);
|
|
3413
3412
|
} else {
|
|
3414
3413
|
onOpenFile(item);
|
|
3415
3414
|
}
|
|
3416
3415
|
};
|
|
3417
|
-
const
|
|
3418
|
-
|
|
3419
|
-
|
|
3416
|
+
const openExplorer = async (action) => {
|
|
3417
|
+
setExplorer((p) => ({ ...p, isOpen: true, action, loading: true, currentId: null }));
|
|
3418
|
+
const data = await onFetchFoldersForExplorer(null);
|
|
3419
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3420
3420
|
};
|
|
3421
|
-
const
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3426
|
-
|
|
3427
|
-
|
|
3428
|
-
|
|
3421
|
+
const navigateExplorer = async (folderId) => {
|
|
3422
|
+
setExplorer((p) => ({ ...p, loading: true, currentId: folderId }));
|
|
3423
|
+
const data = await onFetchFoldersForExplorer(folderId);
|
|
3424
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3425
|
+
};
|
|
3426
|
+
const executeExplorerAction = async () => {
|
|
3427
|
+
setIsSubmitting(true);
|
|
3428
|
+
await onExecuteMoveCopy(explorer.action, explorer.currentId, selectedIds);
|
|
3429
|
+
setSelectedIds([]);
|
|
3430
|
+
setExplorer((p) => ({ ...p, isOpen: false }));
|
|
3431
|
+
setIsSubmitting(false);
|
|
3429
3432
|
};
|
|
3430
3433
|
const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
|
|
3431
3434
|
const globalProgress = uploadQueue.length > 0 ? Math.round(uploadQueue.reduce((acc, job) => acc + job.progress, 0) / (uploadQueue.length * 100) * 100) : 0;
|
|
3432
|
-
const
|
|
3433
|
-
|
|
3434
|
-
|
|
3435
|
-
|
|
3436
|
-
|
|
3437
|
-
|
|
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: () => {
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
}, title: "
|
|
3442
|
-
"input",
|
|
3443
|
-
{
|
|
3444
|
-
type: "text",
|
|
3445
|
-
placeholder: "Search Drive...",
|
|
3446
|
-
className: "w-full pl-4 pr-10 py-2.5 text-xs bg-neutral-50 border border-neutral-100 rounded-full outline-none focus:border-black transition-colors",
|
|
3447
|
-
value: localSearch,
|
|
3448
|
-
onChange: (e) => setLocalSearch(e.target.value)
|
|
3449
|
-
}
|
|
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: () => {
|
|
3435
|
+
const isUILocked = isLoading || isSubmitting;
|
|
3436
|
+
const lockClass = isUILocked ? "pointer-events-none opacity-60" : "";
|
|
3437
|
+
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 transition-opacity ${lockClass}` }, /* @__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" }, /* @__PURE__ */ React40.createElement("button", { onClick: onRefresh, title: "Refresh Directory", 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: ReloadIcon, size: 18 })), /* @__PURE__ */ React40.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" }), selectedIds.length > 0 && /* @__PURE__ */ React40.createElement(React40.Fragment, null, selectedIds.length === 1 && /* @__PURE__ */ React40.createElement("button", { onClick: () => {
|
|
3438
|
+
const item = items.find((i) => i.id === selectedIds[0]);
|
|
3439
|
+
if (item) setRenameModal({ isOpen: true, id: item.id, name: item.name });
|
|
3440
|
+
setFolderInputVal(item?.name || "");
|
|
3441
|
+
}, title: "Rename", 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: FileEditIcon, size: 18 })), /* @__PURE__ */ React40.createElement("button", { onClick: () => onShareItems(items.filter((i) => selectedIds.includes(i.id))), 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: () => openExplorer("copy"), 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: () => openExplorer("move"), title: "Move", 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: ArrowRight02Icon, size: 18 })), /* @__PURE__ */ React40.createElement("div", { className: "w-px h-6 bg-neutral-200 mx-1" })), /* @__PURE__ */ React40.createElement("button", { onClick: () => {
|
|
3442
|
+
setFolderInputVal("");
|
|
3443
|
+
setIsNewFolderModalOpen(true);
|
|
3444
|
+
}, 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 ${lockClass}` }, /* @__PURE__ */ React40.createElement("div", { className: "w-full sm:max-w-xs relative" }, /* @__PURE__ */ React40.createElement("input", { type: "text", placeholder: "Search Drive...", value: localSearch, onChange: (e) => setLocalSearch(e.target.value), className: "w-full pl-4 pr-10 py-2.5 text-xs bg-neutral-50 border border-neutral-100 rounded-full outline-none focus:border-black transition-colors" })), 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: () => {
|
|
3451
3445
|
onMoveToTrash(selectedIds);
|
|
3452
3446
|
setSelectedIds([]);
|
|
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:
|
|
3454
|
-
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
setSelectedIds([]);
|
|
3458
|
-
onNavigateFolder(crumb.id);
|
|
3459
|
-
},
|
|
3460
|
-
className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black" : ""}`
|
|
3461
|
-
},
|
|
3462
|
-
crumb.name
|
|
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) => {
|
|
3447
|
+
}, 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"))), /* @__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 ${lockClass}` }, folderBreadcrumbs.map((crumb, idx) => /* @__PURE__ */ React40.createElement(React40.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ React40.createElement("span", null, "/"), /* @__PURE__ */ React40.createElement("button", { onClick: () => {
|
|
3448
|
+
setSelectedIds([]);
|
|
3449
|
+
onNavigateFolder(crumb.id);
|
|
3450
|
+
}, className: `hover:text-black transition-colors outline-none ${idx === folderBreadcrumbs.length - 1 ? "text-black font-medium" : ""}` }, crumb.name)))), /* @__PURE__ */ React40.createElement("div", { className: `w-full overflow-x-auto select-none flex-1 relative min-h-[300px] ${lockClass}` }, /* @__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: () => items.length > 0 && (selectedIds.length === items.length ? setSelectedIds([]) : setSelectedIds(items.map((i) => i.id))), className: "rounded border-neutral-300 w-4 h-4 text-black focus:ring-black accent-black 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) => {
|
|
3464
3451
|
const isChecked = selectedIds.includes(item.id);
|
|
3465
|
-
return /* @__PURE__ */ React40.createElement(
|
|
3466
|
-
|
|
3467
|
-
|
|
3468
|
-
|
|
3469
|
-
|
|
3470
|
-
|
|
3471
|
-
|
|
3472
|
-
|
|
3473
|
-
|
|
3474
|
-
|
|
3475
|
-
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
);
|
|
3479
|
-
}
|
|
3480
|
-
|
|
3481
|
-
{
|
|
3482
|
-
|
|
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"
|
|
3493
|
-
},
|
|
3494
|
-
"Cancel"
|
|
3495
|
-
), /* @__PURE__ */ React40.createElement(
|
|
3496
|
-
ThreeDActionButton,
|
|
3497
|
-
{
|
|
3498
|
-
type: "submit",
|
|
3499
|
-
isLoading: isCreatingFolder,
|
|
3500
|
-
disabled: !newFolderName.trim()
|
|
3501
|
-
},
|
|
3502
|
-
"Create"
|
|
3503
|
-
)))));
|
|
3452
|
+
return /* @__PURE__ */ React40.createElement("tr", { key: item.id, onClick: (e) => handleRowClick(item.id, e), onDoubleClick: () => handleItemDoubleClick(item), onContextMenu: (e) => {
|
|
3453
|
+
e.preventDefault();
|
|
3454
|
+
setSelectedIds([item.id]);
|
|
3455
|
+
}, className: `hover:bg-neutral-50/70 transition-colors cursor-pointer group ${isChecked ? "bg-neutral-50" : ""}` }, /* @__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-300 w-4 h-4 text-black focus:ring-black accent-black cursor-pointer" })), /* @__PURE__ */ React40.createElement("td", { className: "p-3 flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React40.createElement("div", { className: "w-8 h-8 shrink-0 bg-neutral-100 rounded-lg flex items-center justify-center relative" }, /* @__PURE__ */ React40.createElement(FileIconMapper, { type: item.type, mimeType: item.mimeType })), /* @__PURE__ */ React40.createElement("span", { className: "text-xs text-black truncate pr-4" }, item.name)), /* @__PURE__ */ React40.createElement("td", { className: "p-3 text-xs text-neutral-500 whitespace-nowrap" }, formatDate3(item.updatedAt)), /* @__PURE__ */ React40.createElement("td", { className: "p-3 text-xs text-neutral-500 text-right whitespace-nowrap" }, formatBytes(item.size)));
|
|
3456
|
+
}))), 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 ${lockClass}` }, /* @__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, 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, 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" }, "Uploading Elements"), /* @__PURE__ */ React40.createElement("p", { className: "text-[10px] text-neutral-500 mt-0.5" }, "Processing ", activeJobs.length, " 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 || renameModal.isOpen) && /* @__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: () => !isSubmitting && (setIsNewFolderModalOpen(false), setRenameModal({ isOpen: false, id: "", name: "" })) }), /* @__PURE__ */ React40.createElement("form", { onSubmit: async (e) => {
|
|
3457
|
+
e.preventDefault();
|
|
3458
|
+
if (!folderInputVal.trim() || isSubmitting) return;
|
|
3459
|
+
setIsSubmitting(true);
|
|
3460
|
+
if (isNewFolderModalOpen) await onCreateFolder(folderInputVal.trim());
|
|
3461
|
+
else await onRenameItem(renameModal.id, folderInputVal.trim());
|
|
3462
|
+
setFolderInputVal("");
|
|
3463
|
+
setIsSubmitting(false);
|
|
3464
|
+
setIsNewFolderModalOpen(false);
|
|
3465
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3466
|
+
}, 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" }, isNewFolderModalOpen ? "Create Directory" : "Rename Element"), /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400" }, "Please provide a valid alphanumeric name.")), /* @__PURE__ */ React40.createElement(TextInput, { placeholder: "Name (e.g., Q3 Invoices)", value: folderInputVal, onChange: setFolderInputVal }), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ React40.createElement("button", { type: "button", onClick: () => {
|
|
3467
|
+
setIsNewFolderModalOpen(false);
|
|
3468
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3469
|
+
}, disabled: isSubmitting, className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors" }, "Cancel"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { type: "submit", isLoading: isSubmitting, disabled: !folderInputVal.trim() }, isNewFolderModalOpen ? "Create" : "Rename")))), explorer.isOpen && /* @__PURE__ */ React40.createElement("div", { className: "fixed inset-0 z-[120] flex items-center justify-center p-4" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/40 backdrop-blur-sm", onClick: () => !isSubmitting && setExplorer((p) => ({ ...p, isOpen: false })) }), /* @__PURE__ */ React40.createElement("div", { className: "relative w-full max-w-md bg-white shadow-2xl rounded-2xl p-6 flex flex-col gap-4 animate-in zoom-in-95 duration-200 min-h-[400px]" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h3", { className: "text-lg text-black tracking-tight mb-1 capitalize" }, explorer.action, " Items"), /* @__PURE__ */ React40.createElement("p", { className: "text-[11px] text-neutral-400" }, "Select destination directory.")), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-1.5 overflow-x-auto text-xs py-2 border-b border-neutral-100 text-neutral-400 whitespace-nowrap bg-neutral-50 px-3 rounded-lg" }, explorer.breadcrumbs.map((crumb, idx) => /* @__PURE__ */ React40.createElement(React40.Fragment, { key: idx }, idx > 0 && /* @__PURE__ */ React40.createElement("span", null, "/"), /* @__PURE__ */ React40.createElement("button", { disabled: explorer.loading, onClick: () => navigateExplorer(crumb.id), className: `hover:text-black outline-none ${idx === explorer.breadcrumbs.length - 1 ? "text-black font-medium" : ""}` }, crumb.name)))), /* @__PURE__ */ React40.createElement("div", { className: "flex-1 overflow-y-auto border border-neutral-100 rounded-xl" }, explorer.loading ? /* @__PURE__ */ React40.createElement("div", { className: "h-full flex items-center justify-center p-10" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, className: "animate-spin text-neutral-400", size: 20 })) : explorer.folders.length === 0 ? /* @__PURE__ */ React40.createElement("div", { className: "h-full flex items-center justify-center p-10 text-xs text-neutral-400" }, "No sub-directories.") : /* @__PURE__ */ React40.createElement("div", { className: "divide-y divide-neutral-50" }, explorer.folders.map((f) => /* @__PURE__ */ React40.createElement("div", { key: f.id, onClick: () => navigateExplorer(f.id), className: "flex items-center gap-3 p-3 hover:bg-neutral-50 cursor-pointer transition-colors" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: FolderIcon2, size: 16, className: "text-black" }), /* @__PURE__ */ React40.createElement("span", { className: "text-sm text-black truncate" }, f.name))))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-end gap-3 mt-2" }, /* @__PURE__ */ React40.createElement("button", { onClick: () => setExplorer((p) => ({ ...p, isOpen: false })), disabled: isSubmitting, className: "px-6 py-2.5 text-xs text-neutral-500 hover:bg-neutral-50 rounded-full outline-none disabled:opacity-50 transition-colors" }, "Cancel"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: executeExplorerAction, isLoading: isSubmitting }, "Paste Here")))));
|
|
3504
3470
|
};
|
|
3505
3471
|
|
|
3506
3472
|
// src/components/DriveItemOpener.tsx
|
|
@@ -3592,7 +3558,7 @@ var Stagger = ({ steps, currentStep }) => {
|
|
|
3592
3558
|
};
|
|
3593
3559
|
|
|
3594
3560
|
// src/components/UniversalRegistrationFlow.tsx
|
|
3595
|
-
import React46, { useState as useState26, useEffect as useEffect17, useRef as
|
|
3561
|
+
import React46, { useState as useState26, useEffect as useEffect17, useRef as useRef11 } from "react";
|
|
3596
3562
|
import toast6 from "react-hot-toast";
|
|
3597
3563
|
import { HugeiconsIcon as HugeiconsIcon31 } from "@hugeicons/react";
|
|
3598
3564
|
import { CheckmarkBadge01Icon as CheckmarkBadge01Icon2, Upload01Icon as Upload01Icon3, Loading03Icon as Loading03Icon14, PencilEdit01Icon as PencilEdit01Icon2, Delete02Icon as Delete02Icon3, SignatureIcon, IdentificationIcon, ArrowLeft01Icon as ArrowLeft01Icon9, HourglassIcon } from "@hugeicons/core-free-icons";
|
|
@@ -3624,12 +3590,12 @@ var UniversalRegistrationFlow = ({
|
|
|
3624
3590
|
passportApproved: false,
|
|
3625
3591
|
signatureApproved: false
|
|
3626
3592
|
});
|
|
3627
|
-
const idRef =
|
|
3628
|
-
const passportRef =
|
|
3629
|
-
const signatureRef =
|
|
3630
|
-
const other1Ref =
|
|
3631
|
-
const other2Ref =
|
|
3632
|
-
const other3Ref =
|
|
3593
|
+
const idRef = useRef11(null);
|
|
3594
|
+
const passportRef = useRef11(null);
|
|
3595
|
+
const signatureRef = useRef11(null);
|
|
3596
|
+
const other1Ref = useRef11(null);
|
|
3597
|
+
const other2Ref = useRef11(null);
|
|
3598
|
+
const other3Ref = useRef11(null);
|
|
3633
3599
|
const [formData, setFormData] = useState26({
|
|
3634
3600
|
businessDesc: "",
|
|
3635
3601
|
natureOfBusiness: null,
|
|
@@ -4351,7 +4317,7 @@ SECRET_KEY="${secKey}"
|
|
|
4351
4317
|
};
|
|
4352
4318
|
|
|
4353
4319
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
4354
|
-
import React48, { useState as useState28, useEffect as useEffect19, useRef as
|
|
4320
|
+
import React48, { useState as useState28, useEffect as useEffect19, useRef as useRef12 } from "react";
|
|
4355
4321
|
import Image11 from "next/image";
|
|
4356
4322
|
var MedicalFeatureStatsBlock = ({
|
|
4357
4323
|
bottomHeadline,
|
|
@@ -4361,7 +4327,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
4361
4327
|
stats
|
|
4362
4328
|
}) => {
|
|
4363
4329
|
const [isAnimating, setIsAnimating] = useState28(false);
|
|
4364
|
-
const titleRef =
|
|
4330
|
+
const titleRef = useRef12(null);
|
|
4365
4331
|
useEffect19(() => {
|
|
4366
4332
|
const observer = new IntersectionObserver(
|
|
4367
4333
|
([entry]) => {
|
|
@@ -4525,7 +4491,7 @@ var ContentGridBlock = ({
|
|
|
4525
4491
|
middleBottomCard,
|
|
4526
4492
|
rightCards
|
|
4527
4493
|
}) => {
|
|
4528
|
-
return /* @__PURE__ */ React50.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React50.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React50.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React50.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React50.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React50.createElement("div", { className: "bg-
|
|
4494
|
+
return /* @__PURE__ */ React50.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ React50.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ React50.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ React50.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ React50.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ React50.createElement("div", { className: "bg-orange-50 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React50.createElement("p", { className: "text-[17px] text-black leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ React50.createElement("span", { className: "mb-auto text-[11px] text-neutral-400 uppercase tracking-widest" }, leftCard.tag), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ React50.createElement("div", null, /* @__PURE__ */ React50.createElement("h4", { className: "text-[15px] text-black" }, leftCard.title), /* @__PURE__ */ React50.createElement("p", { className: "text-[13px] text-neutral-400" }, leftCard.subtitle)), /* @__PURE__ */ React50.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React50.createElement(Image13, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React50.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ React50.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ React50.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ React50.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React50.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ React50.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ React50.createElement(Image13, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ React50.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ React50.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ React50.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__ */ React50.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ React50.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React50.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ React50.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ React50.createElement("div", { className: "bg-red-50 rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ React50.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ React50.createElement("div", null, /* @__PURE__ */ React50.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ React50.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ React50.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ React50.createElement(Image13, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ React50.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React50.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ React50.createElement("span", { className: "text-[11px] text-neutral-400 uppercase tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ React50.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ React50.createElement("div", { key: idx, className: "relative w-full h-80 rounded-3xl overflow-hidden group" }, /* @__PURE__ */ React50.createElement(
|
|
4529
4495
|
ImageWithLoader2,
|
|
4530
4496
|
{
|
|
4531
4497
|
src: card.bgImageSrc,
|