various fixes including #390

exampleVault/Buttons/Button Example.md

@@ -1,5 +1,5 @@
 ---
-count: 0
+count: 10
 someList:
   - 1708945050652
   - 1709918700548
@@ -216,7 +216,7 @@ actions:
   - type: updateMetadata
     bindTarget: count
     evaluate: true
-    value: x + 1
+    value: Math.min(10, x + 1)
 
 ```
 
@@ -229,7 +229,7 @@ actions:
   - type: updateMetadata
     bindTarget: count
     evaluate: true
-    value: x - 1
+    value: Math.max(0, x - 1)
 
 ```
 
@@ -318,3 +318,14 @@ actions:
 
 ```
 
+```meta-bind-button
+label: This is a button
+icon: ""
+hidden: false
+class: ""
+tooltip: ""
+id: test-id
+style: default
+actions: []
+
+```

package.json

@@ -12,7 +12,7 @@
 		"test": "LOG_TESTS=false bun test",
 		"test:log": "LOG_TESTS=true bun test",
 		"format": "prettier --write --plugin prettier-plugin-svelte .",
-		"format:check": "prettier --check --plugin prettier-plugin-svelte.",
+		"format:check": "prettier --check --plugin prettier-plugin-svelte .",
 		"lint": "eslint --max-warnings=0 packages/**",
 		"lint:fix": "eslint --max-warnings=0 --fix packages/**",
 		"svelte-check": "svelte-check --compiler-warnings \"unused-export-let:ignore\"",
@@ -33,10 +33,10 @@
 		"@happy-dom/global-registrator": "^14.12.3",
 		"@tsconfig/svelte": "^5.0.4",
 		"@types/bun": "^1.1.6",
-		"@typescript-eslint/eslint-plugin": "^7.17.0",
-		"@typescript-eslint/parser": "^7.17.0",
+		"@typescript-eslint/eslint-plugin": "^7.18.0",
+		"@typescript-eslint/parser": "^7.18.0",
 		"builtin-modules": "^4.0.0",
-		"elysia": "^1.1.4",
+		"elysia": "^1.1.5",
 		"esbuild": "^0.23.0",
 		"esbuild-plugin-copy-watch": "^2.3.1",
 		"esbuild-svelte": "^0.8.1",
@@ -49,7 +49,7 @@
 		"prettier": "^3.3.3",
 		"prettier-plugin-svelte": "^3.2.6",
 		"string-argv": "^0.3.2",
-		"svelte-check": "^3.8.4",
+		"svelte-check": "^3.8.5",
 		"svelte-preprocess": "^6.0.2",
 		"tslib": "^2.6.3",
 		"typescript": "^5.5.4",
@@ -61,7 +61,7 @@
 		"itertools-ts": "^1.27.1",
 		"mathjs": "^12.4.3",
 		"moment": "^2.30.1",
-		"svelte": "5.0.0-next.199",
+		"svelte": "5.0.0-next.208",
 		"zod": "^3.23.8",
 		"zod-validation-error": "^2.1.0"
 	},
@@ -71,6 +71,6 @@
 		"svelte-preprocess"
 	],
 	"patchedDependencies": {
-		"[email protected].199": "patches/[email protected].199.patch"
+		"[email protected].208": "patches/[email protected].208.patch"
 	}
 }

packages/core/src/fields/button/ButtonGroupMountable.ts

@@ -40,26 +40,34 @@ export class ButtonGroupMountable extends FieldMountable {
 
 		DomHelpers.removeAllClasses(targetEl);
 
-		if (!this.declaration.errorCollection.isEmpty()) {
-			this.plugin.internal.createErrorIndicator(targetEl, {
-				errorCollection: this.declaration.errorCollection,
-				errorText:
-					'Errors caused the creation of the field to fail. Sometimes one error only occurs because of another.',
-				warningText:
-					'Warnings will not cause the creation of a field to fail, but they indicate that a part of the declaration was invalid or uses deprecated functionality.',
-				code: this.declaration.declarationString,
-			});
-			return;
+		if (this.declaration.errorCollection.isEmpty()) {
+			try {
+				this.buttonField = new ButtonGroupField(
+					this.plugin,
+					this.declaration.referencedButtonIds,
+					this.getFilePath(),
+					this.renderChildType,
+					this.position,
+				);
+				this.buttonField.mount(targetEl);
+			} catch (e) {
+				this.errorCollection.add(e);
+				this.renderErrorIndicator(targetEl);
+			}
+		} else {
+			this.renderErrorIndicator(targetEl);
 		}
+	}
 
-		this.buttonField = new ButtonGroupField(
-			this.plugin,
-			this.declaration.referencedButtonIds,
-			this.getFilePath(),
-			this.renderChildType,
-			this.position,
-		);
-		this.buttonField.mount(targetEl);
+	private renderErrorIndicator(targetEl: HTMLElement): void {
+		this.plugin.internal.createErrorIndicator(targetEl, {
+			errorCollection: this.errorCollection,
+			errorText:
+				'Errors caused the creation of the field to fail. Sometimes one error only occurs because of another.',
+			warningText:
+				'Warnings will not cause the creation of a field to fail, but they indicate that a part of the declaration was invalid or uses deprecated functionality.',
+			code: this.declaration.declarationString,
+		});
 	}
 
 	protected onUnmount(targetEl: HTMLElement): void {

packages/core/src/fields/button/ButtonMountable.ts

@@ -30,6 +30,7 @@ export class ButtonMountable extends FieldMountable {
 		this.isPreview = isPreview;
 
 		this.errorCollection = new ErrorCollection(this.getUuid());
+		this.errorCollection.merge(declaration.errorCollection);
 	}
 
 	protected onMount(targetEl: HTMLElement): void {
@@ -38,28 +39,36 @@ export class ButtonMountable extends FieldMountable {
 
 		DomHelpers.removeAllClasses(targetEl);
 
-		if (!this.declaration.config || !this.declaration.errorCollection.isEmpty()) {
-			this.plugin.internal.createErrorIndicator(targetEl, {
-				errorCollection: this.declaration.errorCollection,
-				errorText:
-					'Errors caused the creation of the field to fail. Sometimes one error only occurs because of another.',
-				warningText:
-					'Warnings will not cause the creation of a field to fail, but they indicate that a part of the declaration was invalid or uses deprecated functionality.',
-				code: this.declaration.declarationString,
-			});
-			return;
+		if (this.declaration.config && this.declaration.errorCollection.isEmpty()) {
+			try {
+				this.buttonField = new ButtonField(
+					this.plugin,
+					this.declaration.config,
+					this.getFilePath(),
+					RenderChildType.BLOCK,
+					this.position,
+					false,
+					this.isPreview,
+				);
+				this.buttonField.mount(targetEl);
+			} catch (e) {
+				this.errorCollection.add(e);
+				this.renderErrorIndicator(targetEl);
+			}
+		} else {
+			this.renderErrorIndicator(targetEl);
 		}
+	}
 
-		this.buttonField = new ButtonField(
-			this.plugin,
-			this.declaration.config,
-			this.getFilePath(),
-			RenderChildType.BLOCK,
-			this.position,
-			false,
-			this.isPreview,
-		);
-		this.buttonField.mount(targetEl);
+	private renderErrorIndicator(targetEl: HTMLElement): void {
+		this.plugin.internal.createErrorIndicator(targetEl, {
+			errorCollection: this.errorCollection,
+			errorText:
+				'Errors caused the creation of the field to fail. Sometimes one error only occurs because of another.',
+			warningText:
+				'Warnings will not cause the creation of a field to fail, but they indicate that a part of the declaration was invalid or uses deprecated functionality.',
+			code: this.declaration.declarationString,
+		});
 	}
 
 	protected onUnmount(targetEl: HTMLElement): void {

packages/core/src/fields/metaBindTable/TableMountable.ts

@@ -12,6 +12,8 @@ import { parsePropPath } from 'packages/core/src/utils/prop/PropParser';
 import type { Listener } from 'packages/core/src/utils/Signal';
 import { Signal } from 'packages/core/src/utils/Signal';
 import { showUnloadedMessage } from 'packages/core/src/utils/Utils';
+import type { Component as SvelteComponent } from 'svelte';
+import { mount, unmount } from 'svelte';
 
 // export type MetaBindTableCell =
 // 	| {
@@ -38,11 +40,13 @@ export interface MetaBindTableRow {
 
 type T = Record<string, MBExtendedLiteral>[];
 
+type TableComponent = SvelteComponent<object, { updateTable(cells: MetaBindTableRow[]): void }>;
+
 export class TableMountable extends FieldMountable {
 	bindTarget: BindTargetDeclaration;
 	tableHead: string[];
 	columns: MetaBindColumnDeclaration[];
-	tableComponent: MetaBindTableComponent | undefined;
+	tableComponent: ReturnType<TableComponent> | undefined;
 
 	private metadataManagerOutputSignalListener: Listener<unknown> | undefined;
 
@@ -157,7 +161,6 @@ export class TableMountable extends FieldMountable {
 			}
 		}
 
-		// eslint-disable-next-line @typescript-eslint/no-unsafe-call
 		this.tableComponent?.updateTable(tableRows);
 	}
 
@@ -183,7 +186,7 @@ export class TableMountable extends FieldMountable {
 	protected onMount(targetEl: HTMLElement): void {
 		super.onMount(targetEl);
 
-		this.tableComponent = new MetaBindTableComponent({
+		this.tableComponent = mount(MetaBindTableComponent as unknown as TableComponent, {
 			target: targetEl,
 			props: {
 				table: this,
@@ -205,7 +208,9 @@ export class TableMountable extends FieldMountable {
 		super.onUnmount(targetEl);
 
 		this.unregisterSelfFromMetadataManager();
-		this.tableComponent?.$destroy();
+		if (this.tableComponent) {
+			unmount(this.tableComponent);
+		}
 
 		showUnloadedMessage(targetEl, 'table');
 	}

packages/core/src/utils/errors/ErrorIndicatorComponent.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import type { ErrorIndicatorProps } from 'packages/core/src/api/InternalAPI';
 	import type { IPlugin } from 'packages/core/src/IPlugin';
+	import { onMount } from 'svelte';
 
 	const {
 		plugin,
@@ -10,6 +11,10 @@
 		settings: ErrorIndicatorProps;
 	} = $props();
 
+	onMount(() => {
+		console.log(settings.errorCollection.otherError);
+	});
+
 	function openModal(): void {
 		plugin.internal.openErrorCollectionViewModal(settings);
 	}

packages/obsidian/src/settings/buttonTemplateSetting/ButtonTemplatesSettingComponent.svelte

@@ -70,8 +70,6 @@
 		}
 
 		buttonConfigs.push(unvalidatedConfig!);
-
-		buttonConfigs = buttonConfigs;
 	}
 
 	function save(): void {

packages/obsidian/src/settings/buttonTemplateSetting/ButtonTemplatesSettingModal.ts

@@ -5,10 +5,12 @@ import type { ErrorCollection } from 'packages/core/src/utils/errors/ErrorCollec
 import { deepCopy } from 'packages/core/src/utils/Utils';
 import type MetaBindPlugin from 'packages/obsidian/src/main';
 import ButtonTemplatesSettingComponent from 'packages/obsidian/src/settings/buttonTemplateSetting/ButtonTemplatesSettingComponent.svelte';
+import type { Component as SvelteComponent } from 'svelte';
+import { mount, unmount } from 'svelte';
 
 export class ButtonTemplatesSettingModal extends Modal {
 	readonly plugin: MetaBindPlugin;
-	private component: ButtonTemplatesSettingComponent | undefined;
+	private component: ReturnType<SvelteComponent> | undefined;
 
 	constructor(app: App, plugin: MetaBindPlugin) {
 		super(app);
@@ -18,10 +20,10 @@ export class ButtonTemplatesSettingModal extends Modal {
 	public onOpen(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 
-		this.component = new ButtonTemplatesSettingComponent({
+		this.component = mount(ButtonTemplatesSettingComponent, {
 			target: this.contentEl,
 			props: {
 				buttonConfigs: deepCopy(this.plugin.settings.buttonTemplates),
@@ -33,7 +35,7 @@ export class ButtonTemplatesSettingModal extends Modal {
 	public onClose(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 	}
 

packages/obsidian/src/settings/excludedFoldersSetting/ExcludedFoldersSettingModal.ts

@@ -3,10 +3,12 @@ import { Modal } from 'obsidian';
 import { ErrorCollection } from 'packages/core/src/utils/errors/ErrorCollection';
 import type MetaBindPlugin from 'packages/obsidian/src/main';
 import ExcludedFoldersSettingComponent from 'packages/obsidian/src/settings/excludedFoldersSetting/ExcludedFoldersSettingComponent.svelte';
+import type { Component as SvelteComponent } from 'svelte';
+import { mount, unmount } from 'svelte';
 
 export class ExcludedFoldersSettingModal extends Modal {
 	private readonly plugin: MetaBindPlugin;
-	private component: ExcludedFoldersSettingComponent | undefined;
+	private component: ReturnType<SvelteComponent> | undefined;
 
 	constructor(app: App, plugin: MetaBindPlugin) {
 		super(app);
@@ -16,10 +18,10 @@ export class ExcludedFoldersSettingModal extends Modal {
 	public onOpen(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 
-		this.component = new ExcludedFoldersSettingComponent({
+		this.component = mount(ExcludedFoldersSettingComponent, {
 			target: this.contentEl,
 			props: {
 				excludedFolders: this.plugin.settings.excludedFolders.slice(),
@@ -32,7 +34,7 @@ export class ExcludedFoldersSettingModal extends Modal {
 	public onClose(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 	}
 

packages/obsidian/src/settings/inputFieldTemplateSetting/InputFieldTemplatesSettingModal.ts

@@ -4,10 +4,12 @@ import type { InputFieldTemplate } from 'packages/core/src/Settings';
 import type { ErrorCollection } from 'packages/core/src/utils/errors/ErrorCollection';
 import type MetaBindPlugin from 'packages/obsidian/src/main';
 import InputFieldTemplatesSettingComponent from 'packages/obsidian/src/settings/inputFieldTemplateSetting/InputFieldTemplatesSettingComponent.svelte';
+import type { Component as SvelteComponent } from 'svelte';
+import { mount, unmount } from 'svelte';
 
 export class InputFieldTemplatesSettingModal extends Modal {
 	readonly plugin: MetaBindPlugin;
-	private component: InputFieldTemplatesSettingComponent | undefined;
+	private component: ReturnType<SvelteComponent> | undefined;
 
 	constructor(app: App, plugin: MetaBindPlugin) {
 		super(app);
@@ -17,10 +19,10 @@ export class InputFieldTemplatesSettingModal extends Modal {
 	public onOpen(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 
-		this.component = new InputFieldTemplatesSettingComponent({
+		this.component = mount(InputFieldTemplatesSettingComponent, {
 			target: this.contentEl,
 			props: {
 				// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
@@ -33,7 +35,7 @@ export class InputFieldTemplatesSettingModal extends Modal {
 	public onClose(): void {
 		this.contentEl.empty();
 		if (this.component) {
-			this.component.$destroy();
+			unmount(this.component);
 		}
 	}