Merge pull request ycnmhd#81 from ycnmhd/next

next

Author: ycnmhd

.lintstagedrc.json

@@ -1,6 +1,6 @@
 {
 	"*.{js,jsx,ts,tsx, svelte}": [
 		"prettier --write",
-		"eslint --fix"
+		"eslint"
 	]
 }

esbuild.config.mjs

@@ -11,63 +11,69 @@ if you want to view the source, please visit the github repository of this plugi
 */
 `;
 
-const prod = process.argv[2] === "production";
+const prod = process.argv[2] === 'production';
 
-const context = await esbuild.context({
-	banner: {
-		js: banner
-	},
-	entryPoints: ["src/main.ts"],
-	bundle: true,
-	external: [
-		"obsidian",
-		"electron",
-		"@codemirror/autocomplete",
-		"@codemirror/collab",
-		"@codemirror/commands",
-		"@codemirror/language",
-		"@codemirror/lint",
-		"@codemirror/search",
-		"@codemirror/state",
-		"@codemirror/view",
-		"@lezer/common",
-		"@lezer/highlight",
-		"@lezer/lr",
-		...builtins
-	],
-	format: "cjs",
-	target: "es2021",
-	logLevel: "info",
-	sourcemap: prod ? false : "inline",
-	treeShaking: true,
-	outfile: "temp/vault/.obsidian/plugins/lineage-dev/main.js",
-	plugins: [
-		inlineWorkerPlugin({ minify: prod }),
-		esbuildSvelte({
-			compilerOptions: {
-				css: true
-			},
-			preprocess: sveltePreprocess(),
-			filterWarnings: (warning) => {
-				// disable a11y warnings
-				return !(warning.code.startsWith("a11y-"));
-			}
+const options = {
+    banner: {
+        js: banner,
+    },
+    entryPoints: ['src/main.ts'],
+    bundle: true,
+    external: [
+        'obsidian',
+        'electron',
+        '@codemirror/autocomplete',
+        '@codemirror/collab',
+        '@codemirror/commands',
+        '@codemirror/language',
+        '@codemirror/lint',
+        '@codemirror/search',
+        '@codemirror/state',
+        '@codemirror/view',
+        '@lezer/common',
+        '@lezer/highlight',
+        '@lezer/lr',
+        ...builtins,
+    ],
+    format: 'cjs',
+    target: 'es2021',
+    logLevel: 'info',
+    sourcemap: prod ? false : 'inline',
+    treeShaking: true,
+    outfile: 'temp/vault/.obsidian/plugins/lineage-dev/main.js',
+    plugins: [
+        inlineWorkerPlugin({ minify: prod }),
+        esbuildSvelte({
+            compilerOptions: {
+                css: true,
+            },
+            preprocess: sveltePreprocess(),
+            filterWarnings: (warning) => {
+                // disable a11y warnings
+                return !warning.code.startsWith('a11y-');
+            },
+        }),
+    ],
+};
+const context = await esbuild.context(options);
 
-		})
-
-	]
-});
-
-const cssContext = await esbuild.context({
-	entryPoints: ["src/styles/styles.css",],
-	bundle: true,
-	outfile: "temp/vault/.obsidian/plugins/lineage-dev/styles.css"
-});
+const cssOptions = {
+    entryPoints: ['src/styles/styles.css'],
+    bundle: true,
+    outfile: 'temp/vault/.obsidian/plugins/lineage-dev/styles.css',
+};
+const cssContext = await esbuild.context(cssOptions);
 
 if (prod) {
-	await context.rebuild();
-	await cssContext.rebuild();
-	process.exit(0);
+    await esbuild.build({
+        ...options,
+        define: { 'process.env.NODE_ENV': '"production"' },
+    });
+    await esbuild.build({
+        ...cssOptions,
+        define: { 'process.env.NODE_ENV': '"production"' },
+    });
+    process.exit(0);
 } else {
-	await Promise.all([cssContext.watch(), context.watch()]);
+    await Promise.all([cssContext.watch(), context.watch()]);
 }

manifest.json

@@ -1,7 +1,7 @@
 {
 	"id": "lineage",
 	"name": "Lineage",
-	"version": "0.8.0",
+	"version": "0.8.1",
 	"minAppVersion": "0.15.0",
 	"description": "Edit Markdown in a keyboard-centric Miller columns interface. Inspired by Gingko Writer.",
 	"author": "ycnmhd",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "lineage",
-    "version": "0.8.0",
+    "version": "0.8.1",
     "description": "",
     "scripts": {
         "dev": "node esbuild.config.mjs",
@@ -9,7 +9,8 @@
         "test:watch": "vitest",
         "test": "vitest run",
         "test:e2e": "playwright test",
-        "prepare": "husky install"
+        "prepare": "husky install",
+        "lint": "eslint src"
     },
     "keywords": [],
     "author": "",

src/helpers/delay.ts

@@ -1,3 +1,15 @@
-export const delay = async (milliseconds: number): Promise<void> => {
-    return new Promise((resolve) => setTimeout(resolve, milliseconds));
+export const delay = async (
+    milliseconds: number,
+    signal?: AbortSignal,
+): Promise<void> => {
+    return new Promise((resolve) => {
+        const timeout = setTimeout(() => resolve(), milliseconds);
+
+        if (signal) {
+            signal.addEventListener('abort', () => {
+                clearTimeout(timeout);
+                resolve();
+            });
+        }
+    });
 };

src/helpers/load-custom-icons.ts

@@ -4,13 +4,13 @@ type SvgStyleType = 'fill' | 'stroke';
 const svgWrapper = (innerSVG: string, mode: SvgStyleType = 'stroke') =>
     `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="svg-icon" ${mode === 'fill' ? 'stroke="transparent" fill="currentColor"' : 'stroke="currentColor" fill="transparent"'}> ${innerSVG.trim().replace(/\n/g, '')}</svg>`;
 
-type Icon = {
+export type CustomIcon = {
     name: string;
     svg: string;
     mode: SvgStyleType;
 };
 
-const cards: Icon = {
+const cards: CustomIcon = {
     name: 'lineage-cards',
     svg: `
     <path
