fix #500

Author: mProjectsCode

packages/core/src/api/SyntaxHighlightingAPI.ts

@@ -12,7 +12,7 @@ import {
 	HLP_ViewFieldDeclaration,
 } from 'packages/core/src/parsers/syntaxHighlighting/HLPs';
 import { SyntaxHighlighting } from 'packages/core/src/parsers/syntaxHighlighting/SyntaxHighlighting';
-import { expectType } from '../utils/Utils';
+import { expectType } from 'packages/core/src/utils/Utils';
 
 export class SyntaxHighlightingAPI {
 	public readonly plugin: IPlugin;

packages/core/src/modals/modalContents/buttonBuilder/ButtonBuilderModalComponent.svelte

@@ -148,6 +148,10 @@
 			buttonConfig.backgroundImage = file;
 		});
 	}
+
+	function resetBackgroundImage(): void {
+		buttonConfig.backgroundImage = undefined;
+	}
 </script>
 
 <SettingComponent name="Label" description="The label shown on the button.">
@@ -178,10 +182,13 @@
 </SettingComponent>
 
 <SettingComponent name="Background image" description="A background image to use in the button.">
-	<span style="word-break: break-word">{buttonConfig.backgroundImage ?? 'none'}</span>
+	<span style="word-break: break-word">{buttonConfig.backgroundImage || 'none'}</span>
 	<Button variant={ButtonStyleType.PRIMARY} onclick={() => changeBackgroundImage()} tooltip="Select from vault"
 		>Change</Button
 	>
+	<Button variant={ButtonStyleType.DEFAULT} onclick={() => resetBackgroundImage()} tooltip="Reset to none"
+		><Icon plugin={plugin} iconName="x"></Icon></Button
+	>
 </SettingComponent>
 
 <SettingComponent

tests/__mocks__/TestComponent.ts

@@ -1,41 +1,43 @@
 export class TestComponent {
-    loaded: boolean;
-    used: boolean;
-    callbacks: (() => void)[];
+	loaded: boolean;
+	used: boolean;
+	callbacks: (() => void)[];
 
-    constructor() {
-        this.loaded = false;
-        this.used = false;
-        this.callbacks = [];
-    }
+	constructor() {
+		this.loaded = false;
+		this.used = false;
+		this.callbacks = [];
+	}
 
-    load() {
-        if (this.loaded) {
-            throw new Error('Attempted double load of TestComponent');
-        }
-        if (this.used) {
-            throw new Error('Attempted reuse of TestComponent');
-        }
-        this.loaded = true;
-    }
+	load() {
+		if (this.loaded) {
+			throw new Error('Attempted double load of TestComponent');
+		}
+		if (this.used) {
+			throw new Error('Attempted reuse of TestComponent');
+		}
+		this.loaded = true;
+	}
 
-    unload() {
-        if (!this.loaded && !this.used) {
-            throw new Error('Attempted unload of TestComponent before it was loaded');
-        }
-        if (!this.loaded && this.used) {
-            throw new Error('Attempted double unload of TestComponent');
-        }
-        this.loaded = false;
-        this.used = true;
-        this.callbacks.forEach(cb => cb());
-    }
+	unload() {
+		if (!this.loaded && !this.used) {
+			throw new Error('Attempted unload of TestComponent before it was loaded');
+		}
+		if (!this.loaded && this.used) {
+			throw new Error('Attempted double unload of TestComponent');
+		}
+		this.loaded = false;
+		this.used = true;
+		this.callbacks.forEach(cb => cb());
+	}
 
-    register(callback: () => void) {
-        if (this.used) {
-            throw new Error('Attempted to register callback after TestComponent was used. The callback will never be called.');
-        }
+	register(callback: () => void) {
+		if (this.used) {
+			throw new Error(
+				'Attempted to register callback after TestComponent was used. The callback will never be called.',
+			);
+		}
 
-        this.callbacks.push(callback);
-    }
-}
+		this.callbacks.push(callback);
+	}
+}