zidane-ui 9.0.4 → 9.1.3

package/dist/session/ArtifactsPanel.js

@@ -1,10 +1,15 @@
+import { IconButton } from "../components/IconButton.js";
 import { PanelEmpty, PanelLoading } from "../components/PanelEmpty.js";
 import { PANEL_ROW, PANEL_ROW_HOVER, RowBadge } from "../components/PanelRows.js";
 import { RowActionsMenu } from "../components/RowActionsMenu.js";
-import { countArtifacts } from "./headless/artifacts.js";
+import { useExtensionItems } from "../extensions/ExtensionsProvider.js";
 import { useSessionArtifacts, useSessionHost } from "./SessionProvider.js";
+import { useLinkRouter } from "../extensions/links.js";
 import { useSessionLabels } from "./useSessionLabels.js";
 import { ArtifactRowChips, badgeColorStyle, badgeToneClass } from "./ArtifactRowChips.js";
+import { renderersFor } from "../extensions/headless/select.js";
+import { ExtensionRenderer } from "../extensions/ExtensionRenderer.js";
+import { countArtifacts } from "./headless/artifacts.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 //#region src/session/ArtifactsPanel.tsx
@@ -15,13 +20,17 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 * is the link; copy, reveal and remove live in its right-click menu.
 *
 * Rows arrive rendered by the host (`artifacts.groups`), so unknown kinds
-* still show. When the list is in, every row is re-resolved once per open
+* still show. A row whose kind has an extension renderer
+* (`ctx.add(Renderer, { for: { artifact } })`) opens onto its detail,
+* drawn by that renderer with `{ artifact }`. When the list is in, every row is re-resolved once per open
 * (`artifacts.refreshRow` with `force`), and again (cache-gated) on hover;
 * a change comes back through the host's wake-up.
 */
 /** Forced refreshes by artifact id, across mounts: remounting the panel must not refetch every row each time. */
 const lastForcedAt = /* @__PURE__ */ new Map();
 const FORCED_REFRESH_FRESH_MS = 3e4;
