@bud.sh/app 0.3.0 → 0.4.0

package/dist/server/assets/{canvas-D6tIkONI.js → canvas-Dn4RYoU2.js}

@@ -1,8 +1,8 @@
 import { kn as Icon } from "./events-6z5v7Uca.js";
-import { Bt as Button, Cn as Text, H as captureCanvasPoint, Rt as Loader, Sn as writePreference, V as CanvasWorkspace, W as BranchSidebar, fn as ToolbarSeparator, gn as IconButton, hn as Select, l as projectStore, pn as WorkspaceLayout, t as commentsUnavailable, ut as conversationHref, vn as Tooltip, xn as readPreference } from "./comment-data-BuArfgcc.js";
-import { n as createProjectComments, r as loadComments, t as defineScreen } from "./screen-DMUB9a-K.js";
-import { i as pictureKey, n as createProjectPreviews, t as createProjectBranches } from "./project-branches-B7rtrvMl.js";
-import { t as ProjectThreadLinks } from "./project-thread-links-ue_ad9IX.js";
+import { Bt as Button, Dn as Text, H as captureCanvasPoint, Rt as Loader, Sn as writePreference, Tn as t, V as CanvasWorkspace, W as BranchSidebar, fn as ToolbarSeparator, gn as IconButton, hn as Select, l as projectStore, pn as WorkspaceLayout, t as commentsUnavailable, ut as conversationHref, vn as Tooltip, xn as readPreference } from "./comment-data-B0OLHBGp.js";
+import { n as createProjectComments, r as loadComments, t as defineScreen } from "./screen-BtcJmZwj.js";
+import { i as pictureKey, n as createProjectPreviews, t as createProjectBranches } from "./project-branches-GtQYyOH5.js";
+import { t as ProjectThreadLinks } from "./project-thread-links-Nfz9NIny.js";
 import { on, ref } from "remix/component";
 import { Fragment, jsx, jsxs } from "remix/component/jsx-runtime";
 //#region app/client/preview-image.tsx
@@ -160,7 +160,7 @@ function PreviewImage(handle) {
 			let { thumbnail, slices } = drawn(picture);
 			return /* @__PURE__ */ jsxs("div", {
 				role: "img",
-				"aria-label": `${route.title} preview`,
+				"aria-label": t("app.client.previewImage.preview", { title: route.title }),
 				"data-detail": !view.visible ? "hidden" : slices.length ? "slices" : thumbnail ? "thumbnail" : "pending",
 				class: `relative select-none overflow-hidden ${mode === "comment" ? "cursor-crosshair" : ""}`,
 				style: { height },
@@ -210,11 +210,11 @@ function PreviewImage(handle) {
 					size: 24,
 					class: "text-muted"
 				}),
-				/* @__PURE__ */ jsxs(Text, {
+				/* @__PURE__ */ jsx(Text, {
 					variant: "title",
 					weight: "semibold",
 					class: "text-ink",
-					children: [route.title, " couldn't be captured"]
+					children: t("app.client.previewImage.captureFailed", { title: route.title })
 				}),
 				failure ? /* @__PURE__ */ jsx(Text, {
 					variant: "ui",
@@ -229,7 +229,7 @@ function PreviewImage(handle) {
 						mix: [stopPan, on("click", () => void previews.refresh(page))],
 						children: /* @__PURE__ */ jsx(Text, {
 							variant: "ui",
-							children: "Try again"
+							children: t("app.client.previewImage.tryAgain")
 						})
 					}), /* @__PURE__ */ jsx("a", {
 						href: pageUrl,
@@ -239,7 +239,7 @@ function PreviewImage(handle) {
 						mix: stopPan,
 						children: /* @__PURE__ */ jsx(Text, {
 							variant: "ui",
-							children: "Open page"
+							children: t("app.client.previewImage.openPage")
 						})
 					})]
 				})
@@ -247,7 +247,7 @@ function PreviewImage(handle) {
 		});
 		return /* @__PURE__ */ jsx("div", {
 			class: "absolute inset-0 flex items-center justify-center",
-			children: /* @__PURE__ */ jsx(Loader, { label: `Capturing ${route.title}…` })
+			children: /* @__PURE__ */ jsx(Loader, { label: t("app.client.previewImage.capturing", { title: route.title }) })
 		});
 	};
 }
