feat: add pinch-to-zoom support to editor

.devcontainer/devcontainer-lock.json

@@ -1,9 +1,9 @@
 {
   "features": {
     "ghcr.io/devcontainers/features/node:2.1": {
-      "version": "2.1.0",
-      "resolved": "ghcr.io/devcontainers/features/node@sha256:586c9a6f7dd40bd3ba2cd41e7f2f88dcc31fbe5d1442afcbf07ffbc66b686857",
-      "integrity": "sha256:586c9a6f7dd40bd3ba2cd41e7f2f88dcc31fbe5d1442afcbf07ffbc66b686857"
+      "version": "2.1.1",
+      "resolved": "ghcr.io/devcontainers/features/node@sha256:2a19d3b0b3879437637cfd292eb29fee0afcfbe6364e33db9afc4f80c5c1f956",
+      "integrity": "sha256:2a19d3b0b3879437637cfd292eb29fee0afcfbe6364e33db9afc4f80c5c1f956"
     },
     "ghcr.io/nordcominc/devcontainer-features/android-sdk:2": {
       "version": "2.0.0",

readme.md

@@ -4,7 +4,7 @@
   <img src='res/logo_1.png' width='250'>
 </p>
 
-[![](https://img.shields.io/endpoint?logo=telegram&label=Acode&style=flat&url=https%3A%2F%2Facode.app%2Fapi%2Ftelegram-members-count)](https://t.me/foxdebug_acode) [![](https://dcbadge.vercel.app/api/server/vVxVWYUAWD?style=flat)](https://discord.gg/vVxVWYUAWD)
+[![](https://img.shields.io/endpoint?logo=telegram&label=Acode&style=flat&url=https%3A%2F%2Facode.app%2Fapi%2Ftelegram-members-count)](https://t.me/foxdebug_acode) [![](https://dcbadge.limes.pink/api/server/https://discord.gg/vVxVWYUAWD?style=flat)](https://discord.gg/vVxVWYUAWD)
 
 ## • Overview
 

src/cm/commandRegistry.js

@@ -108,6 +108,10 @@ import keyBindings, {
 } from "lib/keyBindings";
 import settings from "lib/settings";
 import Url from "utils/Url";
+import {
+	clampEditorFontSize,
+	DEFAULT_EDITOR_FONT_SIZE,
+} from "./editorFontSize";
 
 const commandKeymapCompartment = new Compartment();
 
@@ -1457,11 +1461,13 @@ async function openInAppBrowserCommand() {
 }
 
 function adjustFontSize(delta) {
-	const current = settings?.value?.fontSize || "12px";
-	const numeric = Number.parseInt(current, 10) || 12;
-	const next = Math.min(72, Math.max(6, numeric + delta));
+	const current = settings?.value?.fontSize || `${DEFAULT_EDITOR_FONT_SIZE}px`;
+	const numeric = Number.parseInt(current, 10) || DEFAULT_EDITOR_FONT_SIZE;
+	const next = clampEditorFontSize(numeric + delta);
+
 	settings.value.fontSize = `${next}px`;
 	settings.update(false);
+
 	return true;
 }
 

src/cm/editorFontSize.js

@@ -0,0 +1,24 @@
+/**
+ * Shared font-size rules for the editor.
+ * Keeping these values consistent across editor commands and pinch-to-zoom.
+ */
+
+export const DEFAULT_EDITOR_FONT_SIZE = 12;
+export const MIN_EDITOR_FONT_SIZE = 6;
+export const MAX_EDITOR_FONT_SIZE = 72;
+
+/**
+ * Keeps the editor font size within the supported range.
+ * @param {number} px
+ * @returns {number}
+ */
+export function clampEditorFontSize(px) {
+	if (!Number.isFinite(px)) {
+		return DEFAULT_EDITOR_FONT_SIZE;
+	}
+
+	return Math.min(
+		MAX_EDITOR_FONT_SIZE,
+		Math.max(MIN_EDITOR_FONT_SIZE, Math.round(px)),
+	);
+}

src/cm/mainEditorExtensions.ts

@@ -1,6 +1,7 @@
 import type { Extension } from "@codemirror/state";
 import { EditorView } from "@codemirror/view";
 import searchMatchHighlighter from "./searchMatchHighlighter";
+import pinchZoom from "./pinchZoom";
 
 interface MainEditorExtensionOptions {
 	emmetExtensions?: Extension[];
@@ -47,6 +48,7 @@
 	pushExtension(extensions, options.commandKeymapExtension);
 	pushExtension(extensions, options.themeExtension);
 	extensions.push(fixedHeightTheme);
+	extensions.push(pinchZoom);
 	pushExtension(extensions, options.pointerCursorVisibilityExtension);
 	pushExtension(extensions, options.shiftClickSelectionExtension);
 	pushExtension(extensions, options.multiCursorSelectionExtension);