better input field data handling

Author: mProjectsCode

.eslintrc

@@ -16,7 +16,7 @@
 		"no-prototype-builtins": "off",
 		"@typescript-eslint/no-empty-function": "off",
 		"@typescript-eslint/no-inferrable-types": "off",
-		"@typescript-eslint/no-explicit-any": "off",
+		"@typescript-eslint/no-explicit-any": ["warn"],
 		"@typescript-eslint/explicit-function-return-type": ["warn"]
 	}
 }

CHANGELOG.md

@@ -3,26 +3,29 @@
 # 0.5.1
 
 Minor Changes
-- added a setting to disable JS View Fields
 
+-   added a setting to disable JS View Fields
 
 # 0.5.0
 
 New Features
-- Live Preview support (thanks to koala on discord for helping me with this)
-- Obsidian Publish support (docs page coming soon, thanks to Sigrunixia on discord for letting me test on her publish account)
-- View Fields, a way to reactively display your metadata using mathjs
-- Inline Select input field (more or less a dropdown select)
-- Progress Bar input field (a bigger full note width slider)
-- On and Off Value arguments for the Toggle input field (specify custom on and off values for the toggle)
-- new error handling system that supports warnings
+
+-   Live Preview support (thanks to koala on discord for helping me with this)
+-   Obsidian Publish support (docs page coming soon, thanks to Sigrunixia on discord for letting me test on her publish account)
+-   View Fields, a way to reactively display your metadata using mathjs
+-   Inline Select input field (more or less a dropdown select)
+-   Progress Bar input field (a bigger full note width slider)
+-   On and Off Value arguments for the Toggle input field (specify custom on and off values for the toggle)
+-   new error handling system that supports warnings
 
 Minor Changes
-- added timed cache retention to the plugins on demand metadata cache
+
+-   added timed cache retention to the plugins on demand metadata cache
 
 Bug Fixes
-- fixed a bug with the metadata cache needlessly updating the frontmatter
-- fixed some mistakes in the docs
+
+-   fixed a bug with the metadata cache needlessly updating the frontmatter
+-   fixed some mistakes in the docs
 
 # 0.4.X
 

exampleVault/Input Fields/Date and Time.md

@@ -1,6 +1,6 @@
 ---
 time: 14:12
-date2: 2023-06-07
+date2: null
 date1: 2023-06-08
 ---
 

exampleVault/Input Fields/Number.md

@@ -1,5 +1,5 @@
 ---
-number: 100
+number: 1234
 ---
 
 ```meta-bind

exampleVault/Input Fields/Progress Bar.md

@@ -1,5 +1,5 @@
 ---
-progress1: -7
+progress1: 1
 ---
 
 ```meta-bind

exampleVault/Input Fields/Select and Multi Select.md

@@ -3,7 +3,7 @@ select: 1
 multiSelect:
   - option 1
   - option 3
-select2: 1
+select2: null
 ---
 
 ### Select

exampleVault/Test.md

@@ -1,6 +1,48 @@
 ---
 frequency: "[[high]]"
+toggle: false
+needs: Text
+date: Saturday, July 8th 2023
+text: asdasddas
 ---
 
 
