@parallelworks/ui 0.25.0 → 0.27.0

package/dist/ai/components/PastedText.js

@@ -3,6 +3,8 @@ import { FiX } from "../../icons/fi/FiX.js";
 import { ImSpinner5 } from "../../icons/im/ImSpinner5.js";
 import { useChatConfig } from "../core/config.js";
 import { formatFileSize } from "../utils.js";
+import Markdown from "../ui/Markdown.js";
+import { fencePaste } from "../core/pasteLanguage.js";
 import { splitPastes } from "../core/pastes.js";
 import cx from "classnames";
 import { Fragment } from "react";
@@ -14,7 +16,7 @@ function PasteFileCard({ id, lines, bytes, saving = false, error, onRemove }) {
 	const detail = error ?? (saving ? t.saving : `${t.lines(lines)} · ${formatFileSize(bytes)}`);
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": "paste-file-card",
-		className: cx("inline-flex max-w-full items-center gap-2.5 rounded-xl border px-3 py-2 align-top whitespace-normal", "bg-(--theme-muted-panel-bg)", error ? "border-red-500" : "theme-border"),
+		className: cx("inline-flex max-w-full items-center gap-2.5 rounded-xl px-3 py-2 align-top whitespace-normal", "bg-(--theme-panel-bg)", error ? "border border-red-500" : "chat-hairline"),
 		children: [
 			/* @__PURE__ */ jsx(FiFile, { className: "h-5 w-5 flex-shrink-0 theme-muted-text" }),
 			/* @__PURE__ */ jsxs("div", {
@@ -39,14 +41,27 @@ function PasteFileCard({ id, lines, bytes, saving = false, error, onRemove }) {
 		]
 	});
 }
-/** A user message as typed: an inline paste as its text, one sent as its file as a card. */
+/** A user message as typed: an inline paste as a code block in the language
+*  it reads as, one sent as its file as a card. The blank lines the composer puts around a
+*  paste would stack on the block's own spacing, so they are dropped. */
 function UserMessageText({ content, pastes }) {
 	if (!pastes?.length) return /* @__PURE__ */ jsx(Fragment$1, { children: content });
-	return /* @__PURE__ */ jsx(Fragment$1, { children: splitPastes(content, pastes).map((segment, i) => {
-		if (typeof segment === "string") return /* @__PURE__ */ jsx(Fragment, { children: segment }, i);
-		if (segment.inline && segment.text !== void 0) return /* @__PURE__ */ jsx(Fragment, { children: segment.text }, i);
+	const segments = splitPastes(content, pastes);
+	const shows = (seg) => typeof seg !== "string" || seg.trim() !== "";
+	const blockSpacing = (i) => cx(segments.slice(0, i).some(shows) ? "mt-2.5" : "mt-0", segments.slice(i + 1).some(shows) ? "mb-2.5" : "mb-0");
+	return /* @__PURE__ */ jsx(Fragment$1, { children: segments.map((segment, i) => {
+		if (typeof segment === "string") {
+			let text = segment;
+			if (i > 0) text = text.replace(/^\n+/, "");
+			if (i < segments.length - 1) text = text.replace(/\n+$/, "");
+			return text ? /* @__PURE__ */ jsx(Fragment, { children: text }, i) : null;
+		}
+		if (segment.inline && segment.text !== void 0) return /* @__PURE__ */ jsx("span", {
+			className: cx("chat-paste-code block", blockSpacing(i)),
+			children: /* @__PURE__ */ jsx(Markdown, { children: fencePaste(segment.text) })
+		}, i);
 		return /* @__PURE__ */ jsx("span", {
-			className: "my-1 block",
+			className: cx("flex [&>*]:flex-1", blockSpacing(i)),
 			children: /* @__PURE__ */ jsx(PasteFileCard, {
 				id: segment.id,
 				lines: segment.lines,

package/dist/ai/components/Reasoning.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+/** The line a turn's reasoning folds under. It opens the reasoning in place,
+ *  above the answer it led to, rather than in a panel the eye has to cross
+ *  the page to read. */
+export declare function ReasoningToggle({ open, onToggle, shimmer, children, }: {
+    open: boolean;
+    onToggle: () => void;
+    /** While the model is still thinking the label shimmers. */
+    shimmer?: boolean;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** The reasoning itself: smaller and quieter than the answer, hung off a
+ *  hairline of the accent so it reads as the assistant's aside. */
+export declare function ReasoningBody({ className, children, }: {
+    className?: string;
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/ai/components/Reasoning.js

@@ -0,0 +1,29 @@
+import { LuChevronRight } from "../../icons/lu/LuChevronRight.js";
+import cx from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/ai/components/Reasoning.tsx
+/** The line a turn's reasoning folds under. It opens the reasoning in place,
+*  above the answer it led to, rather than in a panel the eye has to cross
+*  the page to read. */
+function ReasoningToggle({ open, onToggle, shimmer = false, children }) {
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		onClick: onToggle,
+		"aria-expanded": open,
+		className: "group/reasoning -ml-1 flex items-center gap-x-1 rounded-md px-1 py-0.5 text-sm theme-muted-text transition-colors hover:theme-text",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: cx(shimmer && "animate-shimmer text-shimmer"),
+			children
+		}), /* @__PURE__ */ jsx(LuChevronRight, { className: cx("h-3.5 w-3.5 transition-transform duration-200 motion-reduce:transition-none", open && "rotate-90") })]
+	});
+}
+/** The reasoning itself: smaller and quieter than the answer, hung off a
+*  hairline of the accent so it reads as the assistant's aside. */
+function ReasoningBody({ className, children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cx("chat-reasoning-body ml-1 mt-1.5 mb-3 pl-4 text-sm leading-relaxed theme-muted-text", className),
+		children
+	});
+}
+//#endregion
+export { ReasoningBody, ReasoningToggle };

package/dist/ai/components/agent/AgentMessageParts.js

@@ -10,6 +10,7 @@ import { thinkingHeading } from "../../agent/transcript.js";
 import { useChatConfig } from "../../core/config.js";
 import Markdown from "../../ui/Markdown.js";
 import { chatProseClasses } from "../../ui/prose.js";
+import { ReasoningBody, ReasoningToggle } from "../Reasoning.js";
 import cx from "classnames";
 import { useEffect, useMemo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -520,41 +521,50 @@ function formatThinkingDuration(ms) {
 	if (s < 60) return `${s}s`;
 	return `${Math.floor(s / 60)}m ${s % 60}s`;
 }
-/** The TUI's thought: the body shows while it streams, then folds to its
-*  label and opens on request. The composer's activity line carries the
-*  live signal, so nothing here animates. */
+/** The TUI's thought, drawn like a chat reply's: while it streams its label
+*  shimmers over the latest lines, then it folds to the label and opens in
+*  place on request. */
 function ReasoningBlock({ part, isStreaming }) {
 	const { strings } = useChatConfig();
 	const t = strings.thinking;
 	const [expanded, setExpanded] = useState(false);
 	const label = thinkingHeading(part.text) || (part.durationMs ? t.thoughtFor(formatThinkingDuration(part.durationMs)) : t.label);
 	const hasBody = part.text.trim() !== "";
-	const body = hasBody && /* @__PURE__ */ jsx("div", {
-		className: "ml-1 border-l theme-border pl-3 text-sm theme-muted-text",
-		"data-testid": "reasoning-body",
-		children: /* @__PURE__ */ jsx(Markdown, {
-			isStreaming: isStreaming ?? false,
-			children: part.text
-		})
+	const markdown = /* @__PURE__ */ jsx(Markdown, {
+		isStreaming: isStreaming ?? false,
+		children: part.text
 	});
-	if (isStreaming) return /* @__PURE__ */ jsx("div", {
+	if (isStreaming) return /* @__PURE__ */ jsxs("div", {
 		className: "py-1.5",
 		"data-testid": "reasoning-part",
-		children: body
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "animate-shimmer text-shimmer text-sm",
+			children: label
+		}), hasBody && /* @__PURE__ */ jsx(ReasoningBody, {
+			className: "chat-reasoning-tail",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "flex max-h-20 flex-col justify-end overflow-hidden",
+				"data-testid": "reasoning-body",
+				children: markdown
+			})
+		})]
+	});
+	if (!hasBody) return /* @__PURE__ */ jsx("div", {
+		className: "py-1.5 text-sm theme-muted-text",
+		"data-testid": "reasoning-part",
+		children: label
 	});
 	return /* @__PURE__ */ jsxs("div", {
 		className: "py-1.5",
 		"data-testid": "reasoning-part",
-		children: [/* @__PURE__ */ jsxs("button", {
-			type: "button",
-			onClick: () => hasBody && setExpanded((v) => !v),
-			"aria-expanded": expanded,
-			className: cx("flex min-h-6 items-center gap-x-1 text-sm theme-muted-text transition-colors", hasBody && "hover:theme-text"),
-			children: [/* @__PURE__ */ jsx("span", { children: label }), hasBody && /* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3.5 h-3.5 transition-transform", expanded && "rotate-90") })]
-		}), expanded && /* @__PURE__ */ jsx("div", {
-			className: "mt-1.5",
-			children: body
-		})]
+		children: [/* @__PURE__ */ jsx(ReasoningToggle, {
+			open: expanded,
+			onToggle: () => setExpanded((v) => !v),
+			children: label
+		}), expanded && /* @__PURE__ */ jsx(ReasoningBody, { children: /* @__PURE__ */ jsx("div", {
+			"data-testid": "reasoning-body",
+			children: markdown
+		}) })]
 	});
 }
 function TextBlock({ part, isStreaming }) {

package/dist/ai/core/ChatProvider.js

@@ -441,6 +441,7 @@ function ChatProvider({ adapter, currentUser, navigation, notify, activeConversa
 		try {
 			const useResponses = state.models.find((m) => m.id === modelString)?.supports_responses === true;
 			let thinkingStart = null;
+			let thinkingEnd = null;
 			const markStreamStart = () => {
 				if (thinkingStart === null) thinkingStart = Date.now();
 			};
@@ -460,6 +461,7 @@ function ChatProvider({ adapter, currentUser, navigation, notify, activeConversa
 				},
 				onReasoning: (reasoning) => {
 					markStreamStart();
+					thinkingEnd = Date.now();
 					dispatch({
 						type: "APPEND_STREAMING_REASONING",
 						reasoning,
@@ -485,7 +487,7 @@ function ChatProvider({ adapter, currentUser, navigation, notify, activeConversa
 					if (bgStream) bgStream.parts = liveParts;
 				}
 			}, controller.signal);
-			const thinkingDuration = assistantReasoning && thinkingStart !== null ? Date.now() - thinkingStart : null;
+			const thinkingDuration = assistantReasoning && thinkingStart !== null ? (thinkingEnd ?? Date.now()) - thinkingStart : null;
 			const assistantMessage = {
 				id: assistantMessageId || crypto.randomUUID(),
 				parentId: userMessageId,

package/dist/ai/core/pasteLanguage.d.ts

@@ -0,0 +1,6 @@
+/** The highlighter's name for the language a paste is written in, or ''
+ *  when it is not recognisably one. */
+export declare function guessPasteLanguage(text: string): string;
+/** The paste as a fenced code block in its language. The fence outruns any
+ *  run of backticks inside the paste, so nothing in it can close the fence. */
+export declare function fencePaste(text: string): string;

package/dist/ai/core/pasteLanguage.js

@@ -0,0 +1,45 @@
+//#region src/ai/core/pasteLanguage.ts
+function meaningfulLines(text) {
+	return text.split("\n").filter((l) => l.trim() !== "" && !/^\s*#/.test(l));
+}
+function mostly(lines, test) {
+	return lines.length > 0 && lines.filter(test).length / lines.length >= .8;
+}
+function isJson(trimmed) {
+	if (!/^[[{]/.test(trimmed)) return false;
+	try {
+		JSON.parse(trimmed);
+		return true;
+	} catch {
+		return false;
+	}
+}
+var YAML_LINE = /^\s*(-\s+)?["']?[\w./-]+["']?\s*:(\s|$)|^\s*-(\s|$)|^---\s*$/;
+var TOML_LINE = /^\s*\[{1,2}[\w."-]+\]{1,2}\s*$|^\s*[\w."-]+\s*=\s*\S/;
+/** The highlighter's name for the language a paste is written in, or ''
+*  when it is not recognisably one. */
+function guessPasteLanguage(text) {
+	const trimmed = text.trim();
+	if (!trimmed) return "";
+	if (isJson(trimmed)) return "json";
+	const all = trimmed.split("\n");
+	if (all.some((l) => /^(diff --git |@@ -\d)/.test(l))) return "diff";
+	if (/^<(!doctype html|html)\b/i.test(trimmed)) return "html";
+	if (/^<[?!\w]/.test(trimmed) && trimmed.endsWith(">")) return "xml";
+	const first = all[0] ?? "";
+	if (/^#!.*\b(ba|z)?sh\b/.test(first) || mostly(meaningfulLines(trimmed), (l) => /^\$ /.test(l))) return "bash";
+	if (/^(select|insert|update|delete|create|alter|with)\s/i.test(first)) return "sql";
+	const lines = meaningfulLines(trimmed);
+	if (lines.length >= 2 && mostly(lines, (l) => YAML_LINE.test(l))) return "yaml";
+	if (lines.length >= 2 && mostly(lines, (l) => TOML_LINE.test(l))) return "toml";
+	return "";
+}
+/** The paste as a fenced code block in its language. The fence outruns any
+*  run of backticks inside the paste, so nothing in it can close the fence. */
+function fencePaste(text) {
+	const longest = Math.max(2, ...[...text.matchAll(/`+/g)].map((m) => m[0].length));
+	const fence = "`".repeat(longest + 1);
+	return `${fence}${guessPasteLanguage(text)}\n${text.replace(/\n+$/, "")}\n${fence}`;
+}
+//#endregion
+export { fencePaste, guessPasteLanguage };

package/dist/ai/strings.d.ts

@@ -35,6 +35,15 @@ export interface ChatStrings {
     };
     queue: {
         remove: string;
+        /** Under a message that goes out once the running reply finishes. */
+        waiting: string;
+        /** Under a message a steering host hands to the agent between steps. */
+        waitingNextStep: string;
+        /** Under a message the host has already handed to the running turn. */
+        handedOver: string;
+        /** The visible label of the remove control; `remove` names it for
+         *  assistive technology. */
+        removeShort: string;
     };
     activity: {
         tokens: (input: string, output: string) => string;

package/dist/ai/strings.js

@@ -32,7 +32,13 @@ var defaultChatStrings = {
 		title: "Billing group \"{group}\" is over its allocation",
 		message: "It has reached its allocation limit. Messages to this provider are paused until your administrator increases the allocation."
 	},
-	queue: { remove: "Remove queued message" },
+	queue: {
+		remove: "Remove queued message",
+		waiting: "Queued · sends when this reply finishes",
+		waitingNextStep: "Queued · reaches the agent after its current step",
+		handedOver: "Sent to the running turn",
+		removeShort: "Remove"
+	},
 	providerIssue: {
 		keyRejected: "API key rejected",
 		unreachable: "Endpoint unreachable",

package/dist/ai/ui/sidebar.js

@@ -7,7 +7,7 @@ import { useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/ai/ui/sidebar.tsx
 var SIDEBAR_RAIL_WIDTH_PX = 48;
-var HIGHLIGHT_SELECTED = "bg-[color-mix(in_oklab,var(--theme-panel)_8%,transparent)]";
+var HIGHLIGHT_SELECTED = "bg-[color-mix(in_oklab,var(--theme-accent)_12%,transparent)]";
 var HIGHLIGHT_HOVER = "hover:bg-[color-mix(in_oklab,var(--theme-panel)_5%,transparent)]";
 /** The column a conversation list lives in: it animates between its width
 *  and a rail, unless a drag is setting the width right now. */
@@ -37,7 +37,7 @@ function SidebarToggle({ collapsed, onToggle, openLabel, closeLabel, className }
 function SidebarGroupHeading({ children, tone = "default", testId }) {
 	return /* @__PURE__ */ jsx("h4", {
 		"data-testid": testId,
-		className: cx("mt-4 mb-1 whitespace-nowrap px-2 text-xs font-medium", tone === "attention" ? "text-amber-700 dark:text-amber-300" : "theme-muted-text"),
+		className: cx("mt-5 mb-1 whitespace-nowrap px-2 text-xs font-medium", tone === "attention" ? "text-amber-700 dark:text-amber-300" : "theme-muted-text"),
 		children
 	});
 }
@@ -46,7 +46,7 @@ function SidebarGroupHeading({ children, tone = "default", testId }) {
 function SidebarRow({ selected, menuItems, openMenu, className, children }) {
 	const { active, openMenu: openRowMenu } = useRowMenuActive(openMenu);
 	return /* @__PURE__ */ jsxs("li", {
-		className: cx("group relative flex items-center justify-between rounded-lg px-2 py-1 transition-colors duration-150", selected || active ? HIGHLIGHT_SELECTED : HIGHLIGHT_HOVER, className),
+		className: cx("group relative flex items-center justify-between rounded-lg px-2 py-[3px] transition-colors duration-150", selected || active ? HIGHLIGHT_SELECTED : HIGHLIGHT_HOVER, className),
 		...rowContextMenuProps(openRowMenu, menuItems),
 		children: [children, /* @__PURE__ */ jsx(MoreButton, {
 			active,

package/dist/file-explorer/FileExplorer.js

@@ -81,6 +81,9 @@ function isStorageDirectory(node) {
 function getErrorMessage(error) {
 	return error instanceof Error ? error.message : String(error);
 }
+function isWithinRoots(roots) {
+	return (path) => roots.some(([, root]) => path.startsWith(root));
+}
 /** Directory paths from the storage root down to `path`. */
 function getAncestorDirPaths(path) {
 	const isDir = path.endsWith("/");
@@ -179,14 +182,18 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 	const findStorage = (storageId) => storages.find((s) => s.id === storageId);
 	const storageCanWrite = (storageId) => findStorage(storageId)?.canWrite === true;
 	const storageCanUpload = (storageId) => findStorage(storageId)?.canUpload !== false;
+	const storageCanDelete = (storage) => (storage?.canDelete ?? storage?.canWrite) === true;
 	const selectedStorage = findStorage(selectedNode?.storageId);
 	const selectedNodeCanWrite = selectedStorage?.canWrite === true;
 	const selectedNodeCanUpload = selectedStorage?.canUpload !== false;
+	const selectedNodeCanDelete = storageCanDelete(selectedStorage);
 	const selectedNodeCanShare = selectedStorage?.canShare !== false;
 	const selectedNodeCanManageAccess = selectedStorage?.canManageAccess !== false;
 	const [accessDrawerOpen, setAccessDrawerOpen] = useState(false);
 	const [connectionIssuesMessage, updateConnectionIssuesMessage] = useState(/* @__PURE__ */ new Map());
 	const [hasCorsIssue, setHasCorsIssue] = useState(/* @__PURE__ */ new Map());
+	const [previewNode, setPreviewNode] = useState(null);
+	const [previewOpen, setPreviewOpen] = useState(false);
 	const storageRoots = useMemo(() => {
 		const roots = /* @__PURE__ */ new Map();
 		for (const node of rootNodes) {
@@ -195,32 +202,52 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 		}
 		return roots;
 	}, [rootNodes, parentToChildrenMap]);
+	const storageRootPaths = useMemo(() => new Map(storages.map((storage) => [storage.id, storage.rootPath])), [storages]);
 	const seenStorageRootsRef = useRef(storageRoots);
-	const forgetStorages = useEffectEvent((removed) => {
-		const isUnder = (path) => removed.some(([, root]) => path !== root && path.startsWith(root));
-		const isWithin = (path) => removed.some(([, root]) => path.startsWith(root));
+	const seenRootPathsRef = useRef(storageRootPaths);
+	const dropStorageListings = (roots) => {
+		const isUnder = (path) => roots.some(([, root]) => path !== root && path.startsWith(root));
+		const isWithin = isWithinRoots(roots);
 		for (const path of [...fetchesInFlightRef.current.keys()]) if (isWithin(path)) fetchesInFlightRef.current.delete(path);
-		setListings((prev) => removed.reduce((next, [, root]) => clearListingsUnder(next, root), prev));
+		setListings((prev) => roots.reduce((next, [, root]) => clearListingsUnder(next, root), prev));
 		setLoadingPaths((prev) => new Set([...prev].filter((path) => !isWithin(path))));
 		setExpandedPaths((prev) => new Set([...prev].filter((path) => !isUnder(path))));
-		const withoutRemoved = (prev) => {
+		setCheckedItems((prev) => new Set([...prev].filter((path) => !isWithin(path))));
+		const withoutDropped = (prev) => {
 			const next = new Map(prev);
-			for (const [id] of removed) next.delete(id);
+			for (const [id] of roots) next.delete(id);
 			return next;
 		};
-		updateConnectionIssuesMessage(withoutRemoved);
-		setHasCorsIssue(withoutRemoved);
+		updateConnectionIssuesMessage(withoutDropped);
+		setHasCorsIssue(withoutDropped);
+	};
+	const forgetStorages = useEffectEvent((removed) => {
+		dropStorageListings(removed);
 		const selectedRoot = removed.find(([, root]) => normalizedSelectedPath.startsWith(root))?.[1];
 		if (selectedRoot) {
 			const parent = getParentPath(selectedRoot);
 			setSelectedPath(treeMap[parent] ? parent : "");
 		}
 	});
+	const rerootStorages = useEffectEvent((rerooted) => {
+		dropStorageListings(rerooted);
+		clearPreviewCache(isWithinRoots(rerooted));
+		if (previewNode && rerooted.some(([id]) => id === previewNode.storageId)) {
+			setPreviewOpen(false);
+			setPreviewNode(null);
+		}
+		const selectedRoot = rerooted.find(([, root]) => normalizedSelectedPath.startsWith(root))?.[1];
+		if (selectedRoot && selectedRoot !== normalizedSelectedPath) setSelectedPath(selectedRoot);
+	});
 	useEffect(() => {
+		const seenRootPaths = seenRootPathsRef.current;
 		const removed = [...seenStorageRootsRef.current].filter(([id]) => !storageRoots.has(id));
+		const rerooted = [...storageRoots].filter(([id]) => seenRootPaths.has(id) && seenRootPaths.get(id) !== storageRootPaths.get(id));
 		seenStorageRootsRef.current = storageRoots;
+		seenRootPathsRef.current = storageRootPaths;
 		if (removed.length > 0) forgetStorages(removed);
-	}, [storageRoots]);
+		if (rerooted.length > 0) rerootStorages(rerooted);
+	}, [storageRoots, storageRootPaths]);
 	const [uploadModalOpen, setUploadModalOpen] = useState(false);
 	const [createFolderTarget, setCreateFolderTarget] = useState(null);
 	const [pendingUpload, setPendingUpload] = useState(null);
@@ -229,8 +256,6 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 	const folderInputRef = useRef(null);
 	const [deleteModalOpen, setDeleteModalOpen] = useState(false);
 	const [pendingDelete, setPendingDelete] = useState(null);
-	const [previewNode, setPreviewNode] = useState(null);
-	const [previewOpen, setPreviewOpen] = useState(false);
 	const [detailTab, setDetailTab] = useState("details");
 	useEffect(() => clearPreviewCache, []);
 	const { openMenu, contextMenu } = useRowMenu();
@@ -587,7 +612,7 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 		triggerBrowserDownload(presignedUrl, node.name);
 	};
 	const deleteNode = (node) => {
-		if (findStorage(node.storageId)?.canWrite !== true) {
+		if (!storageCanDelete(findStorage(node.storageId))) {
 			notify.error(t.messages.noWriteAccess);
 			return;
 		}
@@ -610,7 +635,7 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 	};
 	const buildRowMenu = (node) => {
 		const storage = findStorage(node.storageId);
-		const nodeCanWrite = storage?.canWrite === true;
+		const nodeCanDelete = storageCanDelete(storage);
 		const nodeCanShare = storage?.canShare !== false;
 		const isFile = node.type === "file";
 		const uris = getNodeUris(node);
@@ -637,7 +662,7 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 		}
 		actions.push(...getCreateFolderActions(node, storage));
 		actions.push(...extraRowActions?.(node, storage) ?? []);
-		if (nodeCanWrite && !node.root) actions.push({
+		if (nodeCanDelete && !node.root) actions.push({
 			key: "delete",
 			label: t.preview.delete,
 			icon: /* @__PURE__ */ jsx(BiSolidTrashAlt, {}),
@@ -716,7 +741,7 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 		return downloadCommand.build(objects);
 	};
 	const onDeleteClick = () => {
-		if (!selectedNodeCanWrite) {
+		if (!selectedNodeCanDelete) {
 			notify.error(t.messages.noWriteAccess);
 			return;
 		}
@@ -1135,7 +1160,7 @@ function FileExplorer({ storages, onRefresh, refreshKey, onOpenFile, showUserHie
 											children: t.chrome.manageAccess
 										})]
 									}),
-									selectedNodeCanWrite && /* @__PURE__ */ jsxs("button", {
+									selectedNodeCanDelete && /* @__PURE__ */ jsxs("button", {
 										type: "button",
 										"aria-label": t.chrome.delete,
 										className: "btn btn-destructive cursor-pointer flex items-center justify-center",

package/dist/file-explorer/FileExplorerContext.js

@@ -1,10 +1,12 @@
 import { useNotify, useStrings } from "../components/Provider.js";
 import { keyedByContent } from "../components/keys.js";
+import { mapWithConcurrency } from "./lib/batch.js";
 import { calculateUploadNodesTotalSize, getUploadSessionETA, removeLeadingSlash } from "./lib/utils.js";
 import { UploadSessionToast } from "./toasts.js";
 import { createContext, use, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/file-explorer/FileExplorerContext.tsx
+var UPLOAD_CONCURRENCY = 3;
 var FileExplorerContext = createContext(void 0);
 var permissionMessagePattern = /not authorized|access denied|status code 403/i;
 function isPermissionDenied(reason) {
@@ -157,7 +159,7 @@ function FileExplorerProvider({ children }) {
 				closeButton: false,
 				autoClose: false
 			});
-			const results = await Promise.allSettled(session.uploadNodes.map(async (node) => {
+			const results = await mapWithConcurrency(session.uploadNodes, UPLOAD_CONCURRENCY, async (node) => {
 				const fileProgress = session.progress?.allFiles?.get(node.relativePath);
 				if (!fileProgress) return;
 				if (fileProgress.status === "cancelled") throw new Error("Upload cancelled by user");
@@ -228,7 +230,7 @@ function FileExplorerProvider({ children }) {
 					});
 					throw error;
 				}
-			}));
+			});
 			try {
 				await session.refreshTargetNode(session.targetNode);
 			} catch (err) {

package/dist/file-explorer/FilePreview/previewCache.d.ts

@@ -22,5 +22,5 @@ export declare function loadPreviewContent<T>(path: string, loader: (signal: Abo
 export declare function fetchPreviewObject(path: string, url: string, signal: AbortSignal, headers?: HeadersInit): Promise<Response>;
 export declare function peekPreviewUrl(path: string): UrlResult | undefined;
 export declare function peekPreviewContent<T>(path: string): T | undefined;
-export declare function clearPreviewCache(): void;
+export declare function clearPreviewCache(isCleared?: (path: string) => boolean): void;
 export {};

package/dist/file-explorer/FilePreview/previewCache.js

@@ -89,10 +89,12 @@ function peekPreviewUrl(path) {
 function peekPreviewContent(path) {
 	return contentCache.get(path)?.value;
 }
-function clearPreviewCache() {
-	for (const record of contentCache.values()) disposeContent(record);
-	contentCache.clear();
-	urlCache.clear();
+function clearPreviewCache(isCleared = () => true) {
+	for (const [path, record] of contentCache) if (isCleared(path)) {
+		disposeContent(record);
+		contentCache.delete(path);
+	}
+	for (const path of urlCache.keys()) if (isCleared(path)) urlCache.delete(path);
 }
 //#endregion
 export { clearPreviewCache, fetchPreviewObject, loadPreviewContent, loadPreviewUrl, peekPreviewContent, peekPreviewUrl };

package/dist/file-explorer/index.js

@@ -1,8 +1,8 @@
+import { chunk, mapWithConcurrency, paginate } from "./lib/batch.js";
 import { attachmentDisposition, collectObjectKeysToDelete, getObjectKeyFromNode, isClientValid, removeLeadingAndTrailingSlashes } from "./lib/utils.js";
 import { FileExplorerProvider, useFileExplorer } from "./FileExplorerContext.js";
 import { CorsError } from "./lib/errors.js";
 import { NoDataAvailablePreview, SkeletonPreview } from "./helpers.js";
 import { LIST_PAGE_SIZE } from "./lib/paging.js";
 import FileExplorer from "./FileExplorer.js";
-import { chunk, mapWithConcurrency, paginate } from "./lib/batch.js";
 export { CorsError, FileExplorer, FileExplorerProvider, LIST_PAGE_SIZE, NoDataAvailablePreview, SkeletonPreview, attachmentDisposition, chunk, collectObjectKeysToDelete, getObjectKeyFromNode, isClientValid, mapWithConcurrency, paginate, removeLeadingAndTrailingSlashes, useFileExplorer };

package/dist/file-explorer/lib/types.d.ts

@@ -22,9 +22,11 @@ export type TStorage = {
     imageUrl?: string;
     canWrite?: boolean | undefined;
     canUpload?: boolean | undefined;
+    canDelete?: boolean | undefined;
     canShare?: boolean | undefined;
     canManageAccess?: boolean | undefined;
     previewLimits?: Partial<PreviewLimits> | undefined;
+    rootPath?: string | undefined;
 };
 /** A file the host is asked to name or download: its storage, key and name. */
 export interface ExplorerObject {