@anymux/ui-kit 0.1.0 → 0.2.0

package/dist/{file-browser-m5atC3kF.js → file-browser-CkhNwADU.js}

@@ -1,15 +1,15 @@
 import { cn$1 as cn } from "./utils-B4fdKKsy.js";
-import { Tree, TreeModel } from "./tree-Dd9Z0Aso.js";
-import { getIconForFile$1 as getIconForFile } from "./iconMap-V4B8P-Uh.js";
+import { Tree, TreeModel } from "./tree-B9VQcKBp.js";
+import { getIconForFile$1 as getIconForFile } from "./iconMap-DDpe35ek.js";
 import { FileBrowserContext } from "./FileBrowserContext-B6jixa2j.js";
-import { DETAILS_VIEW_TYPE, GRID_VIEW_TYPE, LIST_VIEW_TYPE, ListItems, ListItemsModel, MASONRY_HORIZONTAL_VIEW_TYPE, MASONRY_VERTICAL_VIEW_TYPE, SearchFilter, TREEMAP_VIEW_TYPE, ViewTypeSelector } from "./list-CxfT6hix.js";
+import { DETAILS_VIEW_TYPE, ErrorBoundary, GRID_VIEW_TYPE, LIST_VIEW_TYPE, ListItems, ListItemsModel, MASONRY_HORIZONTAL_VIEW_TYPE, MASONRY_VERTICAL_VIEW_TYPE, SearchFilter, TREEMAP_VIEW_TYPE, ViewTypeSelector } from "./list-DAq-b6RR.js";
 import { ExplorerLayout$1 as ExplorerLayout } from "./ExplorerLayout-CSIJd7N4.js";