@@ -20,13 +20,13 @@ const cards: Icon = {
     mode: 'fill',
 };
 
-const split: Icon = {
+const split: CustomIcon = {
     name: 'lineage-split',
     svg: `<path d="M16 3h5v5"/><path d="M8 3H3v5"/><path d="M12 22v-8.3a4 4 0 0 0-1.172-2.872L3 3"/><path d="m15 9 6-6"/>`,
     mode: 'stroke',
 };
 
-const alignH: Icon = {
+const alignH: CustomIcon = {
     name: 'lineage-align-horizontal',
     svg: `<g> 
             <rect width="20" height="12" x="2" y="6" rx="2"/> 
@@ -35,7 +35,7 @@ const alignH: Icon = {
     mode: 'stroke',
 };
 
-const alignV: Icon = {
+const alignV: CustomIcon = {
     name: 'lineage-align-vertical',
     svg: `<g> 
             <rect width="18" height="12" x="3" y="6" rx="2"/> 
@@ -51,7 +51,7 @@ const alignV: Icon = {
     mode: 'stroke',
 };
 
-const gap: Icon = {
+const gap: CustomIcon = {
     name: 'cards-gap',
     svg: `  
                 <rect width="20" height="12" x="-11.600009" y="6" rx="2" />
@@ -66,15 +66,15 @@ const gap: Icon = {
     mode: 'stroke',
 };
 
-const outline: Icon = {
+const outline: CustomIcon = {
     name: 'outline',
     svg: `<path d="M 7.563873,12 H 21.24698" />
   <path d="M 7.56116,18 H 21.159058" />
   <path d="M3 6h18" /> `,
     mode: 'stroke',
 };
 
-const cursorOff: Icon = {
+const cursorOff: CustomIcon = {
     name: 'cursor-off',
     svg: `<path d="m 8.0036101,3.8555957 h 1 a 3,3 0 0 1 2.9999999,3 3,3 0 0 1 3,-3 h 1" />
   <path d="m 16.00361,19.855596 h -1 a 3,3 0 0 1 -3,-3 3,3 0 0 1 -2.9999999,3 h -1" />
@@ -83,7 +83,7 @@ const cursorOff: Icon = {
     mode: 'stroke',
 };
 
-const cursor: Icon = {
+const cursor: CustomIcon = {
     name: 'cursor',
     svg: `<path d="m 8.0036101,3.8555957 h 1 a 3,3 0 0 1 2.9999999,3 3,3 0 0 1 3,-3 h 1" />
   <path d="m 16.00361,19.855596 h -1 a 3,3 0 0 1 -3,-3 3,3 0 0 1 -2.9999999,3 h -1" />

src/helpers/logger.ts

@@ -1,4 +1,5 @@
 /* eslint-disable no-console */
+
 type Logger = {
     debug: (...message: unknown[]) => void;
     info: (...message: unknown[]) => void;
@@ -34,3 +35,16 @@ const createLogger = (): Logger => {
 };
 
 export const logger = createLogger();
+
+/*let i = 0;
+export const AlignBranchLogger = (action: PluginAction) => {
+    const id = i++;
+    let t = 0;
+    return {
+        log: (...params: any[]) => {
+            const delta = t > 0 ? Date.now() - t : 0;
+            t = Date.now();
+            console.log(`[${id}] [${action.type}] [${delta}]`, ...params);
+        },
+    };
+}*/

src/lang/lang.ts

@@ -39,7 +39,7 @@ export const lang = {
     modals_snapshots_updated_card: 'Updated card ',
     modal_hk_editor_state_on: 'Enable only when the editor is active',
     modal_hk_editor_state_off: 'Enable only when the editor is inactive',
-    modal_hk_editor_state_both: "Enable regardless of the editor's state",
+    modal_hk_editor_state_both: 'Enable regardless of the editor state',
 
     // save
     card_btn_save: 'Save',
@@ -198,7 +198,7 @@ export const lang = {
     controls_zoom_in: 'Zoom in',
     controls_zoom_out: 'Zoom out',
     controls_zoom_reset: 'Reset (hold shift to undo)',
-    controls_zoom_presets: '',
+    controls_zoom_presets: 'Zoom menu',
     hk_zoom_in: 'Zoom in',
     hk_zoom_out: 'Zoom out',
     hk_zoom_reset: 'Reset zoom',
@@ -245,6 +245,11 @@ export const lang = {
     hk_outline_toggle_collapse_all: 'Collapse/expand all cards',
     hkg_outline: 'Outline',
 
+    // toolbar
+    settings_vertical_toolbar_icons: 'Vertical toolbar buttons',
+    settings_vertical_toolbar_icons_desc:
+        'Configure what buttons appear in the vertical toolbar',
+
     // space between cards
     controls_gap_between_cards: 'Space between cards',
     cmd_space_between_cards: `Toggle 'space between cards'`,

src/lib/align-element/align-element-horizontally.ts

@@ -1,7 +1,7 @@
 import { calculateScrollLeft } from 'src/lib/align-element/helpers/calculate-scroll-left';
 
 import { THRESHOLD } from 'src/lib/align-element/constants';
-import { AlignBranchContext } from 'src/stores/view/subscriptions/effects/align-branch/align-branch';
+import { AlignBranchContext } from 'src/stores/view/subscriptions/effects/align-branch/helpers/create-context';
 import { getElementById } from 'src/lib/align-element/helpers/get-element-by-id';
 
 export const alignElementHorizontally = (

src/lib/align-element/align-element-vertically.ts

@@ -3,7 +3,7 @@ import { THRESHOLD } from 'src/lib/align-element/constants';
 import {
     AlignBranchContext,
     PartialDOMRect,
-} from 'src/stores/view/subscriptions/effects/align-branch/align-branch';
+} from 'src/stores/view/subscriptions/effects/align-branch/helpers/create-context';
 import { calculateScrollTopRelative } from 'src/lib/align-element/helpers/calculate-scroll-top-relative';
 import { getElementById } from 'src/lib/align-element/helpers/get-element-by-id';