-`INPUT[suggester(option([[low]]), option([[medium]]), option([[high]])):frequency]`
+`--INPUT[suggester(option([[low]]), option([[medium]]), option([[high]])):frequency]`
+
+```dataviewjs
+const setFilter = "" ;
+let filter = "Need | "
+const pages = await dv.pages()
+let list = []
+
+for (let items of pages) {
+	list.push('option(' + items.file.name + ')')
+}
+
+// This is the Mermaid configuration.
+const codeblock = "INPUT[suggester(";
+const backticks = "`";
+
+console.log(`${filter}${backticks}${codeblock}${list}):needs]${backticks}`);
+
+await dv.paragraph(`${filter}${backticks}${codeblock}${list}):needs]${backticks}`);
+```
+
+```dataviewjs
+const setFilter = "" ;
+let filter = "Need | "
+const pages = await dv.pages()
+let list = []
+
+for (let items of pages) {
+	list.push('option(' + items.file.name + ')')
+}
+
+// This is the Mermaid configuration.
+const codeblock = "INPUT[text:text]";
+const backticks = "`";
+
+console.log(`${filter}${backticks}${codeblock}${backticks}`);
+
+await dv.paragraph(`${filter}${backticks}${codeblock}${backticks}`);
+```

exampleVault/examples.md

@@ -1,5 +1,5 @@
 ---
-slider1: 5
+slider1: 6
 suggest: test
 toggle1: false
 Domestic_tasks:

exampleVault/other note.md

@@ -1,11 +1,12 @@
 ---
 tags: test
-title: test
+title: test test
 select: option b
-date: Tuesday, January 10th 2023
+date: Thursday, July 20th 2023
 time: 19:20
 multi-select:
   - option a
+  - option b
   - option c
 ---
 

src/inputFields/AbstractInputField.ts

@@ -1,51 +1,61 @@
 import { InputFieldMDRC } from '../renderChildren/InputFieldMDRC';
+import { MBExtendedLiteral } from '../utils/Utils';
+import { ComputedSignal } from '../utils/Signal';
 
-export abstract class AbstractInputField {
-	static allowBlock: boolean = true;
-	static allowInline: boolean = true;
+export type GetInputFieldType<T extends AbstractInputField<any>> = T extends AbstractInputField<infer R> ? R : unknown;
+
+export abstract class AbstractInputField<T extends MBExtendedLiteral> {
 	renderChild: InputFieldMDRC;
-	onValueChange: (value: any) => void | Promise<void>;
+	filteredWriteSignal: ComputedSignal<MBExtendedLiteral | undefined, T>;
+	onValueChange: (value: T | undefined) => void;
 
 	constructor(inputFieldMDRC: InputFieldMDRC) {
 		this.renderChild = inputFieldMDRC;
 
-		this.onValueChange = (value: any): void => {
+		this.onValueChange = (value: T | undefined) => {
 			console.debug(`meta-bind | input field on value change`, value);
 			this.renderChild.readSignal.set(value);
 		};
 
-		this.renderChild.writeSignal.registerListener({
-			callback: (value: any) => {
+		this.filteredWriteSignal = new ComputedSignal<MBExtendedLiteral | undefined, T>(this.renderChild.writeSignal, (value: MBExtendedLiteral | undefined) => {
+			return this.filterValue(value);
+		});
+
+		this.filteredWriteSignal.registerListener({
+			callback: (value: T): void => {
 				if (!this.isEqualValue(value)) {
-					this.setValue(value);
+					this.updateDisplayValue(value);
 				}
 			},
 		});
 	}
 
+	getInitialValue(): T {
+		return this.filteredWriteSignal.get();
+	}
+
+	isEqualValue(value: T | undefined): boolean {
+		return this.getValue() === value;
+	}
+
 	/**
 	 * Returns the current content of the input field
 	 */
-	abstract getValue(): any;
+	abstract getValue(): T | undefined;
 
 	/**
-	 * Sets the value on this input field, overriding the current content
+	 * Maps an extended literal to the value for the input field
 	 *
 	 * @param value
 	 */
-	abstract setValue(value: any): void;
+	abstract filterValue(value: MBExtendedLiteral | undefined): T;
 
-	/**
-	 * Checks if the value is the same as the value of this input field
-	 *
-	 * @param value
-	 */
-	abstract isEqualValue(value: any): boolean;
+	abstract updateDisplayValue(value: T): void;
 
 	/**
 	 * Returns the default value of this input field
 	 */
-	abstract getDefaultValue(): any;
+	abstract getDefaultValue(): T;
 
 	/**
 	 * Returns the HTML element this input field is wrapped in