more comments, prepare for next release

CHANGELOG.md

@@ -2,9 +2,24 @@
 
 # Unreleased
 
+New Features
+
+-   The in plugin offline FAQ/Help Page now includes a preview of all available input fields
+-   New view field type `link`
+    -   displays a link to the note specified in the metadata
+    -   works with lists of notes
+    -   works with external URLs
+
 Breaking Changes
 
 -   removed setting migrations for settings from plugin versions earlier than `0.6.0`
+-   migrated the JS View Field to use JS Engine
+    -   the docs will include a migration guide soon
+
+Bug Fixes
+
+-   Fixed Metadata cache does not update on file rename or delete [#142](https://github.com/mProjectsCode/obsidian-meta-bind-plugin/issues/142)
+    -   now all Input and View Fields bound to the renamed or deleted note will unload
 
 # 0.7.2
 

exampleVault/Advanced Examples/PF2e DC Calcualtor.md

@@ -5,7 +5,6 @@ baseDC: 15
 baseSpellDC: 15
 ---
 
-
 ### DC by Proficiency
 
 | Proficiency | DC  |

exampleVault/Advanced Examples/PF2e Encounter Calculator.md

@@ -24,54 +24,13 @@ test:
   - c
 ---
 
-
-
 ### Party Info
 
 Players: `INPUT[number:playerCount]`
 Player Level: `INPUT[number:playerLevel]`
 
 ### Enemies
 
-%% 
-| Name                        | Level                        | Count                        |
-| --------------------------- | ---------------------------- | ---------------------------- |
-| `INPUT[text:enemy[0].name]` | `INPUT[number:enemy[0].level]` | `INPUT[number:enemy[0].count]` |
-| `INPUT[text:enemy[1].name]` | `INPUT[number:enemy[1].level]` | `INPUT[number:enemy[1].count]` |
-| `INPUT[text:enemy[2].name]` | `INPUT[number:enemy[2].level]` | `INPUT[number:enemy[2].count]` |
-| `INPUT[text:enemy[3].name]` | `INPUT[number:enemy[3].level]` | `INPUT[number:enemy[3].count]` |
-| `INPUT[text:enemy[4].name]` | `INPUT[number:enemy[4].level]` | `INPUT[number:enemy[4].count]` |
-
-```js
-const mb = engine.getPlugin('obsidian-meta-bind-plugin').api;
-
-function render(enemies) {
-	const md = engine.markdown.createBuilder();
-	md.createTable(
-		['Name', 'Level', 'Count'], 
-		enemies.map((x, i) => {
-			return [
-				`\`INPUT[text:enemy[${i}].name]\``,
-				`\`INPUT[text:enemy[${i}].level]\``,
-				`\`INPUT[text:enemy[${i}].count]\``
-			]
-		})
-	);
-	return md;
-}
-
-const signal = mb.createSignal([]);
-const unregisterCb = mb.listenToMetadata(signal, context.file.path, ['enemy'], false);
-
-const reactive = engine.reactive(render, signal.get());
-
-component.register(unregisterCb);
-
-return reactive;
-``` 
-%%
-
-
 ```js-engine
 const mb = engine.getPlugin('obsidian-meta-bind-plugin').api;
 