+/** Ids held before the oldest goes (a forgotten one only refreshes again). */
+const LAST_FORCED_MAX = 500;
 /**
 * Renders a session's artifacts by kind, with a count summary under them.
 *
@@ -55,7 +64,11 @@ function ArtifactsPanel({ sessionId, focus = null, remoteName = null, onOpenPath
 		refreshed.current.add(row.artifact.id);
 		const now = Date.now();
 		if (force && now - (lastForcedAt.get(row.artifact.id) ?? -Infinity) < FORCED_REFRESH_FRESH_MS) return;
-		if (force) lastForcedAt.set(row.artifact.id, now);
+		if (force) {
+			lastForcedAt.delete(row.artifact.id);
+			lastForcedAt.set(row.artifact.id, now);
+			if (lastForcedAt.size > LAST_FORCED_MAX) lastForcedAt.delete(lastForcedAt.keys().next().value);
+		}
 		refreshRow(sessionId, row.artifact, force ? { force: true } : void 0).catch(() => void 0);
 	}, [refreshRow, sessionId]);
 	useEffect(() => {
@@ -118,11 +131,14 @@ function ArtifactsPanel({ sessionId, focus = null, remoteName = null, onOpenPath
 }
 function ArtifactRow({ row, focused, remoteName, onOpenPath, onRevealPath, onFocus, onRemove }) {
 	const labels = useSessionLabels();
+	const links = useLinkRouter();
 	const { artifact, row: view } = row;
 	const href = view.href;
 	const isUrl = href !== void 0 && /^https?:\/\//.test(href);
 	const [menu, setMenu] = useState(null);
 	const [openError, setOpenError] = useState(null);
+	const hasDetail = renderersFor(useExtensionItems("renderer"), { artifact: artifact.kind }).length > 0;
+	const [detailOpen, setDetailOpen] = useState(false);
 	const open = async (event) => {
 		setOpenError(null);
 		try {
@@ -131,7 +147,14 @@ function ArtifactRow({ row, focused, remoteName, onOpenPath, onRevealPath, onFoc
 				setOpenError(labels.artifactOnRemote(remoteName));
 				return;
 			}
-			if (!await onOpenPath(href, event)) setOpenError(labels.artifactPathUnavailable);
+			await links.open(href, {
+				source: "panel",
+				...event ? { event } : {}
+			}, () => {
+				onOpenPath(href, event).then((ok) => {
+					if (!ok) setOpenError(labels.artifactPathUnavailable);
+				}, (err) => setOpenError(err instanceof Error ? err.message : String(err)));
+			});
 		} catch (err) {
 			setOpenError(err instanceof Error ? err.message : String(err));
 		}
@@ -185,35 +208,52 @@ function ArtifactRow({ row, focused, remoteName, onOpenPath, onRevealPath, onFoc
 				children: [
 					/* @__PURE__ */ jsxs("div", {
 						className: "flex items-baseline gap-2 min-w-0",
-						children: [isUrl ? /* @__PURE__ */ jsx("a", {
-							href,
-							target: "_blank",
-							rel: "noreferrer",
-							className: "truncate text-zg-ui text-[var(--zg-text)] no-underline hover:underline",
-							title: href,
-							children: view.title
-						}) : href && onOpenPath ? /* @__PURE__ */ jsx("button", {
-							type: "button",
-							onClick: (e) => void open(e),
-							className: "truncate text-left text-zg-ui text-[var(--zg-text)] bg-transparent border-0 p-0 cursor-pointer hover:underline",
-							title: labels.artifactOpen(href),
-							children: view.title
-						}) : /* @__PURE__ */ jsx("span", {
-							className: "truncate text-zg-ui text-[var(--zg-text)]",
-							title: href ?? artifact.uri,
-							children: view.title
-						}), view.status && /* @__PURE__ */ jsx("span", {
-							className: `ml-auto shrink-0 text-zg-meta leading-4 whitespace-nowrap ${badgeToneClass(view.tone)}`,
-							style: badgeColorStyle(view.color),
-							children: view.status
-						})]
+						children: [
+							isUrl ? /* @__PURE__ */ jsx("a", {
+								href,
+								target: "_blank",
+								rel: "noreferrer",
+								onClick: links.anchorClick(href, { source: "panel" }),
+								className: "truncate text-zg-ui text-[var(--zg-text)] no-underline hover:underline",
+								title: href,
+								children: view.title
+							}) : href && onOpenPath ? /* @__PURE__ */ jsx("button", {
+								type: "button",
+								onClick: (e) => void open(e),
+								className: "truncate text-left text-zg-ui text-[var(--zg-text)] bg-transparent border-0 p-0 cursor-pointer hover:underline",
+								title: labels.artifactOpen(href),
+								children: view.title
+							}) : /* @__PURE__ */ jsx("span", {
+								className: "truncate text-zg-ui text-[var(--zg-text)]",
+								title: href ?? artifact.uri,
+								children: view.title
+							}),
+							view.status && /* @__PURE__ */ jsx("span", {
+								className: `ml-auto shrink-0 text-zg-meta leading-4 whitespace-nowrap ${badgeToneClass(view.tone)}`,
+								style: badgeColorStyle(view.color),
+								children: view.status
+							}),
+							hasDetail && /* @__PURE__ */ jsx(IconButton, {
+								icon: detailOpen ? "i-ph-caret-up" : "i-ph-caret-down",
+								label: detailOpen ? labels.artifactHideDetails : labels.artifactShowDetails,
+								"aria-expanded": detailOpen,
+								onClick: () => setDetailOpen((open) => !open),
+								className: view.status ? "shrink-0" : "ml-auto shrink-0"
+							})
+						]
 					}),
 					openError && /* @__PURE__ */ jsx("div", {
 						role: "alert",
 						className: "text-xs text-[var(--zg-warn)]",
 						children: openError
 					}),