@@ -280,7 +280,7 @@ function PreviewRefresh(handle) {
 			})
 		}) : null, /* @__PURE__ */ jsx(IconButton, {
 			icon: "sync",
-			label: `Refresh ${route.title}`,
+			label: t("app.client.previewImage.refresh", { title: route.title }),
 			tooltip: true,
 			size: "small",
 			iconSize: 13,
@@ -389,7 +389,7 @@ function compareProjectPictures(options) {
 			let result = await compare(route.page, route.size).catch((cause) => ({
 				state: "failed",
 				regions: [],
-				error: cause instanceof Error ? cause.message : "The pictures could not be compared."
+				error: cause instanceof Error ? cause.message : t("app.client.projectDifferences.comparisonFailed")
 			}));
 			if (signal.aborted) return;
 			states.set(route.id, result);
@@ -429,11 +429,9 @@ function differenceSlots(regions) {
 		height: Math.max(1, top - gap)
 	};
 }
-var kinds = {
-	changed: "Changed",
-	added: "Added",
-	removed: "Removed"
-};
+function kindLabel(kind) {
+	return kind === "changed" ? t("app.client.differenceView.changed") : kind === "added" ? t("app.client.differenceView.added") : t("app.client.differenceView.removed");
+}
 function crops(signal) {
 	let urls = /* @__PURE__ */ new Map();
 	signal.addEventListener("abort", () => {
@@ -468,7 +466,10 @@ function DifferenceArtboard(handle) {
 		let visible = viewport?.get(route.id)?.visible ?? true;
 		return /* @__PURE__ */ jsx("div", {
 			role: "img",
-			"aria-label": `${route.title}, ${label}`,
+			"aria-label": t("app.client.differenceView.artboardLabel", {
+				title: route.title,
+				label
+			}),
 			"data-difference": side,
 			"data-changes": regions.length,
 			class: "relative select-none bg-[var(--bud-main)]",
@@ -491,11 +492,11 @@ function DifferenceArtboard(handle) {
 						children: [/* @__PURE__ */ jsx(Text, {
 							variant: "ui",
 							weight: "medium",
-							children: `Change ${index + 1}`
+							children: t("app.client.differenceView.changeNumber", { count: index + 1 })
 						}), /* @__PURE__ */ jsx(Text, {
 							variant: "ui",
 							tone: "muted",
-							children: kinds[region.kind]
+							children: kindLabel(region.kind)
 						})]
 					}), crop && span.height > 0 ? /* @__PURE__ */ jsxs("div", {
 						class: "relative overflow-hidden",
@@ -518,7 +519,7 @@ function DifferenceArtboard(handle) {
 						children: /* @__PURE__ */ jsx(Text, {
 							variant: "ui",
 							tone: "muted",
-							children: `Not in ${label}`
+							children: t("app.client.differenceView.notIn", { label })
 						})
 					})]
 				}, index);
@@ -552,7 +553,10 @@ function DifferenceSlideshow(handle) {
 				}) }), crop && slide.region[which].height > 0 ? /* @__PURE__ */ jsxs("div", {
 					class: "relative",
 					children: [/* @__PURE__ */ jsx("img", {
-						alt: `${slide.route.title}, ${label}`,
+						alt: t("app.client.differenceView.artboardLabel", {
+							title: slide.route.title,
+							label
+						}),
 						src: url(crop),
 						class: "block w-full rounded-lg ring-1 ring-line"
 					}), slide.region.kind === "changed" ? /* @__PURE__ */ jsx("div", {
@@ -568,14 +572,14 @@ function DifferenceSlideshow(handle) {
 					children: /* @__PURE__ */ jsx(Text, {
 						variant: "ui",
 						tone: "muted",
-						children: `Not in ${label}`
+						children: t("app.client.differenceView.notIn", { label })
 					})
 				})]
 			});
 		};
 		return /* @__PURE__ */ jsxs("section", {
 			role: "dialog",
-			"aria-label": "Differences slideshow",
+			"aria-label": t("app.client.differenceView.slideshowLabel"),
 			class: "bud-surface absolute inset-0 z-40 flex flex-col bg-[var(--bud-main)]",
 			mix: ref((node, signal) => {
 				node.focus();
@@ -597,33 +601,39 @@ function DifferenceSlideshow(handle) {
 							variant: "ui",
 							weight: "medium",
 							class: "truncate",
-							children: slide?.route.title ?? "No differences"
+							children: slide?.route.title ?? t("app.client.differenceView.noDifferences")
 						}), slide ? /* @__PURE__ */ jsx(Text, {
 							variant: "ui",
 							tone: "muted",
 							class: "shrink-0 tabular-nums",
 							role: "status",
-							children: `${kinds[slide.region.kind]} · change ${slide.index + 1} of ${slide.count} · ${index + 1} / ${slides.length}`
+							children: t("app.client.differenceView.slideStatus", {
+								kind: kindLabel(slide.region.kind),
+								change: slide.index + 1,
+								count: slide.count,
+								index: index + 1,
+								total: slides.length
+							})
 						}) : null]
 					}),
 					/* @__PURE__ */ jsx(IconButton, {
 						tooltip: true,
 						icon: "chevron-left",
-						label: "Previous change",
+						label: t("app.client.differenceView.previousChange"),
 						disabled: slides.length < 2,
 						mix: on("click", () => step(-1))
 					}),
 					/* @__PURE__ */ jsx(IconButton, {
 						tooltip: true,
 						icon: "chevron-right",
-						label: "Next change",
+						label: t("app.client.differenceView.nextChange"),
 						disabled: slides.length < 2,
 						mix: on("click", () => step(1))
 					}),
 					/* @__PURE__ */ jsx(IconButton, {
 						tooltip: true,
 						icon: "close",
-						label: "Close slideshow",
+						label: t("app.client.differenceView.closeSlideshow"),
 						shortcut: "escape",
 						mix: on("click", () => handle.props.onClose())
 					})
@@ -737,7 +747,7 @@ function ProjectCanvas(handle) {
 	function others() {
 		let sets = project.workingTree ? [{
 			value: "",
-			label: "Working tree"
+			label: t("app.client.projectCanvas.workingTree")
 		}] : [];
 		for (let branch of branches.list.branches) if (branch.active && branch.captured) sets.push({
 			value: branch.name,
@@ -746,7 +756,7 @@ function ProjectCanvas(handle) {
 		return sets.filter((set) => set.value !== (selected ?? ""));
 	}
 	function label(set) {
-		return set ? set : "Working tree";
+		return set ? set : t("app.client.projectCanvas.workingTree");
 	}
 	function startComparing() {
 		let sets = others();
@@ -812,7 +822,7 @@ function ProjectCanvas(handle) {
 				comments.loadThread(id);
 			});
 		}
-		if (!branches.loaded && !branches.error) return /* @__PURE__ */ jsx(Loader, { label: "Loading branches…" });
+		if (!branches.loaded && !branches.error) return /* @__PURE__ */ jsx(Loader, { label: t("app.client.projectCanvas.loadingBranches") });
 		let projectKey = `${project.id}:${project.targetOrigin}:${project.routes.map((route) => route.path).join("|")}`;
 		let snapshot = {
 			...comments.snapshot,
@@ -859,8 +869,23 @@ function ProjectCanvas(handle) {
 		if (differences) {
 			let { compared: done, total } = differences.progress;
 			let missing = artboards.filter(({ artboard }) => differences.get(artboard.id).state === "missing").length;
-			status = !differences.done ? `Comparing with ${beforeLabel}… ${done} of ${total} pages` : changed.length ? `${changed.length} of ${total} pages differ from ${beforeLabel}` : `No differences from ${beforeLabel}`;
-			if (differences.done && missing) status += ` · ${missing} without pictures on both sides`;
+			status = !differences.done ? t("app.client.projectCanvas.comparingPages", {
+				name: beforeLabel,
+				done,
+				count: total
+			}) : changed.length ? missing ? t("app.client.projectCanvas.differentPagesWithMissing", {
+				changed: changed.length,
+				count: total,
+				name: beforeLabel,
+				missing
+			}) : t("app.client.projectCanvas.differentPages", {
+				changed: changed.length,
+				count: total,
+				name: beforeLabel
+			}) : missing ? t("app.client.projectCanvas.noDifferencesWithMissing", {
+				name: beforeLabel,
+				count: missing
+			}) : t("app.client.projectCanvas.noDifferences", { name: beforeLabel });
 		}
 		let sets = others();
 		let icon = (size) => size.mobile || size.width < 600 ? "mobile" : size.width < 1100 ? "tablet" : "desktop";
@@ -869,14 +894,17 @@ function ProjectCanvas(handle) {
 				sizes.map((size) => /* @__PURE__ */ jsx(IconButton, {
 					tooltip: true,
 					icon: icon(size),
-					label: `Show ${size.name} (${size.width})`,
+					label: t("app.client.projectCanvas.showViewport", {
+						name: size.name,
+						width: size.width
+					}),
 					active: viewport === size.id,
 					mix: on("click", () => show(size.id))
 				})),
 				/* @__PURE__ */ jsx(IconButton, {
 					tooltip: true,
 					icon: "columns",
-					label: "Show every viewport side by side",
+					label: t("app.client.projectCanvas.showEveryViewport"),
 					active: viewport === "all",
 					mix: on("click", () => show("all"))
 				}),
@@ -885,13 +913,13 @@ function ProjectCanvas(handle) {
 			/* @__PURE__ */ jsx(IconButton, {
 				tooltip: true,
 				icon: "compare",
-				label: differences ? "Stop comparing" : "Show differences with another branch",
+				label: differences ? t("app.client.projectCanvas.stopComparing") : t("app.client.projectCanvas.showDifferences"),
 				active: Boolean(differences),
 				disabled: !differences && !sets.length,
 				mix: on("click", () => differences ? stopComparing() : startComparing())
 			}),
 			differences ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Select, {
-				label: "Compare with",
+				label: t("app.client.projectCanvas.compareWith"),
 				value: comparing ?? "",
 				options: sets,
 				class: "max-w-48",
@@ -904,7 +932,7 @@ function ProjectCanvas(handle) {
 			}), /* @__PURE__ */ jsx(IconButton, {
 				tooltip: true,
 				icon: "play",
-				label: "Step through the differences",
+				label: t("app.client.projectCanvas.stepThroughDifferences"),
 				disabled: !slides.length,
 				mix: on("click", () => {
 					slide = 0;
@@ -914,8 +942,8 @@ function ProjectCanvas(handle) {
 		] });
 		return /* @__PURE__ */ jsx(WorkspaceLayout, {
 			class: "h-full min-h-0",
-			sidebarLabel: "Branches",
-			mainLabel: "Canvas",
+			sidebarLabel: t("app.client.projectCanvas.branches"),
+			mainLabel: t("app.client.projectCanvas.canvas"),
 			drawerOpen: drawer,
 			onDrawerOpenChange: (open) => {
 				drawer = open;
@@ -1025,7 +1053,7 @@ function ProjectCanvas(handle) {
 					drawer = true;
 					handle.update();
 				},
-				sidebarLabel: "Branches",
+				sidebarLabel: t("app.client.projectCanvas.branches"),
 				renderArtboard: (route, state) => {
 					let side = sides.get(route.id);
 					if (side) return /* @__PURE__ */ jsx(DifferenceArtboard, {