@@ -87,7 +46,6 @@ const columns = [
 mb.createTable(container, context.file.path, component, bindTarget, tableHead, columns);
 ```
 
-
 ### Encounter Stats
 
 ```meta-bind-js-view

exampleVault/Input Fields/Progress Bar.md

@@ -8,7 +8,6 @@ progress3: 4
 INPUT[progressBar(showcase, minValue(-10), maxValue(3)):progress1]
 ```
 
-
 ```meta-bind
 INPUT[progressBar(showcase, minValue(0), maxValue(1), stepSize(0.1)):progress2]
 ```

exampleVault/Input Fields/Select and Multi Select.md

@@ -15,6 +15,7 @@ multiSelect3:
 ---
 
 ### Select
+
 ```meta-bind
 INPUT[select(
 option(1, option 1), 

exampleVault/Input Fields/Slider.md

@@ -5,16 +5,19 @@ slider3: 233
 ---
 
 ### Simple Slider
+
 ```meta-bind
 INPUT[slider(showcase):slider1]
 ```
 
 ### Slider with Labels
+
 ```meta-bind
 INPUT[slider(addLabels, showcase):slider1]
 ```
 
 ### Slider with custom min max values
+
 ```meta-bind
 INPUT[slider(addLabels, minValue(-20), maxValue(20), showcase):slider2]
 ```

exampleVault/Input Fields/Suggester.md

@@ -5,6 +5,7 @@ suggest: option 2
 ---
 
 ### Simple Suggester
+
 ```meta-bind
 INPUT[suggester(
 option(option 1),

exampleVault/Input Fields/Text.md

@@ -4,6 +4,7 @@ textArea: textArea
 ---
 
 ### Text
+
 ```meta-bind
 INPUT[text(showcase):text]
 ```
@@ -13,6 +14,7 @@ INPUT[text(showcase, limit(10)):text]
 ```
 
 ### Text Area
+
 ```meta-bind
 INPUT[text_area(showcase, class(meta-bind-full-width), class(meta-bind-high)):textArea]
 ```

exampleVault/Input Fields/Toggle.md

@@ -1,9 +1,8 @@
 ---
 toggle2: 1
-toggle1: false
+toggle1: true
 ---
 
-
 ```meta-bind
 INPUT[toggle(showcase):toggle1]
 ```

src/cm6/Cm6_ViewPlugin.ts

@@ -12,6 +12,9 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 	return ViewPlugin.fromClass(
 		class {
 			decorations: DecorationSet;
+			/**
+			 * Component for unloading the widgets if the view plugin is destroyed.
+			 */
 			component: Component;
 
 			constructor(view: EditorView) {
@@ -20,6 +23,12 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				this.decorations = this.renderWidgets(view) ?? Decoration.none;
 			}
 
+			/**
+			 * Triggered by codemirror when the view updates.
+			 * Depending on the update type, the decorations are either updated or recreated.
+			 *
+			 * @param update
+			 */
 			update(update: ViewUpdate): void {
 				// only activate in LP and not source mode
 				// @ts-ignore some strange private field not being assignable
@@ -41,6 +50,11 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				}
 			}
 
+			/**
+			 * Updates all the widgets by traversing the syntax tree.
+			 *
+			 * @param view
+			 */
 			updateTree(view: EditorView): void {
 				for (const { from, to } of view.visibleRanges) {
 					syntaxTree(view.state).iterate({
@@ -70,6 +84,11 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				}
 			}
 
+			/**
+			 * Removes all decorations at a given node.
+			 *
+			 * @param node
+			 */
 			removeDecoration(node: SyntaxNode): void {
 				this.decorations.between(node.from - 1, node.to + 1, (from, to, _) => {
 					this.decorations = this.decorations.update({
@@ -80,6 +99,14 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				});
 			}
 
+			/**
+			 * Adds a widget at a given node if it does not exist yet.
+			 *
+			 * @param node the note where to add the widget
+			 * @param view
+			 * @param content the content of the node
+			 * @param widgetType the type of the widget to add
+			 */
 			addDecoration(node: SyntaxNode, view: EditorView, content: string, widgetType: MBWidgetType): void {
 				const from = node.from - 1;
 				const to = node.to + 1;
@@ -106,7 +133,7 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 			}
 
 			/**
-			 * return weather to render the widget and the type of the widget to render.
+			 * Checks whether to render a widget at a given node and the type of the widget to render.
 			 *
 			 * @param view
 			 * @param node
@@ -137,7 +164,7 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 			}
 
 			/**
-			 * reads the node, returning its content and widgetType.
+			 * Reads the content of an editor range and checks if it is a declaration if so also returning the widget type.
 			 *
 			 * @param view
 			 * @param from
@@ -155,6 +182,11 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				};
 			}
 
+			/**
+			 * Completely re-renders all widgets.
+			 *
+			 * @param view
+			 */
 			renderWidgets(view: EditorView): RangeSet<Decoration> | undefined {
 				const currentFile = Cm6_Util.getCurrentFile(view);
 				if (!currentFile) {
@@ -192,6 +224,14 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				return Decoration.set(widgets, true);
 			}
 
+			/**
+			 * Renders a singe widget of the given widget type at a given node.
+			 *
+			 * @param node
+			 * @param widgetType
+			 * @param content
+			 * @param currentFile
+			 */
 			renderWidget(
 				node: SyntaxNode,
 				widgetType: MBWidgetType,
@@ -214,6 +254,10 @@ export function createMarkdownRenderChildWidgetEditorPlugin(plugin: MetaBindPlug
 				}).range(node.from - 1, node.to + 1);
 			}
 
+			/**
+			 * Triggered by codemirror when the view plugin is destroyed.
+			 * Unloads all widgets.
+			 */
 			destroy(): void {
 				this.component.unload();
 			}

src/cm6/Cm6_Widgets.ts

@@ -28,12 +28,12 @@ export abstract class MarkdownRenderChildWidget<T extends AbstractMDRC> extends
 	abstract createRenderChild(container: HTMLElement, component: Component): T | ExcludedMDRC;
 
 	public toDOM(_: EditorView): HTMLElement {
-		const div = document.createElement('span');
-		div.addClass('cm-inline-code');
+		const span = document.createElement('span');
+		span.addClass('cm-inline-code');
 
-		this.renderChild = this.createRenderChild(div, this.parentComponent);
+		this.renderChild = this.createRenderChild(span, this.parentComponent);
 
-		return div;
+		return span;
 	}
 
 	public destroy(dom: HTMLElement): void {
@@ -62,7 +62,6 @@ export class InputFieldWidget extends MarkdownRenderChildWidget<InputFieldMDRC>
 			this.filePath,
 			container,
 			component,
-			undefined,
 		);
 	}
 }

src/main.ts

@@ -28,23 +28,29 @@ export default class MetaBindPlugin extends Plugin implements IPlugin {
 	async onload(): Promise<void> {
 		console.log(`meta-bind | Main >> load`);
 
+		// load and immediately save settings to apply migrations
 		await this.loadSettings();
 		await this.saveSettings();
 
+		// create API instance
 		this.api = new API(this);
 
+		// parse templates
 		const templateParseErrorCollection = this.api.inputFieldParser.parseTemplates(
 			this.settings.inputFieldTemplates,
 		);
 		if (templateParseErrorCollection.hasErrors()) {
 			console.warn('meta-bind | failed to parse templates', templateParseErrorCollection);
 		}
 
+		// create MDRC manager
 		this.mdrcManager = new MDRCManager();
 
+		// create metadata manager
 		const metadataAdapter = new ObsidianMetadataAdapter(this);
 		this.metadataManager = new MetadataManager(metadataAdapter);
 
+		// markdown post processors
 		this.registerMarkdownPostProcessor((el: HTMLElement, ctx: MarkdownPostProcessorContext) => {
 			const codeBlocks = el.querySelectorAll('code');
 
@@ -100,6 +106,7 @@ export default class MetaBindPlugin extends Plugin implements IPlugin {
 			this.api.createJsViewFieldFromString(source, RenderChildType.BLOCK, ctx.sourcePath, el, ctx);
 		});
 
+		// LP editor extension
 		this.registerEditorExtension(createMarkdownRenderChildWidgetEditorPlugin(this));
 
 		// this.addCommand({
@@ -111,6 +118,7 @@ export default class MetaBindPlugin extends Plugin implements IPlugin {
 		// 	},
 		// });
 
+		// register commands
 		this.addCommand({
 			id: 'mb-open-docs',
 			name: 'Open Meta Bind Docs',
@@ -127,8 +135,18 @@ export default class MetaBindPlugin extends Plugin implements IPlugin {
 			},
 		});
 
+		this.addCommand({
+			id: 'mb-open-help',
+			name: 'Open Meta Bind Help',
+			callback: () => {
+				void this.activateView(MB_FAQ_VIEW_TYPE);
+			},
+		});
+
+		// register FAQ view
 		this.registerView(MB_FAQ_VIEW_TYPE, leaf => new FaqView(leaf, this));
 
+		// register settings tab
 		this.addSettingTab(new MetaBindSettingTab(this.app, this));
 	}
 
@@ -169,8 +187,10 @@ export default class MetaBindPlugin extends Plugin implements IPlugin {
 	async saveSettings(): Promise<void> {
 		console.log(`meta-bind | Main >> settings save`);
 
+		// update all the things
 		DateParser.dateFormat = this.settings.preferredDateFormat;
 		setFirstWeekday(this.settings.firstWeekday);
+
 		await this.saveData(this.settings);
 	}
 

src/utils/faq/InputFieldExamples.ts

@@ -2,11 +2,12 @@ import { InputFieldArgumentType, type InputFieldType } from '../../parsers/Gener
 import { type UnvalidatedInputFieldDeclaration } from '../../parsers/inputFieldParser/InputFieldDeclaration';
 import type MetaBindPlugin from '../../main';
 
+// TODO: fix image suggester not working with "" to search entire vault
 export const INPUT_FIELD_EXAMPLE_DECLARATIONS: Record<InputFieldType, string> = {
 	date: 'date',
 	datePicker: 'datePicker',
 	editor: 'editor',
-	imageSuggester: 'imageSuggester',
+	imageSuggester: 'imageSuggester(optionQuery(""))',
 	inlineList: 'inlineList',
 	inlineListSuggester: 'inlineListSuggester(option(apple), option(banana), option(lemon))',
 	inlineSelect: 'inlineSelect(option(apple), option(banana), option(lemon))',