dsh-git-badge 0.14.1 → 0.16.0

package/lib/client.js

@@ -233,41 +233,42 @@ window.__ModuleLoader__.load({
 
 		/**
 		 * The /gh picker's sub-actions — the skill invocations the checkout
-		 * justifies, most urgent first. Same ranking the server's nextStep uses,
-		 * but spoken in skill arguments; the generic "next" entry is skipped when
-		 * a specific rule already names the same situation (its why would be
-		 * identical, and two rows for one fact is noise).
+		 * justifies, most urgent first. The server's `next` (the ranked top rule,
+		 * already carrying args/why/what) always leads; the client adds the other
+		 * justified actions as secondary entries, mirroring the server's category
+		 * rules but never re-deciding the winner.
 		 */
 		function ghSkillActions(info) {
 			if (info === void 0 || info === null || info.git !== true) return [];
 			const subs = [];
 			const seen = new Set();
-			const add = (args, why) => {
-				if (seen.has(args)) return;
+			const add = (args, why, what) => {
+				if (args === void 0 || args === null || args === "" || seen.has(args)) return;
 				seen.add(args);
-				subs.push({ args, why });
+				subs.push({ args, why, what });
 			};
+			const next = info.next;
+			if (next !== void 0 && next !== null) add(next.args, next.why, next.what);
 			const ahead = info.ahead || 0;
 			const behind = info.behind || 0;
 			const staged = info.stagedFiles || 0;
 			const unstaged = info.unstagedFiles || 0;
 			const untracked = info.untrackedFiles || 0;
-			if (behind > 0) add("pull", behind + " behind " + (info.upstream ?? "upstream"));
-			if (ahead > 0) add("push", ahead + " ahead of " + (info.upstream ?? "upstream"));
-			if (staged > 0) add("commit", staged + " staged");
-			if (unstaged > 0) add("commit", unstaged + " unstaged");
-			if (unstaged === 0 && untracked > 0) add("commit", untracked + " untracked");
+			if (behind > 0 && ahead > 0) {
+				add("sync", ahead + " ahead, " + behind + " behind — diverged", "rebase your commits onto upstream and push (asks before any force)");
+			} else {
+				if (behind > 0) add("pull", behind + " behind " + (info.upstream ?? "upstream"), "update this branch from upstream");
+				if (ahead > 0) add("push", ahead + " ahead of " + (info.upstream ?? "upstream"), "push local commits to the remote");
+			}
+			if (staged > 0) add("commit", staged + " staged", "commit the staged changes");
+			if (unstaged > 0) add("commit", unstaged + " unstaged", "stage and commit the working changes");
+			if (unstaged === 0 && untracked > 0) add("commit", untracked + " untracked", "stage the new files and commit them");
 			const pr = info.pr;
 			if (pr !== void 0 && pr !== null && pr.number !== void 0) {
-				if (pr.state === "failing") add("checks " + pr.number, "checks failing on #" + pr.number);
-				add("pr view " + pr.number, "open pull request #" + pr.number);
+				if (pr.state === "failing") add("checks " + pr.number, "checks failing on #" + pr.number, "watch the CI checks on pull request " + pr.number);
+				add("pr view " + pr.number, "open pull request #" + pr.number, "show pull request " + pr.number + " on GitHub");
 			} else if (ahead === 0 && behind === 0 && info.upstream !== void 0 && staged + unstaged + untracked === 0) {
-				add("pr", "branch is pushed and has no pull request");
-			}
-			const next = info.next;
-			if (next !== void 0 && next !== null && typeof next.command === "string"
-				&& !subs.some((entry) => entry.why === next.why)) {
-				add("next", next.why);
+				add("pr", "branch is pushed and has no pull request", "open a pull request for this branch");
 			}
 			return subs.slice(0, 6);
 		}
@@ -435,9 +436,9 @@ window.__ModuleLoader__.load({
 				"aria-label":
 					(isWorktree ? "git worktree: " : "git: ") +
 					STATUS_LABEL[status] +
-					// an inferred checkout is not where the conversation lives, so the
-					// accessible name says where the fact came from
-					(info.worktreeInferred === true ? " (inferred from an open pull request in this repository)" : ""),
+					// a followed checkout is not where the conversation lives, and the
+					// accessible name says so — the session registered it explicitly
+					(info.worktreeFollowed === true ? " (registered for this session)" : ""),
 				focusable: "false",
 				style: { flex: "none", display: "block", color: META_STYLE.color }
 			};
@@ -584,7 +585,7 @@ window.__ModuleLoader__.load({
 				const checkout = [name === "" ? String(info.branch) : name + " on " + info.branch];
 				// the node half followed this tree because it is the one whose branch
 				// has the open PR — say so, because nothing on the row can
-				if (info.worktreeInferred === true) checkout.push("its branch has the open pull request");
+
 				bits.push("checkout: " + checkout.join(" \u00B7 "));
 			}
 			const pr = formatPrDetail(info.pr);
@@ -622,7 +623,7 @@ window.__ModuleLoader__.load({
 
 		/**
 		 * The `checkout` row: the directory the CONVERSATION itself names, present
-		 * only when the badge is describing an inferred worktree instead. The chip's
+		 * only when the badge is describing a FOLLOWED worktree instead. The chip's
 		 * branch and counts are the tree's in that case, so without this row the
 		 * checkout's own state is nowhere on screen. Branch, then files (or "clean"),
 		 * then sync counts only when they are nonzero — the chip's own rule.
@@ -641,15 +642,13 @@ window.__ModuleLoader__.load({
 		 * The `worktree` row: WHICH linked worktree the badge is describing. The chip
 		 * names only the branch (see the note above formatOperationToken), so the
 		 * card is the one place a tree is identified — the mark's shape can only say
-		 * *that* the checkout is a worktree, never which. An inferred follow also says
-		 * why, because "which tree" and "why this tree" are different questions and
-		 * the second is the one a reader will ask.
+		 * *that* the checkout is a worktree, never which.
 		 */
 		function worktreeDetail(info) {
 			if (info === void 0 || info === null || info.isWorktree !== true) return void 0;
 			const name = typeof info.worktreeName === "string" ? info.worktreeName : "";
 			if (name === "") return void 0;
-			return info.worktreeInferred === true ? name + " (inferred from its open pull request)" : name;
+			return name;
 		}
 
 		const CARD_CONTAINER = {
@@ -658,12 +657,223 @@ window.__ModuleLoader__.load({
 			gap: "4px",
 			fontSize: "12px",
 			lineHeight: "18px",
-			maxWidth: "340px"
+			// Auto-width: the card fits its widest row instead of a guessed
+			// constant, capped at 600px. The Tooltip's maxWidth must stay >= the
+			// cap or IT becomes the clamp.
+			width: "max-content",
+			maxWidth: "600px"
 		};
+		/**
+		 * The ✎n count's own hover body — the changed-file lists and NOTHING
+		 * else: the full card stays on the status mark, and this tooltip answers
+		 * the one question the count poses ("what are these?"). One stacked
+		 * column with sub-headers: UNSTAGED (tracked, edited — valid regardless
+		 * of the collapsed untracked retry) then UNTRACKED. Reads the same lazy
+		 * detail payload the mark's card uses; no tooltip at all when neither
+		 * list has names (the count itself is absent on a clean tree, so an
+		 * empty list is rare — a mid-fetch hover shows it plain until the
+		 * response lands).
+		 */
+		function CountNames({ info }) {
+			const sections = [
+				{
+					label: "staged",
+					names: info?.stagedNames,
+					total: info?.stagedNamesTotal
+				},
+				{
+					label: "unstaged",
+					names: info?.unstagedNames,
+					total: info?.unstagedNamesTotal
+				},
+				{
+					label: "untracked",
+					names: info?.untrackedNames,
+					total: info?.untrackedNamesTotal
+				}
+			].filter((section) => Array.isArray(section.names) && section.names.length > 0);
+			if (sections.length === 0) {
+				return react_jsx_runtime.jsx("span", { style: CARD_CONTAINER, children: "no changed files" });
+			}
+			return react_jsx_runtime.jsxs("div", { style: CARD_CONTAINER, children:
+				sections.map((section) => react_jsx_runtime.jsxs("div", { style: CARD_ROW, children: [
+					react_jsx_runtime.jsx("span", { style: CARD_LABEL, children: section.label }),
+					react_jsx_runtime.jsx("span", {
+						style: { ...CARD_VALUE, display: "flex", flexDirection: "column", gap: "2px" },
+						children: [
+							...section.names.map((name) => react_jsx_runtime.jsx("span", { children: name }, section.label + name)),
+							(typeof section.total === "number" && section.total > section.names.length
+								? "\u2026 and " + (section.total - section.names.length) + " more"
+								: null)
+						]
+					})
+				] }, section.label))
+			});
+		}
+
+		/**
+		 * Compress git's relative age to its shortest honest form: 43 seconds
+		 * ago -> 43s ago, 2 hours ago -> 2h ago, weeks -> w, months -> mo (to
+		 * stay distinct from minutes), years -> y.
+		 */
+		function shortWhen(when) {
+			return String(when)
+				.replace(/(\d+) seconds? ago/u, "$1s ago")
+				.replace(/(\d+) minutes? ago/u, "$1m ago")
+				.replace(/(\d+) hours? ago/u, "$1h ago")
+				.replace(/(\d+) days? ago/u, "$1d ago")
+				.replace(/(\d+) weeks? ago/u, "$1w ago")
+				.replace(/(\d+) months? ago/u, "$1mo ago")
+				.replace(/(\d+) years? ago/u, "$1y ago");
+		}
+
+		/**
+		 * The branch name's own hover body — the branch's LINEAGE, and it ALWAYS
+		 * renders once the lazy detail payload has landed. Rows: upstream, sync
+		 * in words, the branch's last 10 commits (WHAT THIS BRANCH HAS, full
+		 * stop — no base-relative filtering, which empties on every push or
+		 * merge). The pull request has no row here — the chip's own PR token
+		 * already carries number, CI state and the link.
+		 */
+		function BranchLineage({ info }) {
+			const rows = [];
+			const add = (label, value) => {
+				if (value === void 0 || value === null || value === "") return;
+				rows.push(cardRow(label, value));
+			};
+			add("upstream", info?.upstream === void 0 ? "none configured" : info.upstream);
+			const ahead = info?.ahead || 0;
+			const behind = info?.behind || 0;
+			// The sync row speaks ONLY about the upstream it names: with no
+			// upstream configured there are no ahead/behind counts at all (no
+			// `# branch.ab` header), and falling back to 0/0 would claim "in
+			// sync" — a lie the upstream row directly contradicts. Omit it; the
+			// "none configured" row above carries the fact.
+			if (info?.upstream !== void 0) {
+				add("sync", ahead === 0 && behind === 0
+					? "in sync with upstream"
+					: "\u2191" + ahead + " \u2193" + behind);
+			}
+			// The merge-state row, in WORDS (deliberately not arrows — the sync
+			// row above already uses ↑↓ for the push axis, and two arrow pairs
+			// with different references would be read as one). "merge" is its
+			// label because it is the merge axis — the counterpart of "sync",
+			// the push axis — and it stays correct whatever the default branch
+			// is named. A BLOCKED verdict becomes the reason (review required,
+			// checks failing, draft) so a dead-end word names the next action;
+			// CLEAN stays silent — the action row already offers /gh merge.
+			const pr = info?.pr;
+			const mergeParts = [];
+			if (pr !== void 0 && pr !== null && pr.number !== void 0) {
+				if (pr.draft === true) mergeParts.push("blocked: draft");
+				else if (pr.mergeState === "BLOCKED") {
+					mergeParts.push(pr.review === "REVIEW_REQUIRED" ? "blocked: review required"
+						: pr.state === "failing" ? "blocked: checks failing"
+						: "blocked");
+				} else if (pr.state === "failing") mergeParts.push("blocked: checks failing");
+				else if (pr.mergeState !== "CLEAN" && pr.review === "REVIEW_REQUIRED") mergeParts.push("blocked: review required");
+			}
+			if (info?.mainAhead !== void 0 || info?.mainBehind !== void 0) {
+				mergeParts.push((info.mainAhead || 0) + " ahead, " + (info.mainBehind || 0) + " behind main");
+			}
+			if (mergeParts.length > 0) add("merge", mergeParts.join(" \u00B7 "));
+			const commits = info?.branchCommits;
+			if (Array.isArray(commits) && commits.length > 0) {
+				// Full-width block, not the label/value two-column row: commit lines
+				// use the card's whole width, and each line is nowrap with CSS
+				// ellipsis so long subjects clip at the edge instead of pushing the
+				// card out. `when` is compressed the way git log users shorten it:
+				// 43 seconds ago -> 43s ago.
+				rows.push(
+					react_jsx_runtime.jsxs("div", {
+						style: { display: "flex", flexDirection: "column", gap: "2px", minWidth: 0 },
+						children:
+							commits.map((commit) => react_jsx_runtime.jsxs("span", {
+								style: { whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" },
+								children: [
+									// fixed-width monospace hash cell: every description starts
+									// on the same column, so the list reads as a table
+									react_jsx_runtime.jsx("span", {
+										style: {
+											color: "var(--dsw-alias-label-tertiary, #9ea7ad)",
+											fontFamily: "monospace",
+											display: "inline-block",
+											minWidth: "68px",
+											flex: "none"
+										},
+										children: (commit.sign === "+" ? "+" : commit.sign === "\u2212" ? "\u2212" : "") + commit.hash + ":"
+									}),
+									commit.subject + (commit.when === "" ? "" : "  \u00B7 " + shortWhen(commit.when))
+								]
+							}, commit.hash))
+					}, "branch-commits")
+				);
+			}
+			// NO pull-request row: the chip's own PR token (number, CI state, link)
+			// carries it — a second rendering two pixels away is pure duplication.
+			return react_jsx_runtime.jsx("div", { style: CARD_CONTAINER, children: rows });
+		}
+
 		const CARD_ROW = { display: "flex", gap: "8px", alignItems: "baseline" };
 		const CARD_LABEL = { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", flex: "none", minWidth: "62px" };
 		const CARD_VALUE = { minWidth: 0, overflowWrap: "anywhere" };
 
+		// The host's plugin-card chrome, reproduced inline: its CSS module is not
+		// exported to plugins, so these values mirror PluginCard.module.css so our
+		// card sits in the same list as its siblings.
+		const CARD_BASE = {
+			border: ".5px solid var(--dsw-alias-border-l4, #e4e8eb)",
+			borderRadius: "16px",
+			listStyle: "none",
+			transition: "border-color .16s, background .16s"
+		};
+		const CARD_CLOSED = { ...CARD_BASE, background: "var(--dsw-alias-bg-layer-3, #ffffff)" };
+		const CARD_OPEN = {
+			...CARD_BASE,
+			background: "var(--dsw-alias-bg-layer-2, #f7f8f9)",
+			borderColor: "var(--dsw-alias-label-dimmed, #b8bfc4)"
+		};
+		const CARD_HEADER = {
+			appearance: "none",
+			width: "100%",
+			font: "inherit",
+			color: "inherit",
+			textAlign: "left",
+			cursor: "pointer",
+			background: "none",
+			border: 0,
+			borderRadius: "12px",
+			display: "flex",
+			alignItems: "center",
+			gap: "12px",
+			padding: "14px 16px"
+		};
+		const CARD_NAME = { color: "var(--dsw-alias-label-primary, #1f2328)", fontSize: "15px", fontWeight: "600", lineHeight: "1.4" };
+		const CARD_DESCRIPTION = { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", fontSize: "13px", lineHeight: "1.5" };
+
+		const CARD_BUTTON = {
+			cursor: "pointer",
+			color: "inherit",
+			background: "none",
+			border: "1px solid var(--dsw-alias-border-secondary, #d0d7de)",
+			borderRadius: "4px",
+			fontSize: "11px",
+			lineHeight: "18px",
+			padding: "0 6px",
+			flex: "none"
+		};
+
+		/** One label/value row — the shape every hover body shares. */
+		function cardRow(label, value) {
+			return react_jsx_runtime.jsxs("div", {
+				style: CARD_ROW,
+				children: [
+					react_jsx_runtime.jsx("span", { style: CARD_LABEL, children: label }),
+					react_jsx_runtime.jsx("span", { style: CARD_VALUE, children: value })
+				]
+			}, label);
+		}
+
 
 		/**
 		 * Hover card body for the input chip — INPUT CHIP ONLY. Pure presentation
@@ -678,15 +888,7 @@ window.__ModuleLoader__.load({
 			const rows = [];
 			const add = (label, value) => {
 				if (value === void 0 || value === null || value === "") return;
-				rows.push(
-					react_jsx_runtime.jsxs("div", {
-						style: CARD_ROW,
-						children: [
-							react_jsx_runtime.jsx("span", { style: CARD_LABEL, children: label }),
-							react_jsx_runtime.jsx("span", { style: CARD_VALUE, children: value })
-						]
-					}, label)
-				);
+				rows.push(cardRow(label, value));
 			};
 			// The "action" row — the top line, in the card's ordinary row layout:
 			// the gh skill invocation the checkout justifies, derived from the same
@@ -695,45 +897,24 @@ window.__ModuleLoader__.load({
 			// this row is the read-only pointer to it.
 			const topAction = ghSkillActions(data)[0];
 			if (topAction !== void 0) {
-				add("action:", "/gh " + topAction.args);
-			}
-			add("branch", info.branch);
-			add("upstream", info.upstream === void 0 ? "none configured" : info.upstream);
-			if (info.ahead !== void 0 || info.behind !== void 0) {
-				add("sync", "\u2191" + (info.ahead || 0) + " \u2193" + (info.behind || 0));
+				// git-comment convention: the invocation, two spaces, then "# "
+				// plus what it does
+				add("action", "/gh " + topAction.args + "  # " + topAction.what);
 			}
+			// The branch lineage rows (branch, upstream, sync, pull request) moved
+			// to the branch NAME's hover — the card is the checkout's verdict, not
+			// the branch's CV. The branch name is also the chip's own text, so a
+			// card row for it was pure repetition.
 			add("files", formatFileBreakdown(info));
 			add("operation", info.operation === void 0 || info.operation === null ? void 0 : String(info.operation));
-			add("pull request", formatPrDetail(data.pr));
 			// WHICH checkout the badge describes, when it is a worktree. The chip shows
 			// the branch alone, so this row is the only place the tree is named.
 			add("worktree", worktreeDetail(data));
 			// The conversation's OWN directory, present only when the badge is
-			// describing an inferred worktree — the chip's branch and counts are the
+			// describing a followed worktree — the chip's branch and counts are the
 			// tree's in that case, so this is where the checkout's own state stays
 			// visible. Absent until the `detail=1` response lands, like commits/stash.
-			if (data.worktreeInferred === true) add("checkout", formatCheckoutDetail(data.checkout));
-			if (Array.isArray(data.lastCommits) && data.lastCommits.length > 0) {
-				rows.push(
-					react_jsx_runtime.jsxs("div", {
-						style: CARD_ROW,
-						children: [
-							react_jsx_runtime.jsx("span", { style: CARD_LABEL, children: "commits" }),
-							react_jsx_runtime.jsx("span", {
-								style: { ...CARD_VALUE, display: "flex", flexDirection: "column", gap: "2px" },
-								children: data.lastCommits.map((commit) =>
-									react_jsx_runtime.jsxs("span", {
-										children: [
-											react_jsx_runtime.jsx("span", { style: CARD_LABEL, children: commit.hash }),
-											" " + commit.subject + (commit.when === "" ? "" : " \u00B7 " + commit.when)
-										]
-									}, commit.hash)
-								)
-							})
-						]
-					}, "commits")
-				);
-			}
+			if (data.worktreeFollowed === true) add("checkout", formatCheckoutDetail(data.checkout));
 			add("stash", data.stashCount === void 0 ? void 0 : data.stashCount + " stashed");
 			return react_jsx_runtime.jsx("div", { style: CARD_CONTAINER, children: rows });
 		}
@@ -786,6 +967,11 @@ window.__ModuleLoader__.load({
 			// re-render that no fetch will schedule, so the × bumps a counter here.
 			const [, bumpNotice] = react.useState(0);
 			const seamNotice = seamHint !== null && !seamNoticeDismissed ? seamHint : null;
+			// the branch link's hover underline — the PR token's pattern: the
+			// affordance appears on hover/focus, never at rest. Its OWN state, not
+			// the PR token's linkHover: two links sharing one flag would
+			// underline both when either is hovered.
+			const [branchLinkHover, setBranchLinkHover] = react.useState(false);
 			const detail = useGitStatus(target, { pr: true, detail: true, enabled: hovered });
 			if (info === void 0 || info.git !== true) return null;
 
@@ -803,7 +989,8 @@ window.__ModuleLoader__.load({
 				if (Tooltip === void 0) return mark;
 				return react_jsx_runtime.jsx(Tooltip, {
 					side: "top",
-					maxWidth: 360,
+					// matches the body cap: the tooltip must never be the clamp
+				maxWidth: 600,
 					// a function label keeps the card's element tree out of every render
 					// until the tooltip actually opens
 					label: () => react_jsx_runtime.jsx(HoverCard, { info, detail }),
@@ -813,7 +1000,74 @@ window.__ModuleLoader__.load({
 			// the mark is an element now rather than a leading glyph in the string, so
 			// the SAME StatusMark the sidebar row draws carries the status here too;
 			// the container's 4px gap supplies the space the emoji's own did
-			const text = info.branch + formatOperationToken(info) + formatGitSuffix(info);
+			// The branch NAME is its own hover surface: the commits this branch adds
+			// (BranchCommitsList), sharing the mark's lazy detail fetch. The rest of
+			// the leading text (operation token) and the count keep their own
+			// surfaces. Degrades to plain text without the Tooltip primitive or
+			// when the branch adds nothing beyond upstream.
+			const branchHover = (() => {
+				// The branch name links to the compare view (base...branch) — the web
+				// page of exactly what the lineage tooltip lists. Vouched http(s)
+				// only (the node half rebuilt the URL from parsed parts); new tab,
+				// never navigating the conversation away.
+				const isLink = typeof detail?.compareUrl === "string" && detail.compareUrl.startsWith("https://");
+				const branch = isLink
+					? react_jsx_runtime.jsx("a", {
+						href: detail.compareUrl,
+						target: "_blank",
+						rel: "noopener noreferrer",
+						"aria-label": "Compare " + info.branch + " with main on GitHub",
+						onPointerEnter: () => { setHovered(true); setBranchLinkHover(true); },
+						onPointerLeave: () => setBranchLinkHover(false),
+						onFocus: () => { setHovered(true); setBranchLinkHover(true); },
+						onBlur: () => setBranchLinkHover(false),
+						style: {
+							color: "inherit",
+							textDecoration: branchLinkHover ? "underline" : "none",
+							cursor: "pointer"
+						},
+						children: info.branch
+					})
+					: react_jsx_runtime.jsx("span", {
+						onPointerEnter: () => setHovered(true),
+						style: { cursor: "default" },
+						children: info.branch
+					});
+				if (Tooltip === void 0 || detail === void 0 || detail === null) {
+					// mid-fetch the branch shows plain; the lineage tooltip is
+					// unconditional once the payload lands
+					return branch;
+				}
+				return react_jsx_runtime.jsx(Tooltip, {
+					side: "top",
+					maxWidth: 480,
+					label: () => react_jsx_runtime.jsx(BranchLineage, { info: detail }),
+					children: branch
+				});
+			})();
+			const text = formatOperationToken(info);
+			// The ✎n count is its OWN hover surface: a names-only tooltip (see
+			// UntrackedList). It shares the mark's lazy detail fetch — resting on
+			// either triggers it once — and degrades to a plain count on a shell
+			// without the Tooltip primitive.
+			const countHover = (() => {
+				const count = react_jsx_runtime.jsx("span", {
+					onPointerEnter: () => setHovered(true),
+					style: { cursor: "default" },
+					children: formatGitSuffix(info)
+				});
+				const hasNames = (Array.isArray(detail?.untrackedNames) && detail.untrackedNames.length > 0)
+					|| (Array.isArray(detail?.unstagedNames) && detail.unstagedNames.length > 0);
+				if (Tooltip === void 0 || !hasNames) {
+					return count;
+				}
+				return react_jsx_runtime.jsx(Tooltip, {
+					side: "top",
+					maxWidth: 480,
+					label: () => react_jsx_runtime.jsx(CountNames, { info: detail }),
+					children: count
+				});
+			})();
 			const prToken = formatPrToken(info);
 			const prUrl = prLinkUrl(info);
 			const chip = react_jsx_runtime.jsxs("span", {
@@ -846,7 +1100,9 @@ window.__ModuleLoader__.load({
 					// stays on the whole chip — it is about the badge, not the mark.
 					hoverableMark,
 
+						branchHover,
 						react_jsx_runtime.jsx("span", { key: "text", children: text }),
+					countHover,
 					prToken === ""
 						? null
 						: prUrl === void 0
@@ -959,6 +1215,162 @@ window.__ModuleLoader__.load({
 		// `workspaces` is no longer required: both surfaces target an id and the
 		// node half resolves the workspace, so the client never needs a service
 		// lookup. Fewer declared services also means fewer ways to fail to load.
+		/** The built-in ranking order — what "Reset to default" restores. */
+		const DEFAULT_ORDER = ["operation", "unmerged", "sync", "publish", "merge", "commit", "checks"];
+
+		/**
+		 * Move one category within the ranking order — the card's only reorder
+		 * primitive, pure so the suite can drive it without a browser. Out-of-range
+		 * moves are no-ops (the buttons disable at the ends, this is the belt).
+		 */
+		function moveCategory(order, index, delta) {
+			const next = [...order];
+			const to = index + delta;
+			if (index < 0 || index >= next.length || to < 0 || to >= next.length) return next;
+			const [moved] = next.splice(index, 1);
+			next.splice(to, 0, moved);
+			return next;
+		}
+
+		/** Human labels for the ranking categories, in default order. */
+		const CATEGORY_LABELS = {
+			operation: ["operation", "resume a paused merge/rebase"],
+			unmerged: ["unmerged", "resolve conflict markers"],
+			sync: ["sync", "pull, or rebase + confirmed force-push"],
+			publish: ["publish", "push local commits"],
+			merge: ["merge", "a merge-ready pull request"],
+			commit: ["commit", "stage and commit working changes"],
+			checks: ["checks", "watch failing CI"]
+		};
+
+		/**
+		 * The settings card's body — Settings → Plugins → Git Badge. Reads the
+		 * bound settings scope through the store the registration injects and
+		 * writes back one field ("order") via the scope's mutate path. Styled like
+		 * this plugin's other surfaces rather than the host's card primitives,
+		 * which are not exported to plugins.
+		 */
+		function GitBadgeOrderCard(props) {
+			const state = props.useGitBadgeOrderCard((snapshot) => snapshot);
+			const t = props.t;
+			// Local expander state, mirroring the host's plugin cards: collapsed by
+			// default, and auto-collapsed again once a save settles clean (so the
+			// card confirms itself the way its siblings do).
+			const [open, setOpen] = react.useState(false);
+			const saveStarted = react.useRef(false);
+			react.useEffect(() => {
+				if (state.saving) {
+					saveStarted.current = true;
+					return;
+				}
+				if (!saveStarted.current) return;
+				saveStarted.current = false;
+				if (!state.dirty && !state.failed) setOpen(false);
+			}, [state.dirty, state.failed, state.saving]);
+			if (!state.available) return null;
+			const rows = state.order.map((cat, index) => {
+				const [label, hint] = CATEGORY_LABELS[cat] ?? [cat, ""];
+				return react_jsx_runtime.jsxs("div", {
+					style: { display: "flex", alignItems: "center", gap: "8px", padding: "2px 0" },
+					children: [
+						react_jsx_runtime.jsx("span", {
+							style: { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", fontFamily: "monospace", minWidth: "16px", textAlign: "right" },
+							children: String(index + 1)
+						}),
+						react_jsx_runtime.jsx("span", { style: { minWidth: "84px" }, children: label }),
+						react_jsx_runtime.jsx("span", { style: { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", flex: "1", minWidth: 0 }, children: hint }),
+						react_jsx_runtime.jsx("button", {
+							type: "button",
+							"aria-label": t("moveUp") + " " + label,
+							disabled: state.saving || !state.writable || index === 0,
+							onClick: () => props.move(index, -1),
+							style: CARD_BUTTON,
+							children: "\u2191"
+						}),
+						react_jsx_runtime.jsx("button", {
+							type: "button",
+							"aria-label": t("moveDown") + " " + label,
+							disabled: state.saving || !state.writable || index === state.order.length - 1,
+							onClick: () => props.move(index, 1),
+							style: CARD_BUTTON,
+							children: "\u2193"
+						})
+					]
+				}, cat);
+			});
+			// The card chrome matches the host's own plugin cards (its CSS module is
+			// not exported to plugins, so the values are reproduced inline): an <li>
+			// with the bordered card, a header button that expands, and a body that
+			// carries the list and the footer actions.
+			return react_jsx_runtime.jsxs("li", {
+				style: open ? CARD_OPEN : CARD_CLOSED,
+				children: [
+					react_jsx_runtime.jsxs("button", {
+						type: "button",
+						"aria-expanded": open,
+						"aria-label": t(open ? "collapse" : "expand") + ": " + t("title"),
+						onClick: () => setOpen(!open),
+						style: CARD_HEADER,
+						children: [
+							react_jsx_runtime.jsxs("span", {
+								style: { display: "flex", flexDirection: "column", flex: "1", gap: "4px", minWidth: 0 },
+								children: [
+									react_jsx_runtime.jsx("span", { style: CARD_NAME, children: t("title") }),
+									react_jsx_runtime.jsx("span", { style: CARD_DESCRIPTION, children: t("description") })
+								]
+							}),
+							react_jsx_runtime.jsx("span", {
+								"aria-hidden": true,
+								style: open
+									? { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", flex: "none", transform: "rotate(180deg)", transition: "transform .16s" }
+									: { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", flex: "none", transition: "transform .16s" },
+								children: (primitives !== null && primitives.IconChevronDownOutline14 !== void 0
+									? react_jsx_runtime.jsx(primitives.IconChevronDownOutline14, {})
+									: "\u25BE")
+							})
+						]
+					}),
+					open
+						? react_jsx_runtime.jsxs("div", {
+							style: { borderTop: ".5px solid var(--dsw-alias-border-l2, #e4e8eb)", margin: "0 16px", paddingBottom: "8px" },
+							children: [
+								react_jsx_runtime.jsx("div", { style: { padding: "10px 0 6px" }, children: t("intro") }),
+								react_jsx_runtime.jsx("div", { style: { display: "flex", flexDirection: "column" }, children: rows }),
+								react_jsx_runtime.jsxs("div", {
+									style: { display: "flex", gap: "8px", alignItems: "center", justifyContent: "flex-end", padding: "12px 0 4px" },
+									children: [
+										state.failed ? react_jsx_runtime.jsx("span", { style: { color: "var(--dsw-alias-label-error, #d13438)", flex: "1", fontSize: "12px" }, children: t("failed") }) : null,
+										state.writable ? null : react_jsx_runtime.jsx("span", { style: { color: "var(--dsw-alias-label-tertiary, #9ea7ad)", flex: "1", fontSize: "12px" }, children: t("readOnly") }),
+										react_jsx_runtime.jsx("button", {
+											type: "button",
+											disabled: !state.dirty || state.saving,
+											onClick: props.discard,
+											style: CARD_BUTTON,
+											children: t("discard")
+										}),
+										react_jsx_runtime.jsx("button", {
+											type: "button",
+											disabled: !state.dirty || state.saving || !state.writable,
+											onClick: props.save,
+											style: CARD_BUTTON,
+											children: state.saving ? t("saving") : t("save")
+										}),
+										react_jsx_runtime.jsx("button", {
+											type: "button",
+											disabled: state.saving || !state.writable,
+											onClick: props.reset,
+											style: CARD_BUTTON,
+											children: t("reset")
+										})
+									]
+								})
+							]
+						})
+						: null
+				]
+			});
+		}
+
 		const inject = ["slots", "inputTriggers"];
 
 		/**
@@ -1054,6 +1466,126 @@ window.__ModuleLoader__.load({
 				});
 			}
 
+			// The settings card (Settings → Plugins → Git Badge): the order lives
+			// in this plugin's `git-badge` settings namespace, which the node half
+			// registers; this half renders the card that edits it through the bound
+			// scope — reads from the scope snapshot, writes one field via mutate.
+			// Guarded: a host without settingsScope loses the card, never the
+			// badges.
+			if (typeof ctx.inject === "function") {
+				try {
+					ctx.inject(["settingsScope", "slots", "locale"], (scopeCtx) => {
+						const NS = "dsh-git-badge";
+						scopeCtx.effect(() => scopeCtx.locale.register(NS, {
+							en: {
+								title: "Git Badge",
+								description: "Which action class the badge suggests first.",
+								expand: "Expand",
+								collapse: "Collapse",
+								intro: "The badge suggests one next action; this is the order it considers the classes in.",
+								save: "Save",
+								discard: "Discard",
+								reset: "Reset to default",
+								saving: "Saving\u2026",
+								failed: "save failed \u2014 try again",
+								readOnly: "read-only on this host",
+								moveUp: "Move up",
+								moveDown: "Move down"
+							}
+						}), "dsh-git-badge: settings locale");
+						const scope = scopeCtx.settingsScope.bind({ namespace: "git-badge" });
+						// draft === null means "mirror the stored order"; any reorder
+						// stages a copy, and only a confirmed write clears it — a
+						// rejected write leaves the draft for a retry rather than
+						// pretending it saved.
+						let draft = null;
+						let saving = false;
+						let failed = false;
+						const subscribers = new Set();
+						let snapshot = null;
+						const storedOrder = () => {
+							const view = scope.getSnapshot();
+							return Array.isArray(view?.value?.order) ? view.value.order : DEFAULT_ORDER;
+						};
+						const build = () => {
+							const view = scope.getSnapshot();
+							const stored = storedOrder();
+							const order = draft ?? stored;
+							return {
+								available: view?.status === "ready",
+								writable: view?.writable === true,
+								order,
+								dirty: draft !== null && draft.join() !== stored.join(),
+								saving,
+								failed
+							};
+						};
+						const publish = () => {
+							snapshot = build();
+							for (const listener of subscribers) listener();
+						};
+						scopeCtx.effect(() => {
+							const off = scope.subscribe(publish);
+							return () => {
+								if (typeof off === "function") off();
+							};
+						}, "dsh-git-badge: settings scope");
+						publish();
+						const store = {
+							getSnapshot: () => snapshot ?? build(),
+							subscribe: (listener) => {
+								subscribers.add(listener);
+								return () => subscribers.delete(listener);
+							}
+						};
+						const save = async () => {
+							if (draft === null || saving) return;
+							const wanted = [...draft];
+							saving = true;
+							failed = false;
+							publish();
+							try {
+								await scope.mutate([{ op: "set", path: ["order"], value: wanted }]);
+							} catch (error) {
+								console.error("[dsh-git-badge] order save failed:", error);
+							}
+							saving = false;
+							if (storedOrder().join() === wanted.join()) draft = null;
+							else failed = true;
+							publish();
+						};
+						scopeCtx.slots.inject("settings.plugin.item", function* () {
+							yield scopeCtx.slots.register({
+								name: "settings.plugin.item",
+								key: "git-badge",
+								locale: NS,
+								inject: () => ({
+									hooks: { gitBadgeOrderCard: store },
+									move: (index, delta) => {
+										draft = moveCategory(draft ?? [...storedOrder()], index, delta);
+										failed = false;
+										publish();
+									},
+									save: () => void save(),
+									discard: () => {
+										draft = null;
+										failed = false;
+										publish();
+									},
+									reset: () => {
+										draft = [...DEFAULT_ORDER];
+										failed = false;
+										publish();
+									}
+								})
+							}, GitBadgeOrderCard);
+						});
+					});
+				} catch (error) {
+					console.error("[dsh-git-badge] settings card unavailable:", error);
+				}
+			}
+
 			// inject() re-evaluates when a seam's declaration appears, so boot
 			// order relative to the workspace browser does not matter. On an
 			// unpatched install the seam is never declared, so this callback never
@@ -1135,7 +1667,7 @@ window.__ModuleLoader__.load({
 		// Additive; the host reads apply/inject and ignores the rest. The suite
 		// drives these to assert the REQUEST contract — which surface asks for the
 		// expensive extras — without a browser, a fetch or a network.
-		exports.__internals = { targetQuery, formatPrToken, formatFileBreakdown, formatPrDetail, formatCheckoutDetail, worktreeDetail, actionToken, ghSkillActions };
+		exports.__internals = { targetQuery, formatPrToken, formatFileBreakdown, formatPrDetail, formatCheckoutDetail, worktreeDetail, actionToken, ghSkillActions, moveCategory };
 		return module.exports;
 	}
 });