-import React, { Component, Suspense, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import React, { Suspense, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { observer } from "mobx-react-lite";
 import { Badge } from "@anymux/ui/components/badge";
 import { Button } from "@anymux/ui/components/button";
 import { PathBreadcrumb } from "@anymux/ui/components/path-breadcrumb";
-import { AlertCircle, AlertTriangle, Archive, ArrowLeft, ArrowRight, ArrowUp, CheckCircle2, CheckSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Download, Eye, File, FileAudio, FileCode, FileImage, FileQuestion, FileSpreadsheet, FileText, FileType, FileUp, FileVideo, Files, Folder, FolderOpen, FolderTree, Grid3X3, Home, ImageIcon, List, Loader2, Maximize, MoreVertical, PanelRightClose, PanelRightOpen, RotateCw, Settings, Upload, X, ZoomIn, ZoomOut } from "lucide-react";
+import { AlertCircle, Archive, ArrowLeft, ArrowRight, ArrowUp, CheckCircle2, CheckSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Download, Eye, File, FileAudio, FileCode, FileImage, FileQuestion, FileSpreadsheet, FileText, FileType, FileUp, FileVideo, Files, Folder, FolderOpen, FolderTree, Grid3X3, Home, ImageIcon, List, Loader2, Maximize, MoreVertical, PanelRightClose, PanelRightOpen, RotateCw, Settings, Upload, X, ZoomIn, ZoomOut } from "lucide-react";
 import { BrowserError } from "@anymux/ui/components/browser-error";
 import { flow, makeAutoObservable, observable, reaction, runInAction } from "mobx";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -2515,17 +2515,17 @@ const ViewerLoadingFallback = ({ name }) => /* @__PURE__ */ jsxs("div", {
 /**
 * Render a single ToolbarAction as a button.
 */
-const ToolbarActionButton = ({ action }) => {
-	const isEnabled = typeof action.enabled === "function" ? action.enabled() : action.enabled !== false;
-	const Icon = action.icon;
+const ToolbarActionButton = ({ action: action$1 }) => {
+	const isEnabled = typeof action$1.enabled === "function" ? action$1.enabled() : action$1.enabled !== false;
+	const Icon = action$1.icon;
 	return /* @__PURE__ */ jsx("button", {
-		onClick: action.onClick,
+		onClick: action$1.onClick,
 		disabled: !isEnabled,
 		className: cn("p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors", "disabled:opacity-40 disabled:pointer-events-none"),
-		title: action.shortcutLabel ? `${action.label} (${action.shortcutLabel})` : action.label,
+		title: action$1.shortcutLabel ? `${action$1.label} (${action$1.shortcutLabel})` : action$1.label,
 		children: Icon ? /* @__PURE__ */ jsx(Icon, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx("span", {
 			className: "text-xs px-1",
-			children: action.label
+			children: action$1.label
 		})
 	});
 };
@@ -2592,12 +2592,12 @@ const ViewerHost = observer(({ viewer, file, mode, onClose, onSave, readOnly, co
 			className: "flex items-center justify-between px-2 py-1 border-b bg-muted/20 flex-shrink-0 min-h-[36px]",
 			children: [/* @__PURE__ */ jsx("div", {
 				className: "flex items-center gap-0.5",
-				children: leftActions.map((action) => /* @__PURE__ */ jsx(ToolbarActionButton, { action }, action.id))
+				children: leftActions.map((action$1) => /* @__PURE__ */ jsx(ToolbarActionButton, { action: action$1 }, action$1.id))
 			}), /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-1",
 				children: [
 					model.toolbarExtras,
-					rightActions.map((action) => /* @__PURE__ */ jsx(ToolbarActionButton, { action }, action.id)),
+					rightActions.map((action$1) => /* @__PURE__ */ jsx(ToolbarActionButton, { action: action$1 }, action$1.id)),
 					hostToolbar
 				]
 			})]
@@ -3072,9 +3072,9 @@ const FileBrowser = observer(({ fileSystem, initialPath = "/", className, showBr
 			onDrop: handleNativeDrop,
 			children: [
 				isDragOver && /* @__PURE__ */ jsx("div", {
-					className: "absolute inset-0 z-50 bg-blue-500/10 border-2 border-dashed border-blue-500 rounded-lg flex items-center justify-center pointer-events-none",
+					className: "absolute inset-0 z-50 bg-primary/10 border-2 border-dashed border-primary rounded-lg flex items-center justify-center pointer-events-none",
 					children: /* @__PURE__ */ jsxs("div", {
-						className: "flex flex-col items-center gap-2 text-blue-600 dark:text-blue-400",
+						className: "flex flex-col items-center gap-2 text-primary",
 						children: [
 							/* @__PURE__ */ jsx(Upload, { className: "w-8 h-8" }),
 							/* @__PURE__ */ jsx("p", {
@@ -3395,78 +3395,6 @@ const FileBrowserItemComponent = observer(({ item, isSelected = false, isHovered
 FileBrowserItemComponent.displayName = "FileBrowserItem";
 var FileBrowserItem_default = FileBrowserItemComponent;
 
-//#endregion
-//#region src/file-browser/components/shared/ErrorBoundary.tsx
-var ErrorBoundary = class extends Component {
-	constructor(props) {
-		super(props);
-		this.handleReset = () => {
-			this.setState({
-				hasError: false,
-				error: null,
-				errorInfo: null
-			});
-		};
-		this.state = {
-			hasError: false,
-			error: null,
-			errorInfo: null
-		};
-	}
-	static getDerivedStateFromError(error) {
-		return {
-			hasError: true,
-			error
-		};
-	}
-	componentDidCatch(error, errorInfo) {
-		const errorInfoString = errorInfo.componentStack || "";
-		this.setState({ errorInfo: errorInfoString });
-		this.props.onError?.(error, errorInfoString);
-		console.error("FileBrowser Error Boundary caught an error:", error);
-		console.error("Error Info:", errorInfo);
-	}
-	render() {
-		if (this.state.hasError) {
-			const { fallback, className } = this.props;
-			const { error, errorInfo } = this.state;
-			if (fallback && error) return fallback(error, errorInfo || "", this.handleReset);
-			return /* @__PURE__ */ jsxs("div", {
-				className: cn("flex flex-col items-center justify-center p-8 text-center border border-destructive/20 rounded-lg bg-destructive/5", className),
-				role: "alert",
-				"aria-live": "assertive",
-				children: [
-					/* @__PURE__ */ jsx(AlertTriangle, {
-						className: "w-12 h-12 text-destructive mb-4",
-						"aria-hidden": "true"
-					}),
-					/* @__PURE__ */ jsx("h2", {
-						className: "text-lg font-semibold text-destructive mb-2",
-						children: "Something went wrong"
-					}),
-					/* @__PURE__ */ jsx("p", {
-						className: "text-sm text-muted-foreground mb-4 max-w-md",
-						children: error?.message || "An unexpected error occurred while rendering the file browser."
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: "flex gap-2",
-						children: [/* @__PURE__ */ jsx("button", {
-							onClick: this.handleReset,
-							className: "px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 transition-colors",
-							children: "Try Again"
-						}), /* @__PURE__ */ jsx("button", {
-							onClick: () => window.location.reload(),
-							className: "px-4 py-2 bg-secondary text-secondary-foreground rounded-md hover:bg-secondary/90 focus:outline-none focus:ring-2 focus:ring-secondary focus:ring-offset-2 transition-colors",
-							children: "Reload Page"
-						})]
-					})
-				]
-			});
-		}
-		return this.props.children;
-	}
-};
-
 //#endregion
 //#region src/file-browser/providers/FileSystemProvider.ts
 var FileSystemProvider = class {
@@ -3650,20 +3578,20 @@ var FileSystemProvider = class {
 		}
 		return null;
 	}
-	canPerformAction(action, items) {
+	canPerformAction(action$1, items) {
 		const supportedActions = [
 			"delete",
 			"rename",
 			"copy",
 			"move"
 		];
-		return supportedActions.includes(action) && items.length > 0;
+		return supportedActions.includes(action$1) && items.length > 0;
 	}
-	async performAction(action, items) {
-		console.log(`Performing action ${action} on items:`, items);
+	async performAction(action$1, items) {
+		console.log(`Performing action ${action$1} on items:`, items);
 		return {
 			success: true,
-			message: `${action} completed`
+			message: `${action$1} completed`
 		};
 	}
 	async initialize() {}
@@ -3976,7 +3904,7 @@ var GitRepositoryProvider = class {
 		}
 		return null;
 	}
-	canPerformAction(action, items) {
+	canPerformAction(action$1, items) {
 		const gitActions = [
 			"stage",
 			"unstage",
@@ -3987,11 +3915,11 @@ var GitRepositoryProvider = class {
 		];
 		const basicActions = ["view", "copy"];
 		const supportedActions = [...gitActions, ...basicActions];
-		return supportedActions.includes(action) && items.length > 0;
+		return supportedActions.includes(action$1) && items.length > 0;
 	}
-	async performAction(action, items) {
-		this.log(`Performing git action ${action} on items:`, items);
-		switch (action) {
+	async performAction(action$1, items) {
+		this.log(`Performing git action ${action$1} on items:`, items);
+		switch (action$1) {
 			case "stage": return {
 				success: true,
 				message: `Staged ${items.length} files`
@@ -4018,7 +3946,7 @@ var GitRepositoryProvider = class {
 			};
 			default: return {
 				success: true,
-				message: `${action} completed`
+				message: `${action$1} completed`
 			};
 		}
 	}
@@ -4396,8 +4324,8 @@ var GitProvider = class {
 			return null;
 		}
 	}
-	canPerformAction(action, items) {
-		switch (action) {
+	canPerformAction(action$1, items) {
+		switch (action$1) {
 			case "git-checkout":
 			case "git-diff":
 			case "git-history": return items.length === 1;
@@ -4406,14 +4334,14 @@ var GitProvider = class {
 			default: return false;
 		}
 	}
-	async performAction(action, items) {
-		switch (action) {
+	async performAction(action$1, items) {
+		switch (action$1) {
 			case "git-checkout": throw new Error("Git checkout action not implemented yet");
 			case "git-diff": throw new Error("Git diff action not implemented yet");
 			case "git-history": throw new Error("Git history action not implemented yet");
 			case "git-stage": throw new Error("Git stage action not implemented yet");
 			case "git-unstage": throw new Error("Git unstage action not implemented yet");
-			default: throw new Error(`Unknown Git action: ${action}`);
+			default: throw new Error(`Unknown Git action: ${action$1}`);
 		}
 	}
 	async initialize() {
@@ -4762,9 +4690,9 @@ var ToolbarManagerModel = class {
 	constructor(owner) {
 		this.toolbarActions = observable.map();
 		this.contextActions = observable.map();
-		this.addAction = (action) => {
-			this.owner.logger?.info(`addAction: ${action.id} (${action.category || "default"})`);
-			this.toolbarActions.set(action.id, action);
+		this.addAction = (action$1) => {
+			this.owner.logger?.info(`addAction: ${action$1.id} (${action$1.category || "default"})`);
+			this.toolbarActions.set(action$1.id, action$1);
 		};
 		this.removeAction = (actionId) => {
 			this.owner.logger?.info(`removeAction: ${actionId}`);
@@ -4780,31 +4708,31 @@ var ToolbarManagerModel = class {
 				});
 			}
 		};
-		this.addContextAction = (action) => {
-			this.owner.logger?.info(`addContextAction: ${action.id}`);
-			this.contextActions.set(action.id, action);
+		this.addContextAction = (action$1) => {
+			this.owner.logger?.info(`addContextAction: ${action$1.id}`);
+			this.contextActions.set(action$1.id, action$1);
 		};
 		this.removeContextAction = (actionId) => {
 			this.owner.logger?.info(`removeContextAction: ${actionId}`);
 			this.contextActions.delete(actionId);
 		};
 		this.getAvailableActions = (context) => {
-			return this.allToolbarActions.filter((action) => {
-				if (action.isVisible && !action.isVisible(context)) return false;
-				if (action.isEnabled && !action.isEnabled(context)) return false;
+			return this.allToolbarActions.filter((action$1) => {
+				if (action$1.isVisible && !action$1.isVisible(context)) return false;
+				if (action$1.isEnabled && !action$1.isEnabled(context)) return false;
 				return true;
 			});
 		};
 		this.getContextActionsForItem = (context) => {
-			return this.allContextActions.filter((action) => {
-				if (action.isVisible && !action.isVisible(context)) return false;
-				if (action.isEnabled && !action.isEnabled(context)) return false;
+			return this.allContextActions.filter((action$1) => {
+				if (action$1.isVisible && !action$1.isVisible(context)) return false;
+				if (action$1.isEnabled && !action$1.isEnabled(context)) return false;
 				return true;
 			});
 		};
 		this.canExecuteAction = (actionId, context) => {
-			const action = this.toolbarActions.get(actionId);
-			if (!action) return false;
+			const action$1 = this.toolbarActions.get(actionId);
+			if (!action$1) return false;
 			const availableActions = this.getAvailableActions(context);
 			return availableActions.some((a) => a.id === actionId);
 		};
@@ -4817,15 +4745,15 @@ var ToolbarManagerModel = class {
 		this.setActions = (actions) => {
 			this.owner.logger?.info(`setActions: ${actions.length} actions`);
 			this.toolbarActions.clear();
-			actions.forEach((action) => {
-				this.toolbarActions.set(action.id, action);
+			actions.forEach((action$1) => {
+				this.toolbarActions.set(action$1.id, action$1);
 			});
 		};
 		this.setContextActions = (actions) => {
 			this.owner.logger?.info(`setContextActions: ${actions.length} actions`);
 			this.contextActions.clear();
-			actions.forEach((action) => {
-				this.contextActions.set(action.id, action);
+			actions.forEach((action$1) => {
+				this.contextActions.set(action$1.id, action$1);
 			});
 		};
 		this.clearAllActions = () => {
@@ -4837,10 +4765,10 @@ var ToolbarManagerModel = class {
 		this.owner = owner;
 	}
 	get globalActions() {
-		return Array.from(this.toolbarActions.values()).filter((action) => action.category === "global");
+		return Array.from(this.toolbarActions.values()).filter((action$1) => action$1.category === "global");
 	}
 	get selectionActions() {
-		return Array.from(this.toolbarActions.values()).filter((action) => action.category === "selection");
+		return Array.from(this.toolbarActions.values()).filter((action$1) => action$1.category === "selection");
 	}
 	get allToolbarActions() {
 		return Array.from(this.toolbarActions.values());
@@ -5745,16 +5673,16 @@ const FileBrowserHeader = observer(({ model, toolbarManager, className, showBrea
 		if (actions.length === 0) return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1" });
 		return /* @__PURE__ */ jsx("div", {
 			className: "flex items-center gap-1",
-			children: actions.map((action) => /* @__PURE__ */ jsx("button", {
-				onClick: () => action.action(context),
-				disabled: action.isEnabled ? !action.isEnabled(context) : false,
-				className: cn("flex items-center gap-1 px-2 py-1 rounded-md text-sm transition-colors", "hover:bg-muted disabled:opacity-50 disabled:cursor-not-allowed", action.variant === "primary" && "bg-primary text-primary-foreground hover:bg-primary/90", action.variant === "destructive" && "text-destructive hover:bg-destructive/10"),
-				title: action.tooltip || action.label,
-				children: action.showLabel !== false && /* @__PURE__ */ jsx("span", {
+			children: actions.map((action$1) => /* @__PURE__ */ jsx("button", {
+				onClick: () => action$1.action(context),
+				disabled: action$1.isEnabled ? !action$1.isEnabled(context) : false,
+				className: cn("flex items-center gap-1 px-2 py-1 rounded-md text-sm transition-colors", "hover:bg-muted disabled:opacity-50 disabled:cursor-not-allowed", action$1.variant === "primary" && "bg-primary text-primary-foreground hover:bg-primary/90", action$1.variant === "destructive" && "text-destructive hover:bg-destructive/10"),
+				title: action$1.tooltip || action$1.label,
+				children: action$1.showLabel !== false && /* @__PURE__ */ jsx("span", {
 					className: "hidden sm:inline",
-					children: action.label
+					children: action$1.label
 				})
-			}, action.id))
+			}, action$1.id))
 		});
 	};
 	return /* @__PURE__ */ jsxs("header", {
@@ -6751,5 +6679,5 @@ ViewModeToggle.displayName = "ViewModeToggle";
 var ViewModeToggle_default = ViewModeToggle;
 
 //#endregion
-export { ErrorBoundary, FileBrowser, FileBrowserContent_default, FileBrowserHeader_default, FileBrowserItem_default, FileBrowserModel, FileIcon_default, FileSystemBridge, FileSystemListProvider, FileSystemProvider, FileSystemTreeProvider, GitProvider, GitRepositoryProvider, ListViewUIModel, ListView_default, NavigationButtons_default, NavigationManagerModel, SelectionManagerModel, ThumbnailViewUIModel, ToolbarManagerModel, TreeViewUIModel, TreeView_default, UploadModel, ViewModeManagerModel, ViewModeToggle_default, ViewerHost, ViewerHostModel, ViewerRegistry, globalViewerRegistry, viewerConfigToPlugin };
-//# sourceMappingURL=file-browser-m5atC3kF.js.map
+export { FileBrowser, FileBrowserContent_default, FileBrowserHeader_default, FileBrowserItem_default, FileBrowserModel, FileIcon_default, FileSystemBridge, FileSystemListProvider, FileSystemProvider, FileSystemTreeProvider, GitProvider, GitRepositoryProvider, ListViewUIModel, ListView_default, NavigationButtons_default, NavigationManagerModel, SelectionManagerModel, ThumbnailViewUIModel, ToolbarManagerModel, TreeViewUIModel, TreeView_default, UploadModel, ViewModeManagerModel, ViewModeToggle_default, ViewerHost, ViewerHostModel, ViewerRegistry, globalViewerRegistry, viewerConfigToPlugin };
+//# sourceMappingURL=file-browser-CkhNwADU.js.map