npm - @alneas/appkit-react - Versions diffs - 0.2.0 → 0.3.1 - Mend

@alneas/appkit-react 0.2.0 → 0.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.

Files changed (1525) hide show

package/dist/tools/components/file-browser/FileBrowser.js CHANGED Viewed

@@ -8,120 +8,154 @@ import { FileGridView as s } from "./FileGridView.js";
 import { FilePreview as c } from "./FilePreview.js";
 import { FileDetailsPanel as l } from "./FileDetailsPanel.js";
 import { StorageFileProvider as u } from "./StorageFileProvider.js";
+import { resolveFileDrop as ee } from "./file-drop.js";
 import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { useCallback as m, useMemo as h, useState as g } from "react";
-import { AlertCircle as _, Loader2 as v } from "lucide-react";
+import { useCallback as m, useLayoutEffect as h, useMemo as g, useRef as _, useState as v } from "react";
+import { AlertCircle as te, Loader2 as y } from "lucide-react";
 //#region src/tools/components/file-browser/FileBrowser.tsx
-function y({ provider: y, adapter: b, initialPath: x = "", initialViewMode: S = "grid", groupingAxis: C, onOpenFile: w, className: T }) {
-	let [E, D] = g(null), [O, k] = g(null), [A, j] = g(null), M = h(() => {
-		if (y) return y;
-		if (b) return new u(b);
+function b({ provider: b, adapter: x, initialPath: S = "", initialViewMode: C = "grid", groupingAxis: w, onOpenFile: T, className: ne }) {
+	let [E, D] = v(null), [O, k] = v(null), [A, j] = v(null), M = _(0), N = g(() => {
+		if (b) return b;
+		if (x) return new u(x);
 		throw Error("Either provider or adapter must be provided to FileBrowser");
-	}, [y, b]), { state: N, verifyingIds: P, navigate: F, navigateUp: I, search: L, openNode: R, setViewMode: z, select: B, refresh: V, deleteNodes: H, renameNode: U, updateTags: W, verifyNode: G } = i({
-		provider: M,
-		initialPath: x,
-		initialViewMode: S,
-		groupingAxis: C
-	}), K = m(async (e) => {
-		let t = await R(e);
-		t && (D(e), k(t), w?.(e, t));
-	}, [R, w]), q = m(async (e) => {
-		confirm(`Are you sure you want to delete "${e.name}"?`) && await H([e.id]);
-	}, [H]), J = m((e) => {
+	}, [b, x]), { state: P, verifyingIds: F, navigate: I, navigateUp: L, search: R, openNode: z, setViewMode: B, select: V, refresh: H, deleteNodes: U, renameNode: W, updateTags: G, verifyNode: K } = i({
+		provider: N,
+		initialPath: S,
+		initialViewMode: C,
+		groupingAxis: w
+	}), q = m(async (e) => {
+		e.kind === "folder" && M.current++;
+		let t = await z(e);
+		t && (D(e), k(t), T?.(e, t));
+	}, [z, T]), J = m(async (e) => {
+		confirm(`Are you sure you want to delete "${e.name}"?`) && await U([e.id]);
+	}, [U]), Y = m((e) => {
 		j(e);
-	}, []), Y = m(async (e) => {
+	}, []), X = m(async (e) => {
 		let t = prompt("Enter new name:", e.name);
-		t && t !== e.name && await U(e.id, t);
-	}, [U]), X = m(async (e) => {
+		t && t !== e.name && await W(e.id, t);
+	}, [W]), Z = m(async (e) => {
 		let t = e.metadata?.tags || "", n = prompt("Enter tags (comma separated):", t);
-		n !== null && n !== t && await W(e.id, n);
-	}, [W]), Z = m(async () => {
+		n !== null && n !== t && await G(e.id, n);
+	}, [G]), re = m(async () => {
 		let e = prompt("Enter folder name:");
-		e && (await M.createFolder(N.path, e), V());
+		e && (await N.createFolder(P.path, e), H());
 	}, [
-		M,
-		N.path,
-		V
-	]), Q = m(async () => {
+		N,
+		P.path,
+		H
+	]), ie = m(async () => {
 		let e = document.createElement("input");
 		e.type = "file", e.multiple = !0, e.onchange = async (e) => {
 			let t = e.target.files;
 			if (t) {
-				for (let e of Array.from(t)) await M.uploadFile(N.path, e, e.name);
-				V();
+				for (let e of Array.from(t)) await N.uploadFile(P.path, e, e.name);
+				H();
 			}
 		}, e.click();
 	}, [
-		M,
-		N.path,
-		V
-	]), $ = m(async (e) => {
-		let { active: t, over: n } = e;
-		if (!n) return;
-		let r = t.data.current, i = n.data.current;
-		if (r.kind === "file" && i.kind === "folder") {
-			let e = i.id.endsWith("/") ? i.id : `${i.id}/`;
-			if (r.id.startsWith(e)) return;
-			try {
-				await M.moveNode(r.id, e), V();
-			} catch (e) {
-				alert(e instanceof Error ? e.message : "Failed to move file");
-			}
-		}
-	}, [M, V]);
-	return /* @__PURE__ */ p("div", {
-		className: `flex flex-col h-full bg-background border rounded-lg overflow-hidden ${T}`,
+		N,
+		P.path,
+		H
+	]), Q = _(null), $ = _(null);
+	return h(() => ($.current = {
+		provider: N,
+		path: P.path,
+		refresh: H
+	}, () => {
+		$.current = null;
+	}), [
+		N,
+		P.path,
+		H
+	]), h(() => (M.current++, () => {
+		M.current++;
+	}), [N, S]), h(() => {
+		Q.current = null;
+	}, [
+		N,
+		P.path,
+		P.viewMode,
+		P.isLoading,
+		P.nodes
+	]), /* @__PURE__ */ p("div", {
+		className: `flex flex-col h-full bg-background border rounded-lg overflow-hidden ${ne}`,
 		children: [
 			/* @__PURE__ */ f(a, {
-				path: N.path,
-				viewMode: N.viewMode,
-				isLoading: N.isLoading,
-				onNavigate: F,
-				onNavigateUp: I,
-				onSetViewMode: z,
-				onRefresh: V,
-				onSearch: L,
-				onUpload: Q,
-				onCreateFolder: Z
+				path: P.path,
+				viewMode: P.viewMode,
+				isLoading: P.isLoading,
+				onNavigate: (e) => {
+					M.current++, I(e);
+				},
+				onNavigateUp: () => {
+					M.current++, L();
+				},
+				onSetViewMode: B,
+				onRefresh: H,
+				onSearch: R,
+				onUpload: ie,
+				onCreateFolder: re
 			}),
-			N.error && /* @__PURE__ */ p(e, {
+			P.error && /* @__PURE__ */ p(e, {
 				variant: "destructive",
 				className: "m-2",
 				children: [
-					/* @__PURE__ */ f(_, { className: "h-4 w-4" }),
+					/* @__PURE__ */ f(te, { className: "h-4 w-4" }),
 					/* @__PURE__ */ f(n, { children: "Error" }),
-					/* @__PURE__ */ f(t, { children: N.error })
+					/* @__PURE__ */ f(t, { children: P.error })
 				]
 			}),
 			/* @__PURE__ */ f(r, {
-				onDragEnd: $,
+				onDragStart: () => {
+					Q.current = {
+						provider: N,
+						path: P.path,
+						viewMode: P.viewMode,
+						navigationEpoch: M.current
+					};
+				},
+				onDragEnd: async (e, t) => {
+					let n = Q.current;
+					Q.current = null;
+					let { source: r, target: i } = e.operation;
+					if (!n || n.navigationEpoch !== M.current || n.provider !== N || n.path !== P.path || n.viewMode !== P.viewMode || P.isLoading || !r || !i || t.registry.draggables.get(r.id) !== r || t.registry.droppables.get(i.id) !== i) return;
+					let a = ee(e, P.nodes);
+					if (a) try {
+						await N.moveNode(a.nodeId, a.targetPath);
+						let e = $.current;
+						e?.provider === N && e.path === n.path && M.current === n.navigationEpoch && e.refresh();
+					} catch (e) {
+						alert(e instanceof Error ? e.message : "Failed to move file");
+					}
+				},
 				children: /* @__PURE__ */ f("div", {
 					className: "flex-1 relative flex flex-col min-h-0",
-					children: N.isLoading && N.nodes.length === 0 ? /* @__PURE__ */ f("div", {
+					children: P.isLoading && P.nodes.length === 0 ? /* @__PURE__ */ f("div", {
 						className: "flex-1 flex items-center justify-center",
-						children: /* @__PURE__ */ f(v, { className: "w-8 h-8 animate-spin text-muted-foreground" })
-					}) : /* @__PURE__ */ f(d, { children: N.viewMode === "list" ? /* @__PURE__ */ f(o, {
-						nodes: N.nodes,
-						selectedIds: N.selectedIds,
-						verifyingIds: P,
-						onSelect: B,
-						onOpen: K,
-						onDelete: q,
-						onDetails: J,
-						onRename: Y,
-						onUpdateTags: X,
-						onVerify: (e) => void G(e.id)
+						children: /* @__PURE__ */ f(y, { className: "w-8 h-8 animate-spin text-muted-foreground" })
+					}) : /* @__PURE__ */ f(d, { children: P.viewMode === "list" ? /* @__PURE__ */ f(o, {
+						nodes: P.nodes,
+						selectedIds: P.selectedIds,
+						verifyingIds: F,
+						onSelect: V,
+						onOpen: q,
+						onDelete: J,
+						onDetails: Y,
+						onRename: X,
+						onUpdateTags: Z,
+						onVerify: (e) => void K(e.id)
 					}) : /* @__PURE__ */ f(s, {
-						nodes: N.nodes,
-						selectedIds: N.selectedIds,
-						verifyingIds: P,
-						onSelect: B,
-						onOpen: K,
-						onDelete: q,
-						onDetails: J,
-						onRename: Y,
-						onUpdateTags: X,
-						onVerify: (e) => void G(e.id)
+						nodes: P.nodes,
+						selectedIds: P.selectedIds,
+						verifyingIds: F,
+						onSelect: V,
+						onOpen: q,
+						onDelete: J,
+						onDetails: Y,
+						onRename: X,
+						onUpdateTags: Z,
+						onVerify: (e) => void K(e.id)
 					}) })
 				})
 			}),
@@ -129,11 +163,11 @@ function y({ provider: y, adapter: b, initialPath: x = "", initialViewMode: S =
 				className: "px-3 py-1.5 border-t bg-muted/30 flex items-center justify-between text-[11px] text-muted-foreground",
 				children: [/* @__PURE__ */ p("div", {
 					className: "flex items-center gap-3",
-					children: [/* @__PURE__ */ p("span", { children: [N.nodes.length, " items"] }), N.selectedIds.length > 0 && /* @__PURE__ */ p("span", {
+					children: [/* @__PURE__ */ p("span", { children: [P.nodes.length, " items"] }), P.selectedIds.length > 0 && /* @__PURE__ */ p("span", {
 						className: "text-primary font-medium",
-						children: [N.selectedIds.length, " selected"]
+						children: [P.selectedIds.length, " selected"]
 					})]
-				}), /* @__PURE__ */ f("div", { children: N.path || "Root" })]
+				}), /* @__PURE__ */ f("div", { children: P.path || "Root" })]
 			}),
 			/* @__PURE__ */ f(c, {
 				node: E,
@@ -144,13 +178,13 @@ function y({ provider: y, adapter: b, initialPath: x = "", initialViewMode: S =
 			}),
 			/* @__PURE__ */ f(l, {
 				node: A,
-				provider: M,
+				provider: N,
 				onClose: () => j(null)
 			})
 		]
 	});
 }
 //#endregion
-export { y as FileBrowser };
+export { b as FileBrowser };
 //# sourceMappingURL=FileBrowser.js.map

package/dist/tools/components/file-browser/FileBrowser.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileBrowser.js","names":["_Fragment","FileBrowser","propProvider","previewNode","setPreviewNode","useState","previewUrl","setPreviewUrl","detailsNode","setDetailsNode","provider","useMemo","adapter","StorageFileProvider","useStorageBrowser","handleOpen","useCallback","url","openNode","node","onOpenFile","handleDelete","deleteNodes","handleDetails","handleRename","newName","renameNode","handleUpdateTags","currentTags","newTags","updateTags","handleCreateFolder","name","state","refresh","handleUpload","input","files","file","handleDragEnd","event","over","activeNode","active","overNode","targetPath","error","className","FileNavbar","navigate","navigateUp","setViewMode","search","Alert","AlertCircle","AlertTitle","AlertDescription","DnDProvider","Loader2","Fragment","FileListView","select","verifyNode","FileGridView","FilePreview","FileDetailsPanel"],"sources":["../../../../src/tools/components/file-browser/FileBrowser.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport { useStorageBrowser } from './useStorageBrowser';\nimport { FileNavbar } from './FileNavbar';\nimport { FileListView } from './FileListView';\nimport { FileGridView } from './FileGridView';\nimport { FilePreview } from './FilePreview';\nimport { FileDetailsPanel } from './FileDetailsPanel';\nimport { StorageFileProvider } from './StorageFileProvider';\nimport type { StorageAdapter } from '../../lib/storage/types';\nimport type { FileBrowserViewMode, FileNode, FileGroupingAxis, FileProvider } from './types';\nimport { Alert, AlertDescription, AlertTitle } from '../ui/alert';\nimport { AlertCircle, Loader2 } from 'lucide-react';\nimport { DnDProvider } from '../ui/dnd';\nimport type { DragEndEvent } from '@dnd-kit/core';\n\nexport interface FileBrowserProps {\n /** ファイルプロバイダー（優先） /\n provider?: FileProvider;\n /* ストレージアダプター（providerが未指定の場合にラップして使用） /\n adapter?: StorageAdapter;\n /* 初期パス /\n initialPath?: string;\n /* 初期表示モード /\n initialViewMode?: FileBrowserViewMode;\n /* グループ化の軸（仮想ツリー用、将来拡張用） /\n groupingAxis?: FileGroupingAxis;\n /* ファイルがクリック（開かれた）時のコールバック /\n onOpenFile?: (node: FileNode, url: string) => void;\n /* クラス名 /\n className?: string;\n}\n\n/\n 高機能ファイルブラウザコンポーネント\n \n S3, R2, OCI などのオブジェクトストレージをエクスプローラー形式で表示・操作します。\n * DBテーブル管理 + UUIDファイル名といった複雑な構成にも FileProvider を通じて対応可能です。\n /\nexport function FileBrowser({\n provider: propProvider,\n adapter,\n initialPath = '',\n initialViewMode = 'grid',\n groupingAxis,\n onOpenFile,\n className,\n}: FileBrowserProps) {\n // モーダル・パネル状態\n const [previewNode, setPreviewNode] = useState<FileNode \| null>(null);\n const [previewUrl, setPreviewUrl] = useState<string \| null>(null);\n const [detailsNode, setDetailsNode] = useState<FileNode \| null>(null);\n\n // アダプターが直接渡された場合は標準のプロバイダーでラップする\n const provider = useMemo(() => {\n if (propProvider) return propProvider;\n if (adapter) return new StorageFileProvider(adapter);\n throw new Error('Either provider or adapter must be provided to FileBrowser');\n }, [propProvider, adapter]);\n\n const {\n state,\n verifyingIds,\n navigate,\n navigateUp,\n search,\n openNode,\n setViewMode,\n select,\n refresh,\n deleteNodes,\n renameNode,\n updateTags,\n verifyNode,\n } = useStorageBrowser({\n provider,\n initialPath,\n initialViewMode,\n groupingAxis,\n });\n\n const handleOpen = useCallback(\n async (node: FileNode) => {\n const url = await openNode(node);\n if (url) {\n setPreviewNode(node);\n setPreviewUrl(url);\n onOpenFile?.(node, url);\n }\n },\n [openNode, onOpenFile],\n );\n\n const handleDelete = useCallback(\n async (node: FileNode) => {\n if (confirm(`Are you sure you want to delete \"${node.name}\"?`)) {\n await deleteNodes([node.id]);\n }\n },\n [deleteNodes],\n );\n\n const handleDetails = useCallback((node: FileNode) => {\n setDetailsNode(node);\n }, []);\n\n const handleRename = useCallback(\n async (node: FileNode) => {\n const newName = prompt('Enter new name:', node.name);\n if (newName && newName !== node.name) {\n await renameNode(node.id, newName);\n }\n },\n [renameNode],\n );\n\n const handleUpdateTags = useCallback(\n async (node: FileNode) => {\n const currentTags = node.metadata?.tags \|\| '';\n const newTags = prompt('Enter tags (comma separated):', currentTags);\n if (newTags !== null && newTags !== currentTags) {\n await updateTags(node.id, newTags);\n }\n },\n [updateTags],\n );\n\n const handleCreateFolder = useCallback(async () => {\n const name = prompt('Enter folder name:');\n if (name) {\n await provider.createFolder(state.path, name);\n refresh();\n }\n }, [provider, state.path, refresh]);\n\n const handleUpload = useCallback(async () => {\n // 簡易的なファイル選択\n const input = document.createElement('input');\n input.type = 'file';\n input.multiple = true;\n input.onchange = async (e) => {\n const files = (e.target as HTMLInputElement).files;\n if (!files) return;\n\n for (const file of Array.from(files)) {\n await provider.uploadFile(state.path, file, file.name);\n }\n refresh();\n };\n input.click();\n }, [provider, state.path, refresh]);\n\n /\n ドラッグ&ドロップ終了時の処理\n /\n const handleDragEnd = useCallback(\n async (event: DragEndEvent) => {\n const { active, over } = event;\n if (!over) return;\n\n const activeNode = active.data.current as FileNode;\n const overNode = over.data.current as FileNode;\n\n // ファイルをフォルダにドロップした場合のみ移動を実行\n if (activeNode.kind === 'file' && overNode.kind === 'folder') {\n const targetPath = overNode.id.endsWith('/') ? overNode.id : `${overNode.id}/`;\n\n // 同じ場所なら何もしない\n if (activeNode.id.startsWith(targetPath)) return;\n\n try {\n await provider.moveNode(activeNode.id, targetPath);\n refresh();\n } catch (error) {\n alert(error instanceof Error ? error.message : 'Failed to move file');\n }\n }\n },\n [provider, refresh],\n );\n\n return (\n <div\n className={`flex flex-col h-full bg-background border rounded-lg overflow-hidden ${className}`}\n >\n {/ ツールバー /}\n <FileNavbar\n path={state.path}\n viewMode={state.viewMode}\n isLoading={state.isLoading}\n onNavigate={navigate}\n onNavigateUp={navigateUp}\n onSetViewMode={setViewMode}\n onRefresh={refresh}\n onSearch={search}\n onUpload={handleUpload}\n onCreateFolder={handleCreateFolder}\n />\n\n {/ エラー表示 /}\n {state.error && (\n <Alert variant='destructive' className='m-2'>\n <AlertCircle className='h-4 w-4' />\n <AlertTitle>Error</AlertTitle>\n <AlertDescription>{state.error}</AlertDescription>\n </Alert>\n )}\n\n {/ メインコンテンツ /}\n <DnDProvider onDragEnd={handleDragEnd}>\n <div className='flex-1 relative flex flex-col min-h-0'>\n {state.isLoading && state.nodes.length === 0 ? (\n <div className='flex-1 flex items-center justify-center'>\n <Loader2 className='w-8 h-8 animate-spin text-muted-foreground' />\n </div>\n ) : (\n <>\n {state.viewMode === 'list' ? (\n <FileListView\n nodes={state.nodes}\n selectedIds={state.selectedIds}\n verifyingIds={verifyingIds}\n onSelect={select}\n onOpen={handleOpen}\n onDelete={handleDelete}\n onDetails={handleDetails}\n onRename={handleRename}\n onUpdateTags={handleUpdateTags}\n onVerify={(node) => void verifyNode(node.id)}\n />\n ) : (\n <FileGridView\n nodes={state.nodes}\n selectedIds={state.selectedIds}\n verifyingIds={verifyingIds}\n onSelect={select}\n onOpen={handleOpen}\n onDelete={handleDelete}\n onDetails={handleDetails}\n onRename={handleRename}\n onUpdateTags={handleUpdateTags}\n onVerify={(node) => void verifyNode(node.id)}\n />\n )}\n </>\n )}\n </div>\n </DnDProvider>\n\n {/ ステータスバー /}\n <div className='px-3 py-1.5 border-t bg-muted/30 flex items-center justify-between text-[11px] text-muted-foreground'>\n <div className='flex items-center gap-3'>\n <span>{state.nodes.length} items</span>\n {state.selectedIds.length > 0 && (\n <span className='text-primary font-medium'>{state.selectedIds.length} selected</span>\n )}\n </div>\n <div>{state.path \|\| 'Root'}</div>\n </div>\n\n {/ プレビューモーダル /}\n <FilePreview\n node={previewNode}\n url={previewUrl}\n onClose={() => {\n setPreviewNode(null);\n setPreviewUrl(null);\n }}\n />\n\n {/ 詳細パネル */}\n <FileDetailsPanel\n node={detailsNode}\n provider={provider}\n onClose={() => setDetailsNode(null)}\n />\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"FileBrowser.js","names":["_Fragment","FileBrowser","propProvider","previewNode","setPreviewNode","useState","previewUrl","setPreviewUrl","detailsNode","setDetailsNode","navigationEpoch","useRef","provider","useMemo","adapter","StorageFileProvider","useStorageBrowser","handleOpen","useCallback","node","url","openNode","onOpenFile","handleDelete","deleteNodes","handleDetails","handleRename","newName","renameNode","handleUpdateTags","currentTags","newTags","updateTags","handleCreateFolder","name","state","refresh","handleUpload","input","files","file","dragSnapshot","refreshContext","useLayoutEffect","initialPath","className","FileNavbar","navigate","path","navigateUp","setViewMode","search","Alert","AlertCircle","AlertTitle","AlertDescription","DnDProvider","snapshot","event","source","target","manager","move","resolveFileDrop","current","error","Loader2","Fragment","FileListView","select","verifyNode","FileGridView","FilePreview","FileDetailsPanel"],"sources":["../../../../src/tools/components/file-browser/FileBrowser.tsx"],"sourcesContent":["import { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useStorageBrowser } from './useStorageBrowser';\nimport { FileNavbar } from './FileNavbar';\nimport { FileListView } from './FileListView';\nimport { FileGridView } from './FileGridView';\nimport { FilePreview } from './FilePreview';\nimport { FileDetailsPanel } from './FileDetailsPanel';\nimport { StorageFileProvider } from './StorageFileProvider';\nimport type { StorageAdapter } from '../../lib/storage/types';\nimport type { FileBrowserViewMode, FileNode, FileGroupingAxis, FileProvider } from './types';\nimport { Alert, AlertDescription, AlertTitle } from '../ui/alert';\nimport { AlertCircle, Loader2 } from 'lucide-react';\nimport { DnDProvider, type DnDProviderProps } from '../ui/dnd';\nimport {resolveFileDrop} from './file-drop';\n\nexport interface FileBrowserProps {\n /** ファイルプロバイダー（優先） /\n provider?: FileProvider;\n /* ストレージアダプター（providerが未指定の場合にラップして使用） /\n adapter?: StorageAdapter;\n /* 初期パス /\n initialPath?: string;\n /* 初期表示モード /\n initialViewMode?: FileBrowserViewMode;\n /* グループ化の軸（仮想ツリー用、将来拡張用） /\n groupingAxis?: FileGroupingAxis;\n /* ファイルがクリック（開かれた）時のコールバック /\n onOpenFile?: (node: FileNode, url: string) => void;\n /* クラス名 /\n className?: string;\n}\n\n/\n Browse files through a host-supplied FileProvider or wrapped StorageAdapter.\n * @param props - Provider (preferred), optional adapter, initial path (default empty),\n * initial view mode (default grid), grouping axis, open callback and presentation.\n * @returns The browser, native drag boundary and preview/detail surfaces.\n * @throws An Error during rendering when neither provider nor adapter is supplied.\n * @remarks Hosts authorize storage access. A drop moves one currently listed file\n * into a registered folder, awaits moveNode and then refreshes the current relevant\n * view. Canceled/stale drops do not write; navigation does not undo a write already\n * in flight. Import Appkit CSS once; this component owns its native drag provider.\n * @example\n * ```tsx\n * import {FileBrowser, type FileProvider} from '@alneas/appkit-react/tools/file-browser';\n * import '@alneas/appkit-react/styles';\n * export function Files({provider}: {provider: FileProvider}) {\n * return <div style={{height: 500}}><FileBrowser provider={provider} /></div>;\n * }\n * ```\n /\nexport function FileBrowser({\n provider: propProvider,\n adapter,\n initialPath = '',\n initialViewMode = 'grid',\n groupingAxis,\n onOpenFile,\n className,\n}: FileBrowserProps) {\n // モーダル・パネル状態\n const [previewNode, setPreviewNode] = useState<FileNode \| null>(null);\n const [previewUrl, setPreviewUrl] = useState<string \| null>(null);\n const [detailsNode, setDetailsNode] = useState<FileNode \| null>(null);\n const navigationEpoch = useRef(0);\n\n // アダプターが直接渡された場合は標準のプロバイダーでラップする\n const provider = useMemo(() => {\n if (propProvider) return propProvider;\n if (adapter) return new StorageFileProvider(adapter);\n throw new Error('Either provider or adapter must be provided to FileBrowser');\n }, [propProvider, adapter]);\n\n const {\n state,\n verifyingIds,\n navigate,\n navigateUp,\n search,\n openNode,\n setViewMode,\n select,\n refresh,\n deleteNodes,\n renameNode,\n updateTags,\n verifyNode,\n } = useStorageBrowser({\n provider,\n initialPath,\n initialViewMode,\n groupingAxis,\n });\n\n const handleOpen = useCallback(\n async (node: FileNode) => {\n if (node.kind === 'folder') navigationEpoch.current++;\n const url = await openNode(node);\n if (url) {\n setPreviewNode(node);\n setPreviewUrl(url);\n onOpenFile?.(node, url);\n }\n },\n [openNode, onOpenFile],\n );\n\n const handleDelete = useCallback(\n async (node: FileNode) => {\n if (confirm(`Are you sure you want to delete \"${node.name}\"?`)) {\n await deleteNodes([node.id]);\n }\n },\n [deleteNodes],\n );\n\n const handleDetails = useCallback((node: FileNode) => {\n setDetailsNode(node);\n }, []);\n\n const handleRename = useCallback(\n async (node: FileNode) => {\n const newName = prompt('Enter new name:', node.name);\n if (newName && newName !== node.name) {\n await renameNode(node.id, newName);\n }\n },\n [renameNode],\n );\n\n const handleUpdateTags = useCallback(\n async (node: FileNode) => {\n const currentTags = node.metadata?.tags \|\| '';\n const newTags = prompt('Enter tags (comma separated):', currentTags);\n if (newTags !== null && newTags !== currentTags) {\n await updateTags(node.id, newTags);\n }\n },\n [updateTags],\n );\n\n const handleCreateFolder = useCallback(async () => {\n const name = prompt('Enter folder name:');\n if (name) {\n await provider.createFolder(state.path, name);\n refresh();\n }\n }, [provider, state.path, refresh]);\n\n const handleUpload = useCallback(async () => {\n // 簡易的なファイル選択\n const input = document.createElement('input');\n input.type = 'file';\n input.multiple = true;\n input.onchange = async (e) => {\n const files = (e.target as HTMLInputElement).files;\n if (!files) return;\n\n for (const file of Array.from(files)) {\n await provider.uploadFile(state.path, file, file.name);\n }\n refresh();\n };\n input.click();\n }, [provider, state.path, refresh]);\n\n const dragSnapshot = useRef<{provider: FileProvider; path: string; viewMode: FileBrowserViewMode; navigationEpoch: number} \| null>(null);\n const refreshContext = useRef<{provider: FileProvider; path: string; refresh: () => void} \| null>(null);\n useLayoutEffect(() => {\n refreshContext.current = {provider, path: state.path, refresh};\n return () => {refreshContext.current = null;};\n }, [provider, state.path, refresh]);\n useLayoutEffect(() => {\n navigationEpoch.current++;\n return () => {navigationEpoch.current++;};\n }, [provider, initialPath]);\n useLayoutEffect(() => {\n dragSnapshot.current = null;\n }, [provider, state.path, state.viewMode, state.isLoading, state.nodes]);\n const handleDragStart: DnDProviderProps['onDragStart'] = () => {\n dragSnapshot.current = {provider, path: state.path, viewMode: state.viewMode, navigationEpoch: navigationEpoch.current};\n };\n const handleDragEnd: DnDProviderProps['onDragEnd'] = async (event, manager) => {\n const snapshot = dragSnapshot.current;\n dragSnapshot.current = null;\n const {source, target} = event.operation;\n if (!snapshot \|\| snapshot.navigationEpoch !== navigationEpoch.current \|\| snapshot.provider !== provider \|\| snapshot.path !== state.path \|\| snapshot.viewMode !== state.viewMode \|\| state.isLoading) return;\n if (!source \|\| !target \|\| manager.registry.draggables.get(source.id) !== source \|\| manager.registry.droppables.get(target.id) !== target) return;\n const move = resolveFileDrop(event, state.nodes);\n if (!move) return;\n try {\n await provider.moveNode(move.nodeId, move.targetPath);\n const current = refreshContext.current;\n if (current?.provider === provider && current.path === snapshot.path && navigationEpoch.current === snapshot.navigationEpoch) current.refresh();\n } catch (error) {\n alert(error instanceof Error ? error.message : 'Failed to move file');\n }\n };\n\n return (\n <div\n className={`flex flex-col h-full bg-background border rounded-lg overflow-hidden ${className}`}\n >\n {/ ツールバー /}\n <FileNavbar\n path={state.path}\n viewMode={state.viewMode}\n isLoading={state.isLoading}\n onNavigate={path => {navigationEpoch.current++; navigate(path);}}\n onNavigateUp={() => {navigationEpoch.current++; navigateUp();}}\n onSetViewMode={setViewMode}\n onRefresh={refresh}\n onSearch={search}\n onUpload={handleUpload}\n onCreateFolder={handleCreateFolder}\n />\n\n {/ エラー表示 /}\n {state.error && (\n <Alert variant='destructive' className='m-2'>\n <AlertCircle className='h-4 w-4' />\n <AlertTitle>Error</AlertTitle>\n <AlertDescription>{state.error}</AlertDescription>\n </Alert>\n )}\n\n {/ メインコンテンツ /}\n <DnDProvider onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <div className='flex-1 relative flex flex-col min-h-0'>\n {state.isLoading && state.nodes.length === 0 ? (\n <div className='flex-1 flex items-center justify-center'>\n <Loader2 className='w-8 h-8 animate-spin text-muted-foreground' />\n </div>\n ) : (\n <>\n {state.viewMode === 'list' ? (\n <FileListView\n nodes={state.nodes}\n selectedIds={state.selectedIds}\n verifyingIds={verifyingIds}\n onSelect={select}\n onOpen={handleOpen}\n onDelete={handleDelete}\n onDetails={handleDetails}\n onRename={handleRename}\n onUpdateTags={handleUpdateTags}\n onVerify={(node) => void verifyNode(node.id)}\n />\n ) : (\n <FileGridView\n nodes={state.nodes}\n selectedIds={state.selectedIds}\n verifyingIds={verifyingIds}\n onSelect={select}\n onOpen={handleOpen}\n onDelete={handleDelete}\n onDetails={handleDetails}\n onRename={handleRename}\n onUpdateTags={handleUpdateTags}\n onVerify={(node) => void verifyNode(node.id)}\n />\n )}\n </>\n )}\n </div>\n </DnDProvider>\n\n {/ ステータスバー /}\n <div className='px-3 py-1.5 border-t bg-muted/30 flex items-center justify-between text-[11px] text-muted-foreground'>\n <div className='flex items-center gap-3'>\n <span>{state.nodes.length} items</span>\n {state.selectedIds.length > 0 && (\n <span className='text-primary font-medium'>{state.selectedIds.length} selected</span>\n )}\n </div>\n <div>{state.path \|\| 'Root'}</div>\n </div>\n\n {/ プレビューモーダル /}\n <FilePreview\n node={previewNode}\n url={previewUrl}\n onClose={() => {\n setPreviewNode(null);\n setPreviewUrl(null);\n }}\n />\n\n {/ 詳細パネル */}\n <FileDetailsPanel\n node={detailsNode}\n provider={provider}\n onClose={() => setDetailsNode(null)}\n />\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/tools/components/file-browser/FileGridView.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../../ui/components/ui/badge-components.cjs"),r=require("../../../ui/components/ui/empty.cjs"),i=require("../../../ui/components/ui/file-icon.cjs"),a=require("../ui/dnd/Draggable.cjs"),o=require("../ui/dnd/Droppable.cjs"),s=require("./FileContextMenu.cjs");let c=require("react/jsx-runtime"),l=require("react");l=e.__toESM(l,1);let u=require("lucide-react");function d({nodes:e,selectedIds:l,verifyingIds:d={},onSelect:f,onOpen:p,onDelete:m,onDetails:h,onRename:g,onUpdateTags:_,onVerify:v}){let y=(e,t)=>{e.metaKey||e.ctrlKey?l.includes(t.id)?f(l.filter(e=>e!==t.id)):f([...l,t.id]):f([t.id])},b=(e,r)=>{let a=e.metadata?.tags?.split(`,`).filter(Boolean)||[],o=d[e.id];return(0,c.jsxs)(`div`,{className:t.cn(`group flex flex-col items-center p-2 rounded-xl transition-all border border-transparent cursor-pointer select-none relative w-full h-full`,r?`bg-primary/10 border-primary/20 ring-2 ring-primary/10`:`hover:bg-muted/50 hover:border-muted-foreground/10`),onClick:t=>y(t,e),onDoubleClick:()=>p(e),children:[(0,c.jsxs)(`div`,{className:`relative w-full aspect-square flex items-center justify-center mb-2`,children:[(0,c.jsx)(i.FileIcon,{kind:e.kind,contentType:e.contentType,className:t.cn(`w-12 h-12 transition-transform`,r?`scale-110`:`group-hover:scale-105`)}),r&&(0,c.jsx)(`div`,{className:`absolute top-0 right-0 bg-primary text-primary-foreground rounded-full p-0.5 shadow-sm z-10`,children:(0,c.jsx)(u.Check,{className:`w-3 h-3`,strokeWidth:3})}),o?.loading&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-background/80 rounded-full p-0.5 shadow-sm`,children:(0,c.jsx)(u.Loader2,{className:`h-3 w-3 animate-spin`})}),o?.valid===!0&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-green-100 text-green-700 rounded-full p-0.5 shadow-sm`,title:`Integrity Verified`,children:(0,c.jsx)(u.ShieldCheck,{className:`h-3 w-3`})}),o?.valid===!1&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-destructive/10 text-destructive rounded-full p-0.5 shadow-sm`,title:o.error,children:(0,c.jsx)(u.ShieldAlert,{className:`h-3 w-3`})})]}),(0,c.jsx)(`span`,{className:`w-full text-center text-xs font-medium truncate px-1 leading-relaxed`,children:e.name}),(0,c.jsxs)(`div`,{className:`flex flex-wrap justify-center gap-0.5 mt-1 min-h-[16px]`,children:[a.slice(0,2).map(e=>(0,c.jsx)(n.Badge,{variant:`outline`,className:`px-1 py-0 text-[8px] h-3.5 leading-none bg-background/50`,children:e},e)),a.length>2&&(0,c.jsxs)(`span`,{className:`text-[8px] text-muted-foreground`,children:[`+`,a.length-2]})]}),e.size!==void 0&&e.kind===`file`&&(0,c.jsxs)(`span`,{className:`text-[10px] text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity mt-0.5`,children:[Math.round(e.size/1024),` KB`]})]})};return e.length===0?(0,c.jsx)(r.Empty,{className:`flex-1 border-t rounded-none bg-muted/10`,children:(0,c.jsxs)(r.EmptyHeader,{children:[(0,c.jsx)(r.EmptyMedia,{variant:`icon`,children:(0,c.jsx)(u.FolderOpen,{})}),(0,c.jsx)(r.EmptyTitle,{children:`This folder is empty`}),(0,c.jsx)(r.EmptyDescription,{children:`Upload files to get started.`})]})}):(0,c.jsx)(`div`,{className:`flex-1 overflow-auto p-4 bg-muted/5 border-t`,children:(0,c.jsx)(`div`,{className:`grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8 gap-4`,children:e.map(e=>{let n=l.includes(e.id);return(0,c.jsx)(s.FileContextMenu,{node:e,onOpen:p,onDelete:m,onDetails:h,onRename:g,onUpdateTags:_,onVerify:v,children:(0,c.jsx)(`div`,{className:`w-full h-full`,children:e.kind===`file`?(0,c.jsx)(a.Draggable,{id:e.id,data:e,children:({setNodeRef:t,style:r,attributes:i,listeners:a})=>(0,c.jsx)(`div`,{ref:t,style:r,...i,...a,className:`w-full h-full`,children:b(e,n)})}):(0,c.jsx)(o.Droppable,{id:e.id,data:e,children:({setNodeRef:r,isOver:i})=>(0,c.jsx)(`div`,{ref:r,className:t.cn(`w-full h-full rounded-xl`,i&&`bg-primary/10 ring-4 ring-primary/20`),children:b(e,n)})})})},e.id)})})})}exports.FileGridView=d;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../ui/lib/utils.cjs"),n=require("../../../ui/components/ui/badge-components.cjs"),r=require("../../../ui/components/ui/empty.cjs"),i=require("../../../ui/components/ui/file-icon.cjs"),a=require("../ui/dnd/Draggable.cjs"),o=require("../ui/dnd/Droppable.cjs"),s=require("./FileContextMenu.cjs");let c=require("react/jsx-runtime"),l=require("react");l=e.__toESM(l,1);let u=require("lucide-react");function d({nodes:e,selectedIds:l,verifyingIds:d={},onSelect:f,onOpen:p,onDelete:m,onDetails:h,onRename:g,onUpdateTags:_,onVerify:v}){let y=(e,t)=>{e.metaKey||e.ctrlKey?l.includes(t.id)?f(l.filter(e=>e!==t.id)):f([...l,t.id]):f([t.id])},b=(e,r,a)=>{let o=e.metadata?.tags?.split(`,`).filter(Boolean)||[],s=d[e.id];return(0,c.jsxs)(`div`,{className:t.cn(`group flex flex-col items-center p-2 rounded-xl transition-all border border-transparent cursor-pointer select-none relative w-full h-full`,r?`bg-primary/10 border-primary/20 ring-2 ring-primary/10`:`hover:bg-muted/50 hover:border-muted-foreground/10`),onClick:t=>y(t,e),onDoubleClick:()=>p(e),children:[(0,c.jsxs)(`div`,{className:`relative w-full aspect-square flex items-center justify-center mb-2`,children:[a?(0,c.jsx)(`button`,{type:`button`,ref:a,"aria-label":`Move ${e.name}`,className:`flex items-center justify-center w-full h-full border-0 bg-transparent p-0`,children:(0,c.jsx)(i.FileIcon,{kind:e.kind,contentType:e.contentType,className:t.cn(`w-12 h-12 transition-transform`,r?`scale-110`:`group-hover:scale-105`)})}):(0,c.jsx)(i.FileIcon,{kind:e.kind,contentType:e.contentType,className:t.cn(`w-12 h-12 transition-transform`,r?`scale-110`:`group-hover:scale-105`)}),r&&(0,c.jsx)(`div`,{className:`absolute top-0 right-0 bg-primary text-primary-foreground rounded-full p-0.5 shadow-sm z-10`,children:(0,c.jsx)(u.Check,{className:`w-3 h-3`,strokeWidth:3})}),s?.loading&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-background/80 rounded-full p-0.5 shadow-sm`,children:(0,c.jsx)(u.Loader2,{className:`h-3 w-3 animate-spin`})}),s?.valid===!0&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-green-100 text-green-700 rounded-full p-0.5 shadow-sm`,title:`Integrity Verified`,children:(0,c.jsx)(u.ShieldCheck,{className:`h-3 w-3`})}),s?.valid===!1&&(0,c.jsx)(`div`,{className:`absolute bottom-0 left-0 bg-destructive/10 text-destructive rounded-full p-0.5 shadow-sm`,title:s.error,children:(0,c.jsx)(u.ShieldAlert,{className:`h-3 w-3`})})]}),(0,c.jsx)(`span`,{className:`w-full text-center text-xs font-medium truncate px-1 leading-relaxed`,children:e.name}),(0,c.jsxs)(`div`,{className:`flex flex-wrap justify-center gap-0.5 mt-1 min-h-[16px]`,children:[o.slice(0,2).map(e=>(0,c.jsx)(n.Badge,{variant:`outline`,className:`px-1 py-0 text-[8px] h-3.5 leading-none bg-background/50`,children:e},e)),o.length>2&&(0,c.jsxs)(`span`,{className:`text-[8px] text-muted-foreground`,children:[`+`,o.length-2]})]}),e.size!==void 0&&e.kind===`file`&&(0,c.jsxs)(`span`,{className:`text-[10px] text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity mt-0.5`,children:[Math.round(e.size/1024),` KB`]})]})};return e.length===0?(0,c.jsx)(r.Empty,{className:`flex-1 border-t rounded-none bg-muted/10`,children:(0,c.jsxs)(r.EmptyHeader,{children:[(0,c.jsx)(r.EmptyMedia,{variant:`icon`,children:(0,c.jsx)(u.FolderOpen,{})}),(0,c.jsx)(r.EmptyTitle,{children:`This folder is empty`}),(0,c.jsx)(r.EmptyDescription,{children:`Upload files to get started.`})]})}):(0,c.jsx)(`div`,{className:`flex-1 overflow-auto p-4 bg-muted/5 border-t`,children:(0,c.jsx)(`div`,{className:`grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8 gap-4`,children:e.map(e=>{let n=l.includes(e.id);return(0,c.jsx)(s.FileContextMenu,{node:e,onOpen:p,onDelete:m,onDetails:h,onRename:g,onUpdateTags:_,onVerify:v,children:(0,c.jsx)(`div`,{className:`w-full h-full`,children:e.kind===`file`?(0,c.jsx)(a.Draggable,{id:e.id,data:e,children:({ref:t,handleRef:r,style:i})=>(0,c.jsx)(`div`,{ref:t,"data-file-drag":e.id,style:i,className:`w-full h-full`,children:b(e,n,r)})}):(0,c.jsx)(o.Droppable,{id:e.id,data:e,children:({ref:r,isDropTarget:i})=>(0,c.jsx)(`div`,{ref:r,"data-file-drop":e.id,"data-drop-over":i,className:t.cn(`w-full h-full rounded-xl`,i&&`bg-primary/10 ring-4 ring-primary/20`),children:b(e,n)})})})},e.id)})})})}exports.FileGridView=d;
 //# sourceMappingURL=FileGridView.cjs.map

package/dist/tools/components/file-browser/FileGridView.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileGridView.cjs","names":["cn","FileIcon","Check","Loader2","ShieldCheck","ShieldAlert","Badge","Empty","EmptyHeader","EmptyMedia","FolderOpen","EmptyTitle","EmptyDescription","FileContextMenu","Draggable","Droppable","require_runtime","require_ui_lib_utils","require_ui_components_ui_badge_components","require_ui_components_ui_empty","require_ui_components_ui_file_icon","require_tools_components_ui_dnd_Draggable","require_tools_components_ui_dnd_Droppable","require_tools_components_file_browser_FileContextMenu","react_jsx_runtime","react","lucide_react","FileGridView","handleItemClick","selectedIds","node","onSelect","id","renderNodeContent","tags","verification","verifyingIds","isSelected","e","onOpen","tag","nodes","setNodeRef","attributes","listeners","isOver"],"sources":["../../../../src/tools/components/file-browser/FileGridView.tsx"],"sourcesContent":["import React from 'react';\nimport { FileIcon } from '../ui/file-icon';\nimport type { FileNode } from './types';\nimport { cn } from '../../lib/utils';\nimport { Badge } from '../ui/badge';\nimport { FileContextMenu } from './FileContextMenu';\nimport { Draggable, Droppable } from '../ui/dnd';\nimport { ShieldCheck, ShieldAlert, Loader2, Check, FolderOpen } from 'lucide-react';\nimport { Empty, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle } from '../ui/empty';\n\nexport interface FileGridViewProps {\n /** 表示するノード一覧 /\n nodes: FileNode[];\n /* 選択されているノードのID一覧 /\n selectedIds: string[];\n /* 検証状態のマップ /\n verifyingIds?: Record<string, { loading: boolean; valid?: boolean; error?: string }>;\n /* 選択状態が変更された時のコールバック /\n onSelect: (ids: string[]) => void;\n /* ノードがダブルクリック（またはフォルダ移動）された時のコールバック /\n onOpen: (node: FileNode) => void;\n /* ノードを削除する時のコールバック /\n onDelete: (node: FileNode) => void;\n /* 詳細を表示する時のコールバック /\n onDetails?: (node: FileNode) => void;\n /* 名前変更時のコールバック /\n onRename?: (node: FileNode) => void;\n /* タグ更新時のコールバック /\n onUpdateTags?: (node: FileNode) => void;\n /* 整合性検証時のコールバック /\n onVerify?: (node: FileNode) => void;\n}\n\n/\n ファイルの一覧表示（グリッド形式）\n /\nexport function FileGridView({\n nodes,\n selectedIds,\n verifyingIds = {},\n onSelect,\n onOpen,\n onDelete,\n onDetails,\n onRename,\n onUpdateTags,\n onVerify,\n}: FileGridViewProps) {\n const handleItemClick = (e: React.MouseEvent, node: FileNode) => {\n // Ctrl/Cmd キーで複数選択\n if (e.metaKey \|\| e.ctrlKey) {\n if (selectedIds.includes(node.id)) {\n onSelect(selectedIds.filter((id) => id !== node.id));\n } else {\n onSelect([...selectedIds, node.id]);\n }\n } else {\n onSelect([node.id]);\n }\n };\n\n const renderNodeContent = (node: FileNode, isSelected: boolean) => {\n const tags = node.metadata?.tags?.split(',').filter(Boolean) \|\| [];\n const verification = verifyingIds[node.id];\n\n return (\n <div\n className={cn(\n 'group flex flex-col items-center p-2 rounded-xl transition-all border border-transparent cursor-pointer select-none relative w-full h-full',\n isSelected\n ? 'bg-primary/10 border-primary/20 ring-2 ring-primary/10'\n : 'hover:bg-muted/50 hover:border-muted-foreground/10',\n )}\n onClick={(e) => handleItemClick(e, node)}\n onDoubleClick={() => onOpen(node)}\n >\n <div className='relative w-full aspect-square flex items-center justify-center mb-2'>\n <FileIcon\n kind={node.kind}\n contentType={node.contentType}\n className={cn(\n 'w-12 h-12 transition-transform',\n isSelected ? 'scale-110' : 'group-hover:scale-105',\n )}\n />\n\n {/ 選択チェックマーク /}\n {isSelected && (\n <div className='absolute top-0 right-0 bg-primary text-primary-foreground rounded-full p-0.5 shadow-sm z-10'>\n <Check className='w-3 h-3' strokeWidth={3} />\n </div>\n )}\n\n {/ 検証ステータス */}\n {verification?.loading && (\n <div className='absolute bottom-0 left-0 bg-background/80 rounded-full p-0.5 shadow-sm'>\n <Loader2 className='h-3 w-3 animate-spin' />\n </div>\n )}\n {verification?.valid === true && (\n <div\n className='absolute bottom-0 left-0 bg-green-100 text-green-700 rounded-full p-0.5 shadow-sm'\n title='Integrity Verified'\n >\n <ShieldCheck className='h-3 w-3' />\n </div>\n )}\n {verification?.valid === false && (\n <div\n className='absolute bottom-0 left-0 bg-destructive/10 text-destructive rounded-full p-0.5 shadow-sm'\n title={verification.error}\n >\n <ShieldAlert className='h-3 w-3' />\n </div>\n )}\n </div>\n\n <span className='w-full text-center text-xs font-medium truncate px-1 leading-relaxed'>\n {node.name}\n </span>\n\n <div className='flex flex-wrap justify-center gap-0.5 mt-1 min-h-[16px]'>\n {tags.slice(0, 2).map((tag) => (\n <Badge\n key={tag}\n variant='outline'\n className='px-1 py-0 text-[8px] h-3.5 leading-none bg-background/50'\n >\n {tag}\n </Badge>\n ))}\n {tags.length > 2 && (\n <span className='text-[8px] text-muted-foreground'>+{tags.length - 2}</span>\n )}\n </div>\n\n {node.size !== undefined && node.kind === 'file' && (\n <span className='text-[10px] text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity mt-0.5'>\n {Math.round(node.size / 1024)} KB\n </span>\n )}\n </div>\n );\n };\n\n if (nodes.length === 0) {\n return (\n <Empty className='flex-1 border-t rounded-none bg-muted/10'>\n <EmptyHeader>\n <EmptyMedia variant='icon'>\n <FolderOpen />\n </EmptyMedia>\n <EmptyTitle>This folder is empty</EmptyTitle>\n <EmptyDescription>Upload files to get started.</EmptyDescription>\n </EmptyHeader>\n </Empty>\n );\n }\n\n return (\n <div className='flex-1 overflow-auto p-4 bg-muted/5 border-t'>\n <div className='grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8 gap-4'>\n {nodes.map((node) => {\n const isSelected = selectedIds.includes(node.id);\n\n return (\n <FileContextMenu\n key={node.id}\n node={node}\n onOpen={onOpen}\n onDelete={onDelete}\n onDetails={onDetails}\n onRename={onRename}\n onUpdateTags={onUpdateTags}\n onVerify={onVerify}\n >\n <div className='w-full h-full'>\n {node.kind === 'file' ? (\n <Draggable id={node.id} data={node}>\n {({ setNodeRef, style, attributes, listeners }) => (\n <div\n ref={setNodeRef}\n style={style}\n {...attributes}\n {...listeners}\n className='w-full h-full'\n >\n {renderNodeContent(node, isSelected)}\n </div>\n )}\n </Draggable>\n ) : (\n <Droppable id={node.id} data={node}>\n {({ setNodeRef, isOver }) => (\n <div\n ref={setNodeRef}\n className={cn(\n 'w-full h-full rounded-xl',\n isOver && 'bg-primary/10 ring-4 ring-primary/20',\n )}\n >\n {renderNodeContent(node, isSelected)}\n </div>\n )}\n </Droppable>\n )}\n </div>\n </FileContextMenu>\n );\n })}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"FileGridView.cjs","names":["cn","FileIcon","Check","Loader2","ShieldCheck","ShieldAlert","Badge","Empty","EmptyHeader","EmptyMedia","FolderOpen","EmptyTitle","EmptyDescription","FileContextMenu","Draggable","Droppable","require_runtime","require_ui_lib_utils","require_ui_components_ui_badge_components","require_ui_components_ui_empty","require_ui_components_ui_file_icon","require_tools_components_ui_dnd_Draggable","require_tools_components_ui_dnd_Droppable","require_tools_components_file_browser_FileContextMenu","react_jsx_runtime","react","lucide_react","FileGridView","handleItemClick","selectedIds","node","onSelect","id","renderNodeContent","tags","verification","verifyingIds","isSelected","e","onOpen","handleRef","tag","nodes","isDropTarget"],"sources":["../../../../src/tools/components/file-browser/FileGridView.tsx"],"sourcesContent":["import React from 'react';\nimport { FileIcon } from '../ui/file-icon';\nimport type { FileNode } from './types';\nimport { cn } from '../../lib/utils';\nimport { Badge } from '../ui/badge';\nimport { FileContextMenu } from './FileContextMenu';\nimport { Draggable, Droppable } from '../ui/dnd';\nimport { ShieldCheck, ShieldAlert, Loader2, Check, FolderOpen } from 'lucide-react';\nimport { Empty, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle } from '../ui/empty';\n\nexport interface FileGridViewProps {\n /** 表示するノード一覧 /\n nodes: FileNode[];\n /* 選択されているノードのID一覧 /\n selectedIds: string[];\n /* 検証状態のマップ /\n verifyingIds?: Record<string, { loading: boolean; valid?: boolean; error?: string }>;\n /* 選択状態が変更された時のコールバック /\n onSelect: (ids: string[]) => void;\n /* ノードがダブルクリック（またはフォルダ移動）された時のコールバック /\n onOpen: (node: FileNode) => void;\n /* ノードを削除する時のコールバック /\n onDelete: (node: FileNode) => void;\n /* 詳細を表示する時のコールバック /\n onDetails?: (node: FileNode) => void;\n /* 名前変更時のコールバック /\n onRename?: (node: FileNode) => void;\n /* タグ更新時のコールバック /\n onUpdateTags?: (node: FileNode) => void;\n /* 整合性検証時のコールバック /\n onVerify?: (node: FileNode) => void;\n}\n\n/\n Render a grid of host-owned file nodes with native icon drag handles.\n * @param props - Current nodes, selected ids, optional verification state and host\n * selection/open/delete/detail/rename/tag/verify callbacks; no storage is configured here.\n * @returns The grid view; empty listings show the corresponding empty state.\n * @remarks Place standalone views under DnDProvider from the same native engine.\n * Selection and open callbacks remain host-owned. Import Appkit CSS once.\n * @example\n * ```tsx\n * import {FileGridView} from '@alneas/appkit-react/tools/file-browser';\n * import {DnDProvider} from '@alneas/appkit-react/tools/ui';\n * import '@alneas/appkit-react/styles';\n * export function EmptyFiles() {\n * return <DnDProvider><FileGridView nodes={[]} selectedIds={[]}\n * onSelect={() => {}} onOpen={() => {}} onDelete={() => {}} /></DnDProvider>;\n * }\n * ```\n /\nexport function FileGridView({\n nodes,\n selectedIds,\n verifyingIds = {},\n onSelect,\n onOpen,\n onDelete,\n onDetails,\n onRename,\n onUpdateTags,\n onVerify,\n}: FileGridViewProps) {\n const handleItemClick = (e: React.MouseEvent, node: FileNode) => {\n // Ctrl/Cmd キーで複数選択\n if (e.metaKey \|\| e.ctrlKey) {\n if (selectedIds.includes(node.id)) {\n onSelect(selectedIds.filter((id) => id !== node.id));\n } else {\n onSelect([...selectedIds, node.id]);\n }\n } else {\n onSelect([node.id]);\n }\n };\n\n const renderNodeContent = (node: FileNode, isSelected: boolean, handleRef?: (element: Element \| null) => void) => {\n const tags = node.metadata?.tags?.split(',').filter(Boolean) \|\| [];\n const verification = verifyingIds[node.id];\n\n return (\n <div\n className={cn(\n 'group flex flex-col items-center p-2 rounded-xl transition-all border border-transparent cursor-pointer select-none relative w-full h-full',\n isSelected\n ? 'bg-primary/10 border-primary/20 ring-2 ring-primary/10'\n : 'hover:bg-muted/50 hover:border-muted-foreground/10',\n )}\n onClick={(e) => handleItemClick(e, node)}\n onDoubleClick={() => onOpen(node)}\n >\n <div className='relative w-full aspect-square flex items-center justify-center mb-2'>\n {handleRef ? <button type='button' ref={handleRef} aria-label={`Move ${node.name}`} className='flex items-center justify-center w-full h-full border-0 bg-transparent p-0'>\n <FileIcon\n kind={node.kind}\n contentType={node.contentType}\n className={cn(\n 'w-12 h-12 transition-transform',\n isSelected ? 'scale-110' : 'group-hover:scale-105',\n )}\n />\n </button> : (\n <FileIcon\n kind={node.kind}\n contentType={node.contentType}\n className={cn(\n 'w-12 h-12 transition-transform',\n isSelected ? 'scale-110' : 'group-hover:scale-105',\n )}\n />\n )}\n\n {/ 選択チェックマーク /}\n {isSelected && (\n <div className='absolute top-0 right-0 bg-primary text-primary-foreground rounded-full p-0.5 shadow-sm z-10'>\n <Check className='w-3 h-3' strokeWidth={3} />\n </div>\n )}\n\n {/ 検証ステータス */}\n {verification?.loading && (\n <div className='absolute bottom-0 left-0 bg-background/80 rounded-full p-0.5 shadow-sm'>\n <Loader2 className='h-3 w-3 animate-spin' />\n </div>\n )}\n {verification?.valid === true && (\n <div\n className='absolute bottom-0 left-0 bg-green-100 text-green-700 rounded-full p-0.5 shadow-sm'\n title='Integrity Verified'\n >\n <ShieldCheck className='h-3 w-3' />\n </div>\n )}\n {verification?.valid === false && (\n <div\n className='absolute bottom-0 left-0 bg-destructive/10 text-destructive rounded-full p-0.5 shadow-sm'\n title={verification.error}\n >\n <ShieldAlert className='h-3 w-3' />\n </div>\n )}\n </div>\n\n <span className='w-full text-center text-xs font-medium truncate px-1 leading-relaxed'>\n {node.name}\n </span>\n\n <div className='flex flex-wrap justify-center gap-0.5 mt-1 min-h-[16px]'>\n {tags.slice(0, 2).map((tag) => (\n <Badge\n key={tag}\n variant='outline'\n className='px-1 py-0 text-[8px] h-3.5 leading-none bg-background/50'\n >\n {tag}\n </Badge>\n ))}\n {tags.length > 2 && (\n <span className='text-[8px] text-muted-foreground'>+{tags.length - 2}</span>\n )}\n </div>\n\n {node.size !== undefined && node.kind === 'file' && (\n <span className='text-[10px] text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity mt-0.5'>\n {Math.round(node.size / 1024)} KB\n </span>\n )}\n </div>\n );\n };\n\n if (nodes.length === 0) {\n return (\n <Empty className='flex-1 border-t rounded-none bg-muted/10'>\n <EmptyHeader>\n <EmptyMedia variant='icon'>\n <FolderOpen />\n </EmptyMedia>\n <EmptyTitle>This folder is empty</EmptyTitle>\n <EmptyDescription>Upload files to get started.</EmptyDescription>\n </EmptyHeader>\n </Empty>\n );\n }\n\n return (\n <div className='flex-1 overflow-auto p-4 bg-muted/5 border-t'>\n <div className='grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8 gap-4'>\n {nodes.map((node) => {\n const isSelected = selectedIds.includes(node.id);\n\n return (\n <FileContextMenu\n key={node.id}\n node={node}\n onOpen={onOpen}\n onDelete={onDelete}\n onDetails={onDetails}\n onRename={onRename}\n onUpdateTags={onUpdateTags}\n onVerify={onVerify}\n >\n <div className='w-full h-full'>\n {node.kind === 'file' ? (\n <Draggable id={node.id} data={node}>\n {({ ref, handleRef, style }) => (\n <div\n ref={ref}\n data-file-drag={node.id}\n style={style}\n className='w-full h-full'\n >\n {renderNodeContent(node, isSelected, handleRef)}\n </div>\n )}\n </Draggable>\n ) : (\n <Droppable id={node.id} data={node}>\n {({ ref, isDropTarget }) => (\n <div\n ref={ref}\n data-file-drop={node.id}\n data-drop-over={isDropTarget}\n className={cn(\n 'w-full h-full rounded-xl',\n isDropTarget && 'bg-primary/10 ring-4 ring-primary/20',\n )}\n >\n {renderNodeContent(node, isSelected)}\n </div>\n )}\n </Droppable>\n )}\n </div>\n </FileContextMenu>\n );\n })}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/tools/components/file-browser/FileGridView.d.cts CHANGED Viewed

@@ -27,6 +27,21 @@ export interface FileGridViewProps {
     onVerify?: (node: FileNode) => void;
 }
 /**
- * ファイルの一覧表示（グリッド形式）
+ * Render a grid of host-owned file nodes with native icon drag handles.
+ * @param props - Current nodes, selected ids, optional verification state and host
+ * selection/open/delete/detail/rename/tag/verify callbacks; no storage is configured here.
+ * @returns The grid view; empty listings show the corresponding empty state.
+ * @remarks Place standalone views under DnDProvider from the same native engine.
+ * Selection and open callbacks remain host-owned. Import Appkit CSS once.
+ * @example
+ * ```tsx
+ * import {FileGridView} from '@alneas/appkit-react/tools/file-browser';
+ * import {DnDProvider} from '@alneas/appkit-react/tools/ui';
+ * import '@alneas/appkit-react/styles';
+ * export function EmptyFiles() {
+ *   return <DnDProvider><FileGridView nodes={[]} selectedIds={[]}
+ *     onSelect={() => {}} onOpen={() => {}} onDelete={() => {}} /></DnDProvider>;
+ * }
+ * ```
  */
 export declare function FileGridView({ nodes, selectedIds, verifyingIds, onSelect, onOpen, onDelete, onDetails, onRename, onUpdateTags, onVerify, }: FileGridViewProps): React.JSX.Element;

package/dist/tools/components/file-browser/FileGridView.d.ts CHANGED Viewed

@@ -27,6 +27,21 @@ export interface FileGridViewProps {
     onVerify?: (node: FileNode) => void;
 }
 /**
- * ファイルの一覧表示（グリッド形式）
+ * Render a grid of host-owned file nodes with native icon drag handles.
+ * @param props - Current nodes, selected ids, optional verification state and host
+ * selection/open/delete/detail/rename/tag/verify callbacks; no storage is configured here.
+ * @returns The grid view; empty listings show the corresponding empty state.
+ * @remarks Place standalone views under DnDProvider from the same native engine.
+ * Selection and open callbacks remain host-owned. Import Appkit CSS once.
+ * @example
+ * ```tsx
+ * import {FileGridView} from '@alneas/appkit-react/tools/file-browser';
+ * import {DnDProvider} from '@alneas/appkit-react/tools/ui';
+ * import '@alneas/appkit-react/styles';
+ * export function EmptyFiles() {
+ *   return <DnDProvider><FileGridView nodes={[]} selectedIds={[]}
+ *     onSelect={() => {}} onOpen={() => {}} onDelete={() => {}} /></DnDProvider>;
+ * }
+ * ```
  */
 export declare function FileGridView({ nodes, selectedIds, verifyingIds, onSelect, onOpen, onDelete, onDetails, onRename, onUpdateTags, onVerify, }: FileGridViewProps): React.JSX.Element;

package/dist/tools/components/file-browser/FileGridView.js CHANGED Viewed

@@ -13,8 +13,8 @@ import { Check as p, FolderOpen as m, Loader2 as h, ShieldAlert as g, ShieldChec
 function v({ nodes: v, selectedIds: y, verifyingIds: b = {}, onSelect: x, onOpen: S, onDelete: C, onDetails: w, onRename: T, onUpdateTags: E, onVerify: D }) {
 	let O = (e, t) => {
 		e.metaKey || e.ctrlKey ? y.includes(t.id) ? x(y.filter((e) => e !== t.id)) : x([...y, t.id]) : x([t.id]);
-	}, k = (n, r) => {
-		let i = n.metadata?.tags?.split(",").filter(Boolean) || [], a = b[n.id];
+	}, k = (n, r, i) => {
+		let a = n.metadata?.tags?.split(",").filter(Boolean) || [], o = b[n.id];
 		return /* @__PURE__ */ f("div", {
 			className: e("group flex flex-col items-center p-2 rounded-xl transition-all border border-transparent cursor-pointer select-none relative w-full h-full", r ? "bg-primary/10 border-primary/20 ring-2 ring-primary/10" : "hover:bg-muted/50 hover:border-muted-foreground/10"),
 			onClick: (e) => O(e, n),
@@ -23,7 +23,17 @@ function v({ nodes: v, selectedIds: y, verifyingIds: b = {}, onSelect: x, onOpen
 				/* @__PURE__ */ f("div", {
 					className: "relative w-full aspect-square flex items-center justify-center mb-2",
 					children: [
-						/* @__PURE__ */ d(s, {
+						i ? /* @__PURE__ */ d("button", {
+							type: "button",
+							ref: i,
+							"aria-label": `Move ${n.name}`,
+							className: "flex items-center justify-center w-full h-full border-0 bg-transparent p-0",
+							children: /* @__PURE__ */ d(s, {
+								kind: n.kind,
+								contentType: n.contentType,
+								className: e("w-12 h-12 transition-transform", r ? "scale-110" : "group-hover:scale-105")
+							})
+						}) : /* @__PURE__ */ d(s, {
 							kind: n.kind,
 							contentType: n.contentType,
 							className: e("w-12 h-12 transition-transform", r ? "scale-110" : "group-hover:scale-105")
@@ -35,18 +45,18 @@ function v({ nodes: v, selectedIds: y, verifyingIds: b = {}, onSelect: x, onOpen
 								strokeWidth: 3
 							})
 						}),
-						a?.loading && /* @__PURE__ */ d("div", {
+						o?.loading && /* @__PURE__ */ d("div", {
 							className: "absolute bottom-0 left-0 bg-background/80 rounded-full p-0.5 shadow-sm",
 							children: /* @__PURE__ */ d(h, { className: "h-3 w-3 animate-spin" })
 						}),
-						a?.valid === !0 && /* @__PURE__ */ d("div", {
+						o?.valid === !0 && /* @__PURE__ */ d("div", {
 							className: "absolute bottom-0 left-0 bg-green-100 text-green-700 rounded-full p-0.5 shadow-sm",
 							title: "Integrity Verified",
 							children: /* @__PURE__ */ d(_, { className: "h-3 w-3" })
 						}),
-						a?.valid === !1 && /* @__PURE__ */ d("div", {
+						o?.valid === !1 && /* @__PURE__ */ d("div", {
 							className: "absolute bottom-0 left-0 bg-destructive/10 text-destructive rounded-full p-0.5 shadow-sm",
-							title: a.error,
+							title: o.error,
 							children: /* @__PURE__ */ d(g, { className: "h-3 w-3" })
 						})
 					]
@@ -57,13 +67,13 @@ function v({ nodes: v, selectedIds: y, verifyingIds: b = {}, onSelect: x, onOpen
 				}),
 				/* @__PURE__ */ f("div", {
 					className: "flex flex-wrap justify-center gap-0.5 mt-1 min-h-[16px]",
-					children: [i.slice(0, 2).map((e) => /* @__PURE__ */ d(t, {
+					children: [a.slice(0, 2).map((e) => /* @__PURE__ */ d(t, {
 						variant: "outline",
 						className: "px-1 py-0 text-[8px] h-3.5 leading-none bg-background/50",
 						children: e
-					}, e)), i.length > 2 && /* @__PURE__ */ f("span", {
+					}, e)), a.length > 2 && /* @__PURE__ */ f("span", {
 						className: "text-[8px] text-muted-foreground",
-						children: ["+", i.length - 2]
+						children: ["+", a.length - 2]
 					})]
 				}),
 				n.size !== void 0 && n.kind === "file" && /* @__PURE__ */ f("span", {
@@ -102,19 +112,20 @@ function v({ nodes: v, selectedIds: y, verifyingIds: b = {}, onSelect: x, onOpen
 						children: t.kind === "file" ? /* @__PURE__ */ d(c, {
 							id: t.id,
 							data: t,
-							children: ({ setNodeRef: e, style: r, attributes: i, listeners: a }) => /* @__PURE__ */ d("div", {
+							children: ({ ref: e, handleRef: r, style: i }) => /* @__PURE__ */ d("div", {
 								ref: e,
-								style: r,
-								...i,
-								...a,
+								"data-file-drag": t.id,
+								style: i,
 								className: "w-full h-full",
-								children: k(t, n)
+								children: k(t, n, r)
 							})
 						}) : /* @__PURE__ */ d(l, {
 							id: t.id,
 							data: t,
-							children: ({ setNodeRef: r, isOver: i }) => /* @__PURE__ */ d("div", {
+							children: ({ ref: r, isDropTarget: i }) => /* @__PURE__ */ d("div", {
 								ref: r,
+								"data-file-drop": t.id,
+								"data-drop-over": i,
 								className: e("w-full h-full rounded-xl", i && "bg-primary/10 ring-4 ring-primary/20"),
 								children: k(t, n)
 							})