listpage-next 0.0.246 → 0.0.248

package/dist/ui/FileManager/components/AssetGrid.js

@@ -0,0 +1,188 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import react from "react";
+import dayjs from "dayjs";
+import { Box, Check, ExternalLink, FileText, Folder, Image, Link, Music, Trash2, Video } from "lucide-react";
+const AssetGrid = ({ items, viewMode, onSelect, onNavigate, onDelete, selectedIds })=>{
+    const [copiedId, setCopiedId] = react.useState(null);
+    const handleCopyLink = async (url, id)=>{
+        if (!url) return;
+        try {
+            await navigator.clipboard.writeText(url);
+            setCopiedId(id);
+            setTimeout(()=>setCopiedId(null), 2000);
+        } catch (err) {
+            console.error('Failed to copy', err);
+        }
+    };
+    const sortedItems = [
+        ...items
+    ].sort((a, b)=>{
+        if ('folder' === a.type && 'folder' !== b.type) return -1;
+        if ('folder' !== a.type && 'folder' === b.type) return 1;
+        return a.name.localeCompare(b.name);
+    });
+    if (0 === sortedItems.length) return /*#__PURE__*/ jsxs("div", {
+        className: "flex flex-col items-center justify-center h-full text-slate-500",
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "w-16 h-16 border-2 border-slate-800 border-dashed rounded-xl flex items-center justify-center mb-4",
+                children: /*#__PURE__*/ jsx(Folder, {
+                    className: "w-8 h-8 opacity-50"
+                })
+            }),
+            /*#__PURE__*/ jsx("p", {
+                className: "text-lg font-medium",
+                children: "此文件夹为空"
+            }),
+            /*#__PURE__*/ jsx("p", {
+                className: "text-sm",
+                children: "拖拽文件到此处或新建"
+            })
+        ]
+    });
+    const FileTypeIcon = ({ type, className })=>{
+        const cls = className || 'w-8 h-8';
+        switch(type){
+            case 'folder':
+                return /*#__PURE__*/ jsx(Folder, {
+                    className: `${cls} text-indigo-400 fill-indigo-400/20`
+                });
+            case 'image':
+                return /*#__PURE__*/ jsx(Image, {
+                    className: `${cls} text-blue-400`
+                });
+            case 'video':
+                return /*#__PURE__*/ jsx(Video, {
+                    className: `${cls} text-red-400`
+                });
+            case 'audio':
+                return /*#__PURE__*/ jsx(Music, {
+                    className: `${cls} text-yellow-400`
+                });
+            case 'model':
+                return /*#__PURE__*/ jsx(Box, {
+                    className: `${cls} text-emerald-400`
+                });
+            default:
+                return /*#__PURE__*/ jsx(FileText, {
+                    className: `${cls} text-slate-400`
+                });
+        }
+    };
+    return /*#__PURE__*/ jsx("div", {
+        className: "p-6 overflow-y-auto h-full scrollbar-thin",
+        children: /*#__PURE__*/ jsx("div", {
+            className: `${'grid' === viewMode ? 'flex flex-wrap gap-4 content-start' : 'flex flex-col gap-2'}`,
+            children: sortedItems.map((item)=>{
+                const isSelected = selectedIds ? selectedIds.has(item.id) : false;
+                return /*#__PURE__*/ jsxs("div", {
+                    className: `group relative bg-slate-900 border rounded-xl overflow-hidden transition-all duration-200 cursor-pointer ${isSelected ? 'border-indigo-500 bg-indigo-500/10 ring-1 ring-indigo-500' : 'border-slate-800 hover:border-indigo-500/50 hover:bg-slate-800/50'} ${'list' === viewMode ? 'flex items-center px-4 py-3 h-16 w-full' : 'flex flex-col p-4 w-44 h-56 items-center justify-center gap-4 shrink-0'}`,
+                    onClick: ()=>{
+                        onSelect(item);
+                    },
+                    onDoubleClick: (e)=>{
+                        e.stopPropagation();
+                        if ('folder' === item.type) onNavigate(item.id);
+                    },
+                    children: [
+                        selectedIds && 'folder' !== item.type && /*#__PURE__*/ jsx("div", {
+                            className: `absolute top-2 left-2 w-5 h-5 rounded border flex items-center justify-center z-10 ${isSelected ? 'bg-indigo-600 border-indigo-600' : 'bg-slate-900/80 border-slate-600 opacity-0 group-hover:opacity-100'}`,
+                            children: isSelected && /*#__PURE__*/ jsx(Check, {
+                                className: "w-3 h-3 text-white"
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            className: `${'list' === viewMode ? 'mr-4' : 'flex-1 flex items-center justify-center w-full min-h-0'}`,
+                            children: 'folder' === item.type ? /*#__PURE__*/ jsx(Folder, {
+                                className: `${'list' === viewMode ? 'w-8 h-8' : 'w-20 h-20'} text-indigo-400 fill-indigo-400/20 transition-transform group-hover:scale-105`
+                            }) : 'image' === item.type && item.url ? /*#__PURE__*/ jsx("div", {
+                                className: `${'list' === viewMode ? 'w-10 h-10' : 'w-full h-full'} rounded-lg overflow-hidden bg-slate-950 relative border border-slate-800 flex items-center justify-center`,
+                                children: /*#__PURE__*/ jsx("img", {
+                                    src: item.url,
+                                    alt: item.name,
+                                    className: "w-full h-full object-cover"
+                                })
+                            }) : /*#__PURE__*/ jsx("div", {
+                                className: `${'list' === viewMode ? 'w-10 h-10' : 'w-24 h-24'} flex items-center justify-center rounded-lg bg-slate-800/30`,
+                                children: /*#__PURE__*/ jsx(FileTypeIcon, {
+                                    type: item.type,
+                                    className: 'list' === viewMode ? 'w-5 h-5' : 'w-12 h-12'
+                                })
+                            })
+                        }),
+                        /*#__PURE__*/ jsxs("div", {
+                            className: `${'list' === viewMode ? 'flex-1 grid grid-cols-12 gap-4 items-center' : 'w-full text-center mt-2'}`,
+                            children: [
+                                /*#__PURE__*/ jsx("div", {
+                                    className: `${'list' === viewMode ? 'col-span-6' : ''} min-w-0`,
+                                    children: /*#__PURE__*/ jsx("h3", {
+                                        className: `text-sm font-medium truncate transition-colors select-none ${isSelected ? 'text-indigo-300' : 'text-slate-200 group-hover:text-indigo-300'}`,
+                                        title: item.name,
+                                        children: item.name
+                                    })
+                                }),
+                                'list' === viewMode && /*#__PURE__*/ jsxs(Fragment, {
+                                    children: [
+                                        /*#__PURE__*/ jsx("div", {
+                                            className: "col-span-3 text-xs text-slate-500",
+                                            children: dayjs(item.createdAt).format('YYYY-MM-DD')
+                                        }),
+                                        /*#__PURE__*/ jsx("div", {
+                                            className: "col-span-2 text-xs text-slate-500",
+                                            children: item.size || '--'
+                                        })
+                                    ]
+                                })
+                            ]
+                        }),
+                        onDelete && /*#__PURE__*/ jsxs("div", {
+                            className: `absolute ${'list' === viewMode ? 'right-4 top-1/2 -translate-y-1/2' : 'top-2 right-2'} opacity-0 group-hover:opacity-100 transition-opacity flex gap-2 bg-slate-900/80 rounded-lg p-1`,
+                            children: [
+                                'folder' !== item.type && item.url && /*#__PURE__*/ jsxs(Fragment, {
+                                    children: [
+                                        /*#__PURE__*/ jsx("button", {
+                                            onClick: (e)=>{
+                                                e.stopPropagation();
+                                                handleCopyLink(item.url, item.id);
+                                            },
+                                            className: `p-1.5 rounded-lg hover:bg-slate-600 text-white ${copiedId === item.id ? 'bg-green-600' : 'bg-slate-700'}`,
+                                            title: "复制链接",
+                                            children: copiedId === item.id ? /*#__PURE__*/ jsx(Check, {
+                                                className: "w-3 h-3"
+                                            }) : /*#__PURE__*/ jsx(Link, {
+                                                className: "w-3 h-3"
+                                            })
+                                        }),
+                                        /*#__PURE__*/ jsx("button", {
+                                            onClick: (e)=>{
+                                                e.stopPropagation();
+                                                window.open(item.url, '_blank');
+                                            },
+                                            className: "p-1.5 bg-slate-700 rounded-lg hover:bg-slate-600 text-white",
+                                            title: "打开",
+                                            children: /*#__PURE__*/ jsx(ExternalLink, {
+                                                className: "w-3 h-3"
+                                            })
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ jsx("button", {
+                                    onClick: (e)=>{
+                                        e.stopPropagation();
+                                        onDelete(item.id, 'folder' === item.type ? 'folder' : 'asset', item.name);
+                                    },
+                                    className: "p-1.5 bg-red-900/50 rounded-lg hover:bg-red-600 text-white",
+                                    title: "删除",
+                                    children: /*#__PURE__*/ jsx(Trash2, {
+                                        className: "w-3 h-3"
+                                    })
+                                })
+                            ]
+                        })
+                    ]
+                }, item.id);
+            })
+        })
+    });
+};
+export { AssetGrid };

package/dist/ui/FileManager/components/AssetSelectorModal.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Asset, Folder } from '../types';
+export interface AssetSelectorModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSubmit: (selectedAssets: Asset[]) => void;
+    assets: Asset[];
+    folders: Folder[];
+    title?: string;
+    multiSelect?: boolean;
+}
+export declare const AssetSelectorModal: React.FC<AssetSelectorModalProps>;

package/dist/ui/FileManager/components/AssetSelectorModal.js

@@ -0,0 +1,133 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Check, Search } from "lucide-react";
+import { AssetGrid } from "./AssetGrid.js";
+import { FolderTree } from "./FolderTree.js";
+import { Modal } from "../../Modal/index.js";
+const AssetSelectorModal = ({ isOpen, onClose, onSubmit, assets, folders, title = '选择文件', multiSelect = true })=>{
+    const [currentFolderId, setCurrentFolderId] = useState(null);
+    const [selectedIds, setSelectedIds] = useState(new Set());
+    const [filters, setFilters] = useState({
+        search: '',
+        source: 'all'
+    });
+    const currentViewItems = useMemo(()=>{
+        const currentFolders = folders.filter((f)=>f.parentId === currentFolderId);
+        const currentAssets = assets.filter((a)=>a.parentId === currentFolderId);
+        let items = [
+            ...currentFolders,
+            ...currentAssets
+        ];
+        if (filters.search) {
+            const allFolders = folders.filter((f)=>f.name.toLowerCase().includes(filters.search.toLowerCase()));
+            const allAssets = assets.filter((a)=>a.name.toLowerCase().includes(filters.search.toLowerCase()));
+            return [
+                ...allFolders,
+                ...allAssets
+            ];
+        }
+        return items;
+    }, [
+        assets,
+        folders,
+        currentFolderId,
+        filters.search
+    ]);
+    const handleSelect = (item)=>{
+        if ('folder' === item.type) return;
+        setSelectedIds((prev)=>{
+            const next = new Set(prev);
+            if (next.has(item.id)) next.delete(item.id);
+            else {
+                if (!multiSelect) next.clear();
+                next.add(item.id);
+            }
+            return next;
+        });
+    };
+    const handleSubmit = ()=>{
+        const selectedAssets = assets.filter((a)=>selectedIds.has(a.id));
+        onSubmit(selectedAssets);
+        onClose();
+        setSelectedIds(new Set());
+    };
+    return /*#__PURE__*/ jsx(Modal, {
+        open: isOpen,
+        onOk: handleSubmit,
+        onCancel: onClose,
+        className: "fixed inset-0 z-50",
+        title: /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                title,
+                selectedIds.size > 0 && /*#__PURE__*/ jsxs("span", {
+                    className: "text-sm font-normal text-indigo-400 bg-indigo-500/10 px-2 py-0.5 rounded-full border border-indigo-500/20",
+                    children: [
+                        "已选 ",
+                        selectedIds.size,
+                        " 项"
+                    ]
+                })
+            ]
+        }),
+        headerExtra: /*#__PURE__*/ jsxs("div", {
+            className: "relative",
+            children: [
+                /*#__PURE__*/ jsx(Search, {
+                    className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-500"
+                }),
+                /*#__PURE__*/ jsx("input", {
+                    type: "text",
+                    placeholder: "搜索...",
+                    value: filters.search,
+                    onChange: (e)=>setFilters((prev)=>({
+                                ...prev,
+                                search: e.target.value
+                            })),
+                    className: "w-48 bg-slate-950 border border-slate-700 rounded-lg pl-9 pr-3 py-1.5 text-sm text-slate-200 focus:ring-1 focus:ring-indigo-500 outline-none"
+                })
+            ]
+        }),
+        okButtonProps: {
+            disabled: 0 === selectedIds.size,
+            children: /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx(Check, {
+                        className: "w-4 h-4"
+                    }),
+                    "确认选择"
+                ]
+            })
+        },
+        children: /*#__PURE__*/ jsxs("div", {
+            className: "flex px-1.5 py-1",
+            children: [
+                /*#__PURE__*/ jsxs("div", {
+                    className: "w-[200px] shrink-0 grow-0",
+                    children: [
+                        /*#__PURE__*/ jsx("div", {
+                            className: "flex items-center justify-between mb-2 px-3",
+                            children: /*#__PURE__*/ jsx("h3", {
+                                className: "text-xs font-semibold text-slate-500 uppercase tracking-wider",
+                                children: "文件夹"
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(FolderTree, {
+                            parentId: null,
+                            folders: folders,
+                            currentFolderId: currentFolderId,
+                            onNavigate: setCurrentFolderId
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(AssetGrid, {
+                    items: currentViewItems,
+                    viewMode: 'grid',
+                    onSelect: handleSelect,
+                    onNavigate: setCurrentFolderId,
+                    selectedIds: selectedIds
+                })
+            ]
+        })
+    });
+};
+export { AssetSelectorModal };

package/dist/ui/FileManager/components/Breadcrumbs.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface BreadcrumbItem {
+    id: string | null;
+    name: string;
+}
+export interface BreadcrumbsProps {
+    items: BreadcrumbItem[];
+    onNavigate: (folderId: string | null) => void;
+}
+export declare const Breadcrumbs: React.FC<BreadcrumbsProps>;

package/dist/ui/FileManager/components/Breadcrumbs.js

@@ -0,0 +1,25 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { ChevronRight, Home } from "lucide-react";
+const Breadcrumbs = ({ items, onNavigate })=>/*#__PURE__*/ jsx("nav", {
+        className: "flex items-center text-sm font-medium text-slate-400",
+        children: items.map((crumb, index)=>/*#__PURE__*/ jsxs("div", {
+                className: "flex items-center",
+                children: [
+                    index > 0 && /*#__PURE__*/ jsx(ChevronRight, {
+                        className: "w-4 h-4 mx-2 text-slate-600"
+                    }),
+                    /*#__PURE__*/ jsxs("button", {
+                        onClick: ()=>onNavigate(crumb.id),
+                        className: `shrink-0 hover:text-white transition-colors flex items-center gap-2 ${index === items.length - 1 ? 'text-white' : ''}`,
+                        children: [
+                            0 === index && /*#__PURE__*/ jsx(Home, {
+                                className: "w-4 h-4"
+                            }),
+                            crumb.name
+                        ]
+                    })
+                ]
+            }, crumb.id || 'root'))
+    });
+export { Breadcrumbs };

package/dist/ui/FileManager/components/CreateFolderModal.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface CreateFolderModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onCreate: (name: string) => void;
+}
+export declare const CreateFolderModal: React.FC<CreateFolderModalProps>;

package/dist/ui/FileManager/components/CreateFolderModal.js

@@ -0,0 +1,84 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { FolderPlus, X } from "lucide-react";
+const CreateFolderModal = ({ isOpen, onClose, onCreate })=>{
+    const [folderName, setFolderName] = useState('新建文件夹');
+    if (!isOpen) return null;
+    const handleSubmit = (e)=>{
+        e.preventDefault();
+        if (folderName.trim()) {
+            onCreate(folderName.trim());
+            setFolderName('新建文件夹');
+            onClose();
+        }
+    };
+    return /*#__PURE__*/ jsx("div", {
+        className: "fixed inset-0 z-50 flex items-center justify-center bg-black/80 backdrop-blur-sm p-4",
+        children: /*#__PURE__*/ jsxs("div", {
+            className: "bg-slate-900 border border-slate-700 w-full max-w-md rounded-xl shadow-2xl p-6 transform transition-all scale-100",
+            children: [
+                /*#__PURE__*/ jsxs("div", {
+                    className: "flex items-center justify-between mb-6",
+                    children: [
+                        /*#__PURE__*/ jsxs("h2", {
+                            className: "text-xl font-bold text-white flex items-center gap-2",
+                            children: [
+                                /*#__PURE__*/ jsx(FolderPlus, {
+                                    className: "w-5 h-5 text-indigo-400"
+                                }),
+                                "新建文件夹"
+                            ]
+                        }),
+                        /*#__PURE__*/ jsx("button", {
+                            onClick: onClose,
+                            className: "text-slate-400 hover:text-white transition-colors",
+                            children: /*#__PURE__*/ jsx(X, {
+                                className: "w-5 h-5"
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("form", {
+                    onSubmit: handleSubmit,
+                    children: [
+                        /*#__PURE__*/ jsxs("div", {
+                            className: "mb-6",
+                            children: [
+                                /*#__PURE__*/ jsx("label", {
+                                    className: "block text-sm font-medium text-slate-400 mb-2",
+                                    children: "文件夹名称"
+                                }),
+                                /*#__PURE__*/ jsx("input", {
+                                    type: "text",
+                                    value: folderName,
+                                    onChange: (e)=>setFolderName(e.target.value),
+                                    className: "w-full bg-slate-950 border border-slate-700 rounded-lg px-4 py-2 text-white focus:ring-2 focus:ring-indigo-500/50 outline-none placeholder-slate-600",
+                                    placeholder: "例如：环境贴图",
+                                    autoFocus: true
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsxs("div", {
+                            className: "flex justify-end gap-3",
+                            children: [
+                                /*#__PURE__*/ jsx("button", {
+                                    type: "button",
+                                    onClick: onClose,
+                                    className: "px-4 py-2 text-slate-300 hover:text-white transition-colors text-sm font-medium",
+                                    children: "取消"
+                                }),
+                                /*#__PURE__*/ jsx("button", {
+                                    type: "submit",
+                                    disabled: !folderName.trim(),
+                                    className: "px-4 py-2 bg-indigo-600 hover:bg-indigo-500 text-white rounded-lg text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed shadow-lg shadow-indigo-500/20",
+                                    children: "创建"
+                                })
+                            ]
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+};
+export { CreateFolderModal };

package/dist/ui/FileManager/components/DeleteConfirmModal.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface DeleteConfirmModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    itemName: string;
+    itemType: 'folder' | 'asset' | null;
+}
+export declare const DeleteConfirmModal: React.FC<DeleteConfirmModalProps>;

package/dist/ui/FileManager/components/DeleteConfirmModal.js

@@ -0,0 +1,33 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { ConfirmModal } from "../../Modal/ConfirmModal.js";
+const DeleteConfirmModal = ({ isOpen, onClose, onConfirm, itemName, itemType })=>/*#__PURE__*/ jsx(ConfirmModal, {
+        title: `${'folder' === itemType ? '删除文件夹' : '删除文件'}?`,
+        onOk: onConfirm,
+        onCancel: onClose,
+        open: isOpen,
+        className: "fixed inset-0 z-50",
+        children: /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                "确认要删除",
+                /*#__PURE__*/ jsxs("span", {
+                    className: "font-semibold text-white",
+                    children: [
+                        '"',
+                        itemName,
+                        '"'
+                    ]
+                }),
+                " 吗？",
+                'folder' === itemType && /*#__PURE__*/ jsx("span", {
+                    className: "block mt-2 text-red-400 text-xs",
+                    children: "这将永久删除其中所有内容。"
+                }),
+                /*#__PURE__*/ jsx("span", {
+                    className: "block mt-2",
+                    children: "此操作无法撤销。"
+                })
+            ]
+        })
+    });
+export { DeleteConfirmModal };

package/dist/ui/FileManager/components/FileTypePreview.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Asset } from '../types';
+interface Props {
+    asset: Asset;
+}
+declare const FileTypePreview: React.FC<Props>;
+export default FileTypePreview;

package/dist/ui/FileManager/components/FileTypePreview.js

@@ -0,0 +1,29 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { Box, FileText, Image, Music, Video } from "lucide-react";
+const FileTypePreview_FileTypePreview = ({ asset })=>{
+    if ('image' === asset.type && asset.url) return /*#__PURE__*/ jsx("img", {
+        src: asset.url,
+        className: "w-full h-full object-contain",
+        alt: "Preview"
+    });
+    let Icon = FileText;
+    if ('video' === asset.type) Icon = Video;
+    if ('audio' === asset.type) Icon = Music;
+    if ('model' === asset.type) Icon = Box;
+    if ('image' === asset.type) Icon = Image;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "w-full h-full flex flex-col items-center justify-center text-slate-500",
+        children: [
+            /*#__PURE__*/ jsx(Icon, {
+                className: "w-20 h-20 mb-4"
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "text-sm",
+                children: "暂无预览"
+            })
+        ]
+    });
+};
+const FileTypePreview = FileTypePreview_FileTypePreview;
+export { FileTypePreview as default };

package/dist/ui/FileManager/components/FolderTree.d.ts

@@ -0,0 +1,13 @@
+import { Folder } from '../types';
+export interface FolderTreeProps {
+    parentId: string | null;
+    depth?: number;
+    folders: Folder[];
+    expandedFolders?: Set<string>;
+    currentFolderId: string | null;
+    onNavigate: (folderId: string | null) => void;
+    onToggleExpand?: (folderId: string) => void;
+    onAddFolder?: (folder: Folder | null) => void;
+    showRoot?: boolean;
+}
+export declare const FolderTree: ({ parentId, depth, folders, expandedFolders: controlledExpandedFolders, currentFolderId, onNavigate, onToggleExpand: controlledOnToggleExpand, onAddFolder, showRoot, }: FolderTreeProps) => import("react/jsx-runtime").JSX.Element | null;