From 7fe54043046e33b005fe90fe0f3e802b5bae972d Mon Sep 17 00:00:00 2001 From: Min Date: Tue, 11 Mar 2025 00:03:04 +0900 Subject: [PATCH 1/3] add configuration of tab size --- electron/config.js | 2 ++ src/components/settings/Settings.vue | 15 +++++++++++++++ src/editor/editor.js | 10 +++++++++- src/stores/editor-cache.js | 4 ++++ 4 files changed, 30 insertions(+), 1 deletion(-) diff --git a/electron/config.js b/electron/config.js index f3ecd97..dad513c 100644 --- a/electron/config.js +++ b/electron/config.js @@ -35,6 +35,7 @@ const schema = { "showInMenu": {type: "boolean", default: false}, "alwaysOnTop": {type: "boolean", default: false}, "bracketClosing": {type: "boolean", default: false}, + "tabSize": {type: "integer", default: 4}, "defaultBlockLanguage": {type: "string"}, "defaultBlockLanguageAutoDetect": {type: "boolean"}, @@ -72,6 +73,7 @@ const defaults = { showInMenu: false, alwaysOnTop: false, bracketClosing: false, + tabSize: 4, }, theme: "system", } diff --git a/src/components/settings/Settings.vue b/src/components/settings/Settings.vue index f142b70..8c10838 100644 --- a/src/components/settings/Settings.vue +++ b/src/components/settings/Settings.vue @@ -40,6 +40,7 @@ showInMenu: this.initialSettings.showInMenu, alwaysOnTop: this.initialSettings.alwaysOnTop, bracketClosing: this.initialSettings.bracketClosing, + tabSize: this.initialSettings.tabSize || 4, autoUpdate: this.initialSettings.autoUpdate, bufferPath: this.initialSettings.bufferPath, fontFamily: this.initialSettings.fontFamily || defaultFontFamily, @@ -102,6 +103,7 @@ alwaysOnTop: this.alwaysOnTop, autoUpdate: this.autoUpdate, bracketClosing: this.bracketClosing, + tabSize: this.tabSize, bufferPath: this.bufferPath, fontFamily: this.fontFamily === defaultFontFamily ? undefined : this.fontFamily, fontSize: this.fontSize === defaultFontSize ? undefined : this.fontSize, @@ -276,6 +278,19 @@ +
+
+

Tab Size

+ +
+

Default Block Language

diff --git a/src/editor/editor.js b/src/editor/editor.js index 749328a..38c8693 100644 --- a/src/editor/editor.js +++ b/src/editor/editor.js @@ -51,6 +51,7 @@ export class HeynoteEditor { bracketClosing=false, fontFamily, fontSize, + tabSize=4, defaultBlockToken, defaultBlockAutoDetect, }) { @@ -63,6 +64,7 @@ export class HeynoteEditor { this.foldGutterCompartment = new Compartment this.readOnlyCompartment = new Compartment this.closeBracketsCompartment = new Compartment + this.indentUnitCompartment = new Compartment this.deselectOnCopy = keymap === "emacs" this.emacsMetaKey = emacsMetaKey this.fontTheme = new Compartment @@ -91,7 +93,7 @@ export class HeynoteEditor { this.themeCompartment.of(theme === "dark" ? heynoteDark : heynoteLight), heynoteBase, this.fontTheme.of(getFontTheme(fontFamily, fontSize)), - indentUnit.of(" "), + this.indentUnitCompartment.of(indentUnit.of(" ".repeat(tabSize))), EditorView.scrollMargins.of(f => { return {top: 80, bottom: 80} }), @@ -417,6 +419,12 @@ export class HeynoteEditor { selectAll() { selectAll(this.view) } + + setTabSize(tabSize) { + this.view.dispatch({ + effects: this.indentUnitCompartment.reconfigure(indentUnit.of(" ".repeat(tabSize))) + }) + } } diff --git a/src/stores/editor-cache.js b/src/stores/editor-cache.js index 7badc2e..e8845c7 100644 --- a/src/stores/editor-cache.js +++ b/src/stores/editor-cache.js @@ -36,6 +36,7 @@ export const useEditorCacheStore = defineStore("editorCache", { bracketClosing: settingsStore.settings.bracketClosing, fontFamily: settingsStore.settings.fontFamily, fontSize: settingsStore.settings.fontSize, + tabSize: settingsStore.settings.tabSize, defaultBlockToken: settingsStore.settings.defaultBlockLanguage, defaultBlockAutoDetect: settingsStore.settings.defaultBlockLanguageAutoDetect, }) @@ -137,6 +138,9 @@ export const useEditorCacheStore = defineStore("editorCache", { case "fontSize": editor.setFont(newSettings.fontFamily, newSettings.fontSize) break + case "tabSize": + editor.setTabSize(newSettings.tabSize) + break case "defaultBlockLanguage": case "defaultBlockLanguageAutoDetect": editor.setDefaultBlockLanguage(newSettings.defaultBlockLanguage, newSettings.defaultBlockLanguageAutoDetect) From 6b8d58f621fecfed51c33eb632d0452caac8787e Mon Sep 17 00:00:00 2001 From: Jonatan Heyman Date: Tue, 22 Apr 2025 17:13:58 +0200 Subject: [PATCH 2/3] Add test for tab size setting --- tests/tab-size-setting.spec.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 tests/tab-size-setting.spec.js diff --git a/tests/tab-size-setting.spec.js b/tests/tab-size-setting.spec.js new file mode 100644 index 0000000..cb8c2cb --- /dev/null +++ b/tests/tab-size-setting.spec.js @@ -0,0 +1,23 @@ +import { test, expect } from "@playwright/test"; +import { HeynotePage } from "./test-utils.js"; + +let heynotePage + +test.beforeEach(async ({ page }) => { + heynotePage = new HeynotePage(page) + await heynotePage.goto() +}); + +test("test default tab size", async ({ page }) => { + await page.locator("body").press("Tab") + expect(await heynotePage.getBlockContent(0)).toBe(" ") +}) + +test("test custom tab size", async ({ page }) => { + await page.locator("css=.status-block.settings").click() + await page.locator("css=li.tab-editing").click() + await page.locator("css=select.tab-size").selectOption("2") + await page.locator("body").press("Escape") + await page.locator("body").press("Tab") + expect(await heynotePage.getBlockContent(0)).toBe(" ") +}) From 70641cdc972af28c0e1855fd5515cce57caefce0 Mon Sep 17 00:00:00 2001 From: Jonatan Heyman Date: Tue, 22 Apr 2025 17:16:52 +0200 Subject: [PATCH 3/3] Add changelog entry about configurable tab size --- docs/changelog.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/changelog.md b/docs/changelog.md index 543ff44..090c4fa 100644 --- a/docs/changelog.md +++ b/docs/changelog.md @@ -8,6 +8,7 @@ Here are the most notable changes in each release. For a more detailed list of c - Added support for custom key bindings. See [the documentation](https://heynote.com/docs/#user-content-custom-key-bindings) for more info. - Added a "command palette" that can be accessed by pressing `Ctrl/Cmd+Shift+P`, or just typing `>` in the buffer selector. The command palette allows you to discover all available commands in the app, and to quickly execute them. +- Added support for configuring the tab size. ### Other changes