@retinalabsllc/zairusjs 1.3.0 → 1.3.1
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 +6 -5
- package/dist/index.d.ts +6 -5
- package/dist/index.js +69 -105
- package/dist/index.mjs +81 -118
- 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,16 @@ 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
|
+
onFetchFoldersForExplorer: (folderId: string | null) => Promise<{
|
|
899
|
+
folders: DriveItem[];
|
|
900
|
+
breadcrumbs: any[];
|
|
901
|
+
}>;
|
|
902
|
+
onExecuteMoveCopy: (action: 'copy' | 'move', targetFolderId: string | null, itemIds: string[]) => Promise<void>;
|
|
902
903
|
onOpenFile: (item: DriveItem) => void;
|
|
903
904
|
onShareItems: (items: DriveItem[]) => void;
|
|
904
905
|
}
|
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,16 @@ 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
|
+
onFetchFoldersForExplorer: (folderId: string | null) => Promise<{
|
|
899
|
+
folders: DriveItem[];
|
|
900
|
+
breadcrumbs: any[];
|
|
901
|
+
}>;
|
|
902
|
+
onExecuteMoveCopy: (action: 'copy' | 'move', targetFolderId: string | null, itemIds: string[]) => Promise<void>;
|
|
902
903
|
onOpenFile: (item: DriveItem) => void;
|
|
903
904
|
onShareItems: (items: DriveItem[]) => void;
|
|
904
905
|
}
|
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,38 @@ 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
|
-
onPasteItems,
|
|
3376
|
-
clipboardCount,
|
|
3373
|
+
onFetchFoldersForExplorer,
|
|
3374
|
+
onExecuteMoveCopy,
|
|
3377
3375
|
onOpenFile,
|
|
3378
3376
|
onShareItems
|
|
3379
3377
|
}) => {
|
|
3380
3378
|
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
3379
|
const [localSearch, setLocalSearch] = (0, import_react65.useState)(searchQuery);
|
|
3385
|
-
const [
|
|
3386
|
-
const [
|
|
3380
|
+
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = (0, import_react65.useState)(false);
|
|
3381
|
+
const [renameModal, setRenameModal] = (0, import_react65.useState)({ isOpen: false, id: "", name: "" });
|
|
3382
|
+
const [folderInputVal, setFolderInputVal] = (0, import_react65.useState)("");
|
|
3383
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react65.useState)(false);
|
|
3384
|
+
const [explorer, setExplorer] = (0, import_react65.useState)({
|
|
3385
|
+
isOpen: false,
|
|
3386
|
+
action: "copy",
|
|
3387
|
+
currentId: null,
|
|
3388
|
+
folders: [],
|
|
3389
|
+
breadcrumbs: [],
|
|
3390
|
+
loading: false
|
|
3391
|
+
});
|
|
3387
3392
|
(0, import_react65.useEffect)(() => {
|
|
3388
|
-
if (localSearch !== searchQuery)
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3393
|
+
if (localSearch !== searchQuery) {
|
|
3394
|
+
const delay = setTimeout(() => {
|
|
3395
|
+
onSearchChange(localSearch);
|
|
3396
|
+
}, 1500);
|
|
3397
|
+
return () => clearTimeout(delay);
|
|
3398
|
+
}
|
|
3394
3399
|
}, [localSearch, onSearchChange, searchQuery]);
|
|
3395
|
-
(0, import_react65.useEffect)(() => {
|
|
3396
|
-
if (!isLoading) setLoadingFolderId(null);
|
|
3397
|
-
}, [isLoading]);
|
|
3398
3400
|
const formatBytes = (bytes) => {
|
|
3399
3401
|
const num = Number(bytes);
|
|
3400
3402
|
if (num === 0) return "0 Bytes";
|
|
@@ -3417,106 +3419,68 @@ var UniversalDriveView = ({
|
|
|
3417
3419
|
setSelectedIds([id]);
|
|
3418
3420
|
}
|
|
3419
3421
|
};
|
|
3420
|
-
const handleSelectAll = () => {
|
|
3421
|
-
if (selectedIds.length === items.length && items.length > 0) setSelectedIds([]);
|
|
3422
|
-
else setSelectedIds(items.map((i) => i.id));
|
|
3423
|
-
};
|
|
3424
3422
|
const handleItemDoubleClick = (item) => {
|
|
3425
3423
|
if (item.type === "FOLDER") {
|
|
3426
|
-
setLoadingFolderId(item.id);
|
|
3427
3424
|
setSelectedIds([]);
|
|
3428
3425
|
onNavigateFolder(item.id);
|
|
3429
3426
|
} else {
|
|
3430
3427
|
onOpenFile(item);
|
|
3431
3428
|
}
|
|
3432
3429
|
};
|
|
3433
|
-
const
|
|
3434
|
-
|
|
3435
|
-
|
|
3430
|
+
const openExplorer = async (action) => {
|
|
3431
|
+
setExplorer((p) => ({ ...p, isOpen: true, action, loading: true, currentId: null }));
|
|
3432
|
+
const data = await onFetchFoldersForExplorer(null);
|
|
3433
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3436
3434
|
};
|
|
3437
|
-
const
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3435
|
+
const navigateExplorer = async (folderId) => {
|
|
3436
|
+
setExplorer((p) => ({ ...p, loading: true, currentId: folderId }));
|
|
3437
|
+
const data = await onFetchFoldersForExplorer(folderId);
|
|
3438
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3439
|
+
};
|
|
3440
|
+
const executeExplorerAction = async () => {
|
|
3441
|
+
setIsSubmitting(true);
|
|
3442
|
+
await onExecuteMoveCopy(explorer.action, explorer.currentId, selectedIds);
|
|
3443
|
+
setSelectedIds([]);
|
|
3444
|
+
setExplorer((p) => ({ ...p, isOpen: false }));
|
|
3445
|
+
setIsSubmitting(false);
|
|
3445
3446
|
};
|
|
3446
3447
|
const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
|
|
3447
3448
|
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: () => {
|
|
3449
|
+
const isUILocked = isLoading || isSubmitting;
|
|
3450
|
+
const lockClass = isUILocked ? "pointer-events-none opacity-60" : "";
|
|
3451
|
+
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" }, selectedIds.length > 0 && /* @__PURE__ */ import_react65.default.createElement(import_react65.default.Fragment, null, selectedIds.length === 1 && /* @__PURE__ */ import_react65.default.createElement("button", { onClick: () => {
|
|
3452
|
+
const item = items.find((i) => i.id === selectedIds[0]);
|
|
3453
|
+
if (item) setRenameModal({ isOpen: true, id: item.id, name: item.name });
|
|
3454
|
+
setFolderInputVal(item?.name || "");
|
|
3455
|
+
}, 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: () => {
|
|
3456
|
+
setFolderInputVal("");
|
|
3457
|
+
setIsNewFolderModalOpen(true);
|
|
3458
|
+
}, 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
3459
|
onMoveToTrash(selectedIds);
|
|
3468
3460
|
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) => {
|
|
3461
|
+
}, 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: () => {
|
|
3462
|
+
setSelectedIds([]);
|
|
3463
|
+
onNavigateFolder(crumb.id);
|
|
3464
|
+
}, 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-75 ${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" }, 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(import_react66.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 28, className: "animate-spin text-neutral-400 mx-auto" }))) : items.length === 0 ? /* @__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
3465
|
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
|
-
)))));
|
|
3466
|
+
return /* @__PURE__ */ import_react65.default.createElement("tr", { key: item.id, onClick: (e) => handleRowClick(item.id, e), onDoubleClick: () => handleItemDoubleClick(item), onContextMenu: (e) => {
|
|
3467
|
+
e.preventDefault();
|
|
3468
|
+
setSelectedIds([item.id]);
|
|
3469
|
+
}, 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)));
|
|
3470
|
+
})))), /* @__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"))), /* @__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) => {
|
|
3471
|
+
e.preventDefault();
|
|
3472
|
+
if (!folderInputVal.trim() || isSubmitting) return;
|
|
3473
|
+
setIsSubmitting(true);
|
|
3474
|
+
if (isNewFolderModalOpen) await onCreateFolder(folderInputVal.trim());
|
|
3475
|
+
else await onRenameItem(renameModal.id, folderInputVal.trim());
|
|
3476
|
+
setFolderInputVal("");
|
|
3477
|
+
setIsSubmitting(false);
|
|
3478
|
+
setIsNewFolderModalOpen(false);
|
|
3479
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3480
|
+
}, 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: () => {
|
|
3481
|
+
setIsNewFolderModalOpen(false);
|
|
3482
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3483
|
+
}, 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-100" }, /* @__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
3484
|
};
|
|
3521
3485
|
|
|
3522
3486
|
// src/components/DriveItemOpener.tsx
|
|
@@ -4541,7 +4505,7 @@ var ContentGridBlock = ({
|
|
|
4541
4505
|
middleBottomCard,
|
|
4542
4506
|
rightCards
|
|
4543
4507
|
}) => {
|
|
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-
|
|
4508
|
+
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
4509
|
ImageWithLoader2,
|
|
4546
4510
|
{
|
|
4547
4511
|
src: card.bgImageSrc,
|
package/dist/index.mjs
CHANGED
|
@@ -3274,16 +3274,15 @@ 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
|
|
3287
3286
|
} from "@hugeicons/core-free-icons";
|
|
3288
3287
|
|
|
3289
3288
|
// src/components/FileIconMapper.tsx
|
|
@@ -3339,7 +3338,6 @@ var FileIconMapper = ({ type, mimeType }) => {
|
|
|
3339
3338
|
|
|
3340
3339
|
// src/components/UniversalDriveView.tsx
|
|
3341
3340
|
var UniversalDriveView = ({
|
|
3342
|
-
currentFolderId,
|
|
3343
3341
|
folderBreadcrumbs,
|
|
3344
3342
|
items,
|
|
3345
3343
|
uploadQueue,
|
|
@@ -3350,35 +3348,38 @@ var UniversalDriveView = ({
|
|
|
3350
3348
|
onSearchChange,
|
|
3351
3349
|
onNavigateFolder,
|
|
3352
3350
|
onCreateFolder,
|
|
3351
|
+
onRenameItem,
|
|
3353
3352
|
onUploadFiles,
|
|
3354
3353
|
onMoveToTrash,
|
|
3355
3354
|
onClearUploadQueue,
|
|
3356
3355
|
onPageChange,
|
|
3357
|
-
|
|
3358
|
-
|
|
3359
|
-
onPasteItems,
|
|
3360
|
-
clipboardCount,
|
|
3356
|
+
onFetchFoldersForExplorer,
|
|
3357
|
+
onExecuteMoveCopy,
|
|
3361
3358
|
onOpenFile,
|
|
3362
3359
|
onShareItems
|
|
3363
3360
|
}) => {
|
|
3364
3361
|
const [selectedIds, setSelectedIds] = useState24([]);
|
|
3365
|
-
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = useState24(false);
|
|
3366
|
-
const [newFolderName, setNewFolderName] = useState24("");
|
|
3367
|
-
const [isCreatingFolder, setIsCreatingFolder] = useState24(false);
|
|
3368
3362
|
const [localSearch, setLocalSearch] = useState24(searchQuery);
|
|
3369
|
-
const [
|
|
3370
|
-
const [
|
|
3363
|
+
const [isNewFolderModalOpen, setIsNewFolderModalOpen] = useState24(false);
|
|
3364
|
+
const [renameModal, setRenameModal] = useState24({ isOpen: false, id: "", name: "" });
|
|
3365
|
+
const [folderInputVal, setFolderInputVal] = useState24("");
|
|
3366
|
+
const [isSubmitting, setIsSubmitting] = useState24(false);
|
|
3367
|
+
const [explorer, setExplorer] = useState24({
|
|
3368
|
+
isOpen: false,
|
|
3369
|
+
action: "copy",
|
|
3370
|
+
currentId: null,
|
|
3371
|
+
folders: [],
|
|
3372
|
+
breadcrumbs: [],
|
|
3373
|
+
loading: false
|
|
3374
|
+
});
|
|
3371
3375
|
useEffect16(() => {
|
|
3372
|
-
if (localSearch !== searchQuery)
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
|
|
3377
|
-
|
|
3376
|
+
if (localSearch !== searchQuery) {
|
|
3377
|
+
const delay = setTimeout(() => {
|
|
3378
|
+
onSearchChange(localSearch);
|
|
3379
|
+
}, 1500);
|
|
3380
|
+
return () => clearTimeout(delay);
|
|
3381
|
+
}
|
|
3378
3382
|
}, [localSearch, onSearchChange, searchQuery]);
|
|
3379
|
-
useEffect16(() => {
|
|
3380
|
-
if (!isLoading) setLoadingFolderId(null);
|
|
3381
|
-
}, [isLoading]);
|
|
3382
3383
|
const formatBytes = (bytes) => {
|
|
3383
3384
|
const num = Number(bytes);
|
|
3384
3385
|
if (num === 0) return "0 Bytes";
|
|
@@ -3401,106 +3402,68 @@ var UniversalDriveView = ({
|
|
|
3401
3402
|
setSelectedIds([id]);
|
|
3402
3403
|
}
|
|
3403
3404
|
};
|
|
3404
|
-
const handleSelectAll = () => {
|
|
3405
|
-
if (selectedIds.length === items.length && items.length > 0) setSelectedIds([]);
|
|
3406
|
-
else setSelectedIds(items.map((i) => i.id));
|
|
3407
|
-
};
|
|
3408
3405
|
const handleItemDoubleClick = (item) => {
|
|
3409
3406
|
if (item.type === "FOLDER") {
|
|
3410
|
-
setLoadingFolderId(item.id);
|
|
3411
3407
|
setSelectedIds([]);
|
|
3412
3408
|
onNavigateFolder(item.id);
|
|
3413
3409
|
} else {
|
|
3414
3410
|
onOpenFile(item);
|
|
3415
3411
|
}
|
|
3416
3412
|
};
|
|
3417
|
-
const
|
|
3418
|
-
|
|
3419
|
-
|
|
3413
|
+
const openExplorer = async (action) => {
|
|
3414
|
+
setExplorer((p) => ({ ...p, isOpen: true, action, loading: true, currentId: null }));
|
|
3415
|
+
const data = await onFetchFoldersForExplorer(null);
|
|
3416
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3420
3417
|
};
|
|
3421
|
-
const
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3426
|
-
|
|
3427
|
-
|
|
3428
|
-
|
|
3418
|
+
const navigateExplorer = async (folderId) => {
|
|
3419
|
+
setExplorer((p) => ({ ...p, loading: true, currentId: folderId }));
|
|
3420
|
+
const data = await onFetchFoldersForExplorer(folderId);
|
|
3421
|
+
setExplorer((p) => ({ ...p, folders: data.folders, breadcrumbs: data.breadcrumbs, loading: false }));
|
|
3422
|
+
};
|
|
3423
|
+
const executeExplorerAction = async () => {
|
|
3424
|
+
setIsSubmitting(true);
|
|
3425
|
+
await onExecuteMoveCopy(explorer.action, explorer.currentId, selectedIds);
|
|
3426
|
+
setSelectedIds([]);
|
|
3427
|
+
setExplorer((p) => ({ ...p, isOpen: false }));
|
|
3428
|
+
setIsSubmitting(false);
|
|
3429
3429
|
};
|
|
3430
3430
|
const activeJobs = uploadQueue.filter((j) => j.status === "UPLOADING" || j.status === "PENDING");
|
|
3431
3431
|
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: () => {
|
|
3432
|
+
const isUILocked = isLoading || isSubmitting;
|
|
3433
|
+
const lockClass = isUILocked ? "pointer-events-none opacity-60" : "";
|
|
3434
|
+
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" }, selectedIds.length > 0 && /* @__PURE__ */ React40.createElement(React40.Fragment, null, selectedIds.length === 1 && /* @__PURE__ */ React40.createElement("button", { onClick: () => {
|
|
3435
|
+
const item = items.find((i) => i.id === selectedIds[0]);
|
|
3436
|
+
if (item) setRenameModal({ isOpen: true, id: item.id, name: item.name });
|
|
3437
|
+
setFolderInputVal(item?.name || "");
|
|
3438
|
+
}, 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: () => {
|
|
3439
|
+
setFolderInputVal("");
|
|
3440
|
+
setIsNewFolderModalOpen(true);
|
|
3441
|
+
}, 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
3442
|
onMoveToTrash(selectedIds);
|
|
3452
3443
|
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) => {
|
|
3444
|
+
}, 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: () => {
|
|
3445
|
+
setSelectedIds([]);
|
|
3446
|
+
onNavigateFolder(crumb.id);
|
|
3447
|
+
}, 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-75 ${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" }, isLoading ? /* @__PURE__ */ React40.createElement("tr", null, /* @__PURE__ */ React40.createElement("td", { colSpan: 4, className: "py-24 text-center" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon26, { icon: Loading03Icon12, size: 28, className: "animate-spin text-neutral-400 mx-auto" }))) : items.length === 0 ? /* @__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
3448
|
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
|
-
)))));
|
|
3449
|
+
return /* @__PURE__ */ React40.createElement("tr", { key: item.id, onClick: (e) => handleRowClick(item.id, e), onDoubleClick: () => handleItemDoubleClick(item), onContextMenu: (e) => {
|
|
3450
|
+
e.preventDefault();
|
|
3451
|
+
setSelectedIds([item.id]);
|
|
3452
|
+
}, 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)));
|
|
3453
|
+
})))), /* @__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"))), /* @__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) => {
|
|
3454
|
+
e.preventDefault();
|
|
3455
|
+
if (!folderInputVal.trim() || isSubmitting) return;
|
|
3456
|
+
setIsSubmitting(true);
|
|
3457
|
+
if (isNewFolderModalOpen) await onCreateFolder(folderInputVal.trim());
|
|
3458
|
+
else await onRenameItem(renameModal.id, folderInputVal.trim());
|
|
3459
|
+
setFolderInputVal("");
|
|
3460
|
+
setIsSubmitting(false);
|
|
3461
|
+
setIsNewFolderModalOpen(false);
|
|
3462
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3463
|
+
}, 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: () => {
|
|
3464
|
+
setIsNewFolderModalOpen(false);
|
|
3465
|
+
setRenameModal({ isOpen: false, id: "", name: "" });
|
|
3466
|
+
}, 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-100" }, /* @__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
3467
|
};
|
|
3505
3468
|
|
|
3506
3469
|
// src/components/DriveItemOpener.tsx
|
|
@@ -3592,7 +3555,7 @@ var Stagger = ({ steps, currentStep }) => {
|
|
|
3592
3555
|
};
|
|
3593
3556
|
|
|
3594
3557
|
// src/components/UniversalRegistrationFlow.tsx
|
|
3595
|
-
import React46, { useState as useState26, useEffect as useEffect17, useRef as
|
|
3558
|
+
import React46, { useState as useState26, useEffect as useEffect17, useRef as useRef11 } from "react";
|
|
3596
3559
|
import toast6 from "react-hot-toast";
|
|
3597
3560
|
import { HugeiconsIcon as HugeiconsIcon31 } from "@hugeicons/react";
|
|
3598
3561
|
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 +3587,12 @@ var UniversalRegistrationFlow = ({
|
|
|
3624
3587
|
passportApproved: false,
|
|
3625
3588
|
signatureApproved: false
|
|
3626
3589
|
});
|
|
3627
|
-
const idRef =
|
|
3628
|
-
const passportRef =
|
|
3629
|
-
const signatureRef =
|
|
3630
|
-
const other1Ref =
|
|
3631
|
-
const other2Ref =
|
|
3632
|
-
const other3Ref =
|
|
3590
|
+
const idRef = useRef11(null);
|
|
3591
|
+
const passportRef = useRef11(null);
|
|
3592
|
+
const signatureRef = useRef11(null);
|
|
3593
|
+
const other1Ref = useRef11(null);
|
|
3594
|
+
const other2Ref = useRef11(null);
|
|
3595
|
+
const other3Ref = useRef11(null);
|
|
3633
3596
|
const [formData, setFormData] = useState26({
|
|
3634
3597
|
businessDesc: "",
|
|
3635
3598
|
natureOfBusiness: null,
|
|
@@ -4351,7 +4314,7 @@ SECRET_KEY="${secKey}"
|
|
|
4351
4314
|
};
|
|
4352
4315
|
|
|
4353
4316
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
4354
|
-
import React48, { useState as useState28, useEffect as useEffect19, useRef as
|
|
4317
|
+
import React48, { useState as useState28, useEffect as useEffect19, useRef as useRef12 } from "react";
|
|
4355
4318
|
import Image11 from "next/image";
|
|
4356
4319
|
var MedicalFeatureStatsBlock = ({
|
|
4357
4320
|
bottomHeadline,
|
|
@@ -4361,7 +4324,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
4361
4324
|
stats
|
|
4362
4325
|
}) => {
|
|
4363
4326
|
const [isAnimating, setIsAnimating] = useState28(false);
|
|
4364
|
-
const titleRef =
|
|
4327
|
+
const titleRef = useRef12(null);
|
|
4365
4328
|
useEffect19(() => {
|
|
4366
4329
|
const observer = new IntersectionObserver(
|
|
4367
4330
|
([entry]) => {
|
|
@@ -4525,7 +4488,7 @@ var ContentGridBlock = ({
|
|
|
4525
4488
|
middleBottomCard,
|
|
4526
4489
|
rightCards
|
|
4527
4490
|
}) => {
|
|
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-
|
|
4491
|
+
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
4492
|
ImageWithLoader2,
|
|
4530
4493
|
{
|
|
4531
4494
|
src: card.bgImageSrc,
|