-					/* @__PURE__ */ jsx(RowFacts, { view })
+					/* @__PURE__ */ jsx(RowFacts, { view }),
+					hasDetail && detailOpen && /* @__PURE__ */ jsx(ExtensionRenderer, {
+						for: { artifact: artifact.kind },
+						data: { artifact },
+						defaultView: null,
+						className: "mt-1.5 min-w-0"
+					})
 				]
 			}),
 			/* @__PURE__ */ jsx(RowActionsMenu, {

package/dist/session/ProjectHome.d.ts

@@ -0,0 +1,82 @@
+import { WorkspacePanels } from "../workspace/headless/host.js";
+import { PanelOpenEvent } from "../workspace/PanelContentView.js";
+import { CSSProperties, ReactNode } from "react";
+//#region src/session/ProjectHome.d.ts
+/** The project a home is for. */
+interface ProjectHomeProject {
+  /** Its name (the folder's). */
+  name: string;
+  /** Its path, shown under the name (its machine's home folder as `~`). */
+  path: string;
+  /** The host the project is on (`HostView.id`), for showing its path. Absent: this computer. */
+  hostId?: string;
+  /** Its icon (the sidebar's project icon). */
+  icon?: ReactNode;
+  /** Its repository (`owner/repo`), shown as a chip before the path. */
+  repo?: ProjectHomeRepo;
+}
+/** The projects the name switches between: the composer's folder menu, opened from the name. */
+interface ProjectHomeSwitcher {
+  /** The projects to pick from, most recent first. */
+  projects: readonly string[];
+  /** The project on show, checked in the list. */
+  current: string | null;
+  /** Switches to a project. */
+  onPick: (folder: string) => void;
+  /** Imports a repository. Absent: not offered. */
+  onImportRepo?: () => void | Promise<void>;
+  /** "Select directory…" (a native dialog). Absent: not offered. */
+  onSelectDirectory?: () => void | Promise<void>;
+}
+/** A project's repository, as its header's chip shows it. */
+interface ProjectHomeRepo {
+  /** `owner/repo` (or the folder's name for a repository without a remote). */
+  name: string;
+  /** It has a web page (`onOpenRepo` opens it); else the chip shows the working tree. Words the tooltip. */
+  web: boolean;
+  /** The chip's icon class (`i-ph-github-logo`). Default: a git branch. */
+  icon?: string;
+}
+/** Props for {@link ProjectHome}. */
+interface ProjectHomeProps {
+  /** Where blocks come from. Absent: no blocks (see `blocksUnavailable`). */
+  panels?: WorkspacePanels;
+  /** The folder the blocks are for; `''` for the home of no project. */
+  cwd: string;
+  /** Key the arrangement is kept under (the project root, qualified by its host). */
+  projectKey: string;
+  /** The project. Absent: the home of no project, headed by the greeting. */
+  project?: ProjectHomeProject;
+  /** A click on the project's name opens this menu of projects. Absent: the name is plain text. */
+  switcher?: ProjectHomeSwitcher;
+  /** The project's blocks can't load here (a project on a server): say so instead. */
+  blocksUnavailable?: boolean;
+  /** The blocks shown before the user adds any (panel ids); the rest wait in Add block. Absent: every block. */
+  defaultBlocks?: readonly string[];
+  /** Opens a block row's session. */
+  onOpenSession?: (sessionId: string) => void;
+  /** Opens a block row's path. */
+  onOpenPath?: (path: string, event?: PanelOpenEvent) => void;
+  /** A click on the repository chip (its web page, or the working tree). Absent: the chip is plain text. */
+  onOpenRepo?: () => void;
+  /** A click on the project's path chip: open the Files panel. Absent: the chip is plain text. */
+  onOpenFiles?: () => void;
+  /** "Open in Finder" in the path chip's right-click menu. */
+  onRevealPath?: (path: string) => void;
+  /** "Open in editor" in the path chip's right-click menu. */
+  onOpenInEditor?: (path: string) => void;
+  /** The moment the greeting describes. Default: when it mounts. */
+  now?: Date;
+  /** Extra classes on the root. */
+  className?: string;
+  /** Inline styles on the root. */
+  style?: CSSProperties;
+}
+/**
+ * Renders the project home.
+ *
+ * @param props - The {@link ProjectHomeProps}.
+ */
+declare function ProjectHome({ panels, cwd, projectKey, project, switcher, blocksUnavailable, defaultBlocks, onOpenSession, onOpenPath, onOpenRepo, onOpenFiles, onRevealPath, onOpenInEditor, now: nowProp, className, style }: ProjectHomeProps): import("react").JSX.Element;
+//#endregion
+export { ProjectHome, ProjectHomeProject, ProjectHomeProps, ProjectHomeRepo, ProjectHomeSwitcher };