diff --git a/TEMPLATING_CONTEXT_OPTIONS.md b/TEMPLATING_CONTEXT_OPTIONS.md
new file mode 100644
index 000000000..e1ceebc3c
--- /dev/null
+++ b/TEMPLATING_CONTEXT_OPTIONS.md
@@ -0,0 +1,101 @@
+# Options for Providing Templating Context to TemplateJS Blocks
+
+## Current Architecture
+
+### How np.Templating Creates Render Context
+
+1. **`TemplatingEngine.getRenderDataWithMethods()`** - Main function that builds context
+   - Creates module instances: `date`, `time`, `note`, `tasks`, `frontmatter`, `helpers`, `web`, `utility`, `system`
+   - Merges globals from `loadGlobalHelpers()` (which loads from `globals.js`)
+   - Merges userData
+   - Adds prompt error handlers
+   - Applies custom plugin modules
+   - Returns full renderData object
+
+2. **`loadGlobalHelpers()`** - Adds globals to sessionData.methods
+   - Loads from `globals.js` (moment, affirmation, advice, etc.)
+   - Not exported (private function)
+
+3. **Dependencies:**
+   - `TemplatingEngine` needs `templateConfig` (from settings)
+   - Module constructors need `templateConfig` for initialization
+   - Custom plugin modules are registered per instance
+
+## Options
+
+### Option 1: Import and Create Minimal Context (Recommended)
+**Pros:**
+- Reuses templating code (globals, modules)
+- No changes to np.Templating
+- Full access to all templating features
+
+**Cons:**
+- Need to import module classes and create instances
+- Need templateConfig (can duplicate minimal config or get via command)
+- Some complexity in setup
+
+**Implementation:**
+```javascript
+// Import what we can
+import TemplatingEngine from '../../np.Templating/lib/TemplatingEngine'
+import globals from '../../np.Templating/lib/globals'
+// Or get templateConfig via invokePluginCommandByName if available
+// Create minimal TemplatingEngine instance
+const engine = new TemplatingEngine(templateConfig, '', [])
+const renderContext = await engine.getRenderDataWithMethods('', context)
+// Use renderContext in Function constructor
+```
+
+### Option 2: Add New Command to np.Templating
+**Pros:**
+- Clean API
+- No duplication
+- Always uses latest templating logic
+
+**Cons:**
+- Requires editing np.Templating (user said not to)
+- Adds new command to maintain
+
+**Implementation:**
+```javascript
+// In np.Templating, add:
+export async function getRenderContext(userData: any = {}): Promise<Object> {
+  await NPTemplating.setup()
+  const engine = new TemplatingEngine(NPTemplating.templateConfig, '', [])
+  return await engine.getRenderDataWithMethods('', userData)
+}
+
+// In Forms:
+const renderContext = await DataStore.invokePluginCommandByName('getRenderContext', 'np.Templating', [context])
+```
+
+### Option 3: Duplicate Context Building Logic
+**Pros:**
+- No dependencies on np.Templating internals
+- Full control
+
+**Cons:**
+- Lots of code to duplicate (~100+ lines)
+- Must keep in sync with templating changes
+- Risk of divergence
+
+### Option 4: Use render() with JSON Wrapper (What We Tried)
+**Pros:**
+- Uses full templating system
+- No duplication
+
+**Cons:**
+- Returns strings, need to parse JSON
+- More complex error handling
+- Performance overhead of full render pipeline
+
+## Recommendation
+
+**Option 1** - Import and create minimal context:
+1. Import `TemplatingEngine` and `globals` directly
+2. Get or create minimal `templateConfig` (can duplicate minimal config)
+3. Create `TemplatingEngine` instance
+4. Call `getRenderDataWithMethods()` to get full context
+5. Merge into Function constructor parameters
+
+This reuses the templating code without requiring changes to np.Templating.
diff --git a/dwertheimer.Forms/CHANGELOG.md b/dwertheimer.Forms/CHANGELOG.md
index c602f6b2d..49996a1d8 100644
--- a/dwertheimer.Forms/CHANGELOG.md
+++ b/dwertheimer.Forms/CHANGELOG.md
@@ -4,6 +4,46 @@
 
 See Plugin [README](https://github.com/NotePlan/plugins/blob/main/dwertheimer.Forms/README.md) for details on available commands and use case.
 
+## [1.0.10] 2026-01-14 @dwertheimer
+
+### Added
+- **Comprehensive Tailwind CSS color palette support**: Added full Tailwind color mapping (gray, red, orange, yellow, green, blue, indigo, purple, pink with shades 50-950) to `helpers/colors.js`
+- **Color support for chooser icons and descriptions**: NoteChooser and SpaceChooser now display colored icons and short descriptions matching `chooseNoteV2` behavior
+- **New `getColorStyle()` helper function**: Centralized color conversion utility that handles CSS variables, Tailwind color names, and direct hex/rgb colors with proper fallbacks
+
+### Fixed
+- Fixed empty label showing "?" in read-only text elements (now shows empty string)
+- Fixed SpaceChooser using incorrect icons - now uses `fa-regular fa-cube` for teamspaces and `fa-solid fa-user` for private (matching Dashboard, Filer, NoteHelpers)
+- Fixed teamspace colors appearing gray - now correctly displays green using `--teamspace-color` CSS variable with proper fallback
+- Fixed default comment field not appearing when creating a new form - now explicitly passes `isNewForm: true` to FormBuilder (works for both command bar and FormBrowserView creation)
+- Fixed NoteChooser calendar picker displaying filename (e.g., "20260117.md") instead of ISO date format (e.g., "2026-01-17") - now displays ISO 8601 format (YYYY-MM-DD) in the field
+
+### Changed
+- **SpaceChooser**: Updated to use proper Font Awesome icon classes (`TEAMSPACE_FA_ICON`, `PRIVATE_FA_ICON`) instead of generic icon names
+- **Color system**: All Tailwind color names (e.g., `gray-500`, `blue-500`, `orange-500`, `green-700`) now automatically convert to their hex values via comprehensive palette mapping
+- **Special color mappings**: `green-700` and `green-800` prefer `--teamspace-color` CSS variable when available, with Tailwind hex fallback
+- **SearchableChooser**: Hide short description when it's identical to the label text to avoid redundant display
+
+## [1.0.9] 2026-01-13 @dwertheimer
+
+### Added
+- Auto-focus first field when form opens for faster data entry
+- Enter key reopens dropdown when closed (allows changing selection after initial choice)
+- Tab key closes dropdown and moves to next field when dropdown is open
+- ResizeObserver for portal dropdown positioning to handle dynamic form height changes
+
+### Fixed
+- Fixed click selection not working after programmatic refocus (dropdown was reopening immediately)
+- Fixed tab navigation blocked when dropdown is open
+- Fixed portal dropdown position when form layout shifts due to async data loading
+- Fixed ContainedMultiSelectChooser preventing "is:checked" from being saved as a value
+- Fixed bottom element clipping in scrolling dialogs (added extra padding)
+
+### Changed
+- Improved ContainedMultiSelectChooser header: narrower filter field (40% reduction), icon-only buttons (All/None/Filter/New)
+- Refactored template-form CSS to use nested namespace selectors for better maintainability
+- Improved compact mode label alignment using CSS variables for customizable widths
+
 ## [1.0.8] 2026-01-12 @dwertheimer
 
 ### Fixed
diff --git a/dwertheimer.Forms/plugin.json b/dwertheimer.Forms/plugin.json
index 734cb9252..1b4afcb41 100644
--- a/dwertheimer.Forms/plugin.json
+++ b/dwertheimer.Forms/plugin.json
@@ -3,11 +3,11 @@
   "macOS.minVersion": "10.13.0",
   "noteplan.minAppVersion": "3.4.0",
   "plugin.id": "dwertheimer.Forms",
-  "plugin.name": "📝 Forms",
-  "plugin.version": "1.0.5",
+  "plugin.name": "📝 Template Forms",
+  "plugin.version": "1.0.10",
   "plugin.releaseStatus": "beta",
-  "plugin.lastUpdateInfo": "Added folder-chooser and note-chooser field types with smart path truncation",
-  "plugin.description": "Dynamic Forms for NotePlan using Templating -- fill out a form and have the data sent to a template for processing",
+  "plugin.lastUpdateInfo": "Improved form UX: auto-focus, tab navigation, and chooser controls",
+  "plugin.description": "Dynamic Forms for NotePlan using Templating -- fill out a multi-field form and have the data sent to a template for processing",
   "plugin.author": "dwertheimer",
   "plugin.requiredFiles": ["react.c.FormView.bundle.dev.js", "react.c.FormBuilderView.bundle.dev.js", "react.c.FormBrowserView.bundle.dev.js"],
   "plugin.dependsOn": [],
diff --git a/dwertheimer.Forms/src/NPTemplateForm.js b/dwertheimer.Forms/src/NPTemplateForm.js
index 73054a74f..547e4455d 100644
--- a/dwertheimer.Forms/src/NPTemplateForm.js
+++ b/dwertheimer.Forms/src/NPTemplateForm.js
@@ -272,16 +272,22 @@ export async function openTemplateForm(templateTitle?: string): Promise<void> {
     // These contain template tags that reference form field values and should not be processed during form opening
     if (templateNote) {
       if (templateNote) {
+        // Remove customCSS from frontmatter (it should only come from codeblock)
+        delete frontmatterAttributes.customCSS
+
         // Load templateBody from codeblock
         const templateBodyFromCodeblock = await loadTemplateBodyFromTemplate(templateNote)
         if (templateBodyFromCodeblock) {
           frontmatterAttributes.templateBody = templateBodyFromCodeblock
         }
 
-        // Load custom CSS from codeblock
+        // Load custom CSS from codeblock (always use codeblock, not frontmatter)
         const customCSSFromCodeblock = await loadCustomCSSFromTemplate(templateNote)
         if (customCSSFromCodeblock) {
           frontmatterAttributes.customCSS = customCSSFromCodeblock
+        } else {
+          // Ensure it's empty if codeblock doesn't exist
+          frontmatterAttributes.customCSS = ''
         }
 
         // Load TemplateRunner args from codeblock
@@ -362,6 +368,7 @@ export async function openFormBuilder(templateTitle?: string): Promise<void> {
     let selectedTemplate
     let formFields: Array<Object> = []
     let templateNote = null
+    let isNewForm = false // Track if this is a newly created form
     const receivingTemplateTitle: string = '' // Track receiving template title for newly created forms
 
     if (templateTitle?.trim().length) {
@@ -521,6 +528,7 @@ export async function openFormBuilder(templateTitle?: string): Promise<void> {
         }
 
         selectedTemplate = filename
+        isNewForm = true // Mark this as a new form so default comment field is added
         logDebug(pluginJson, `openFormBuilder: Set frontmatter and selectedTemplate = ${selectedTemplate}, receivingTemplateTitle = "${receivingTemplateTitle}"`)
 
         // Generate processing template link if receiving template exists
@@ -731,6 +739,7 @@ export async function openFormBuilder(templateTitle?: string): Promise<void> {
       templateFilename: selectedTemplate,
       templateTitle: templateNote?.title || '',
       initialReceivingTemplateTitle: initialReceivingTemplateTitle,
+      isNewForm: isNewForm, // Pass isNewForm flag so default comment field is added
     })
     logDebug(pluginJson, `openFormBuilder: openFormBuilderWindow call completed`)
   } catch (error) {
diff --git a/dwertheimer.Forms/src/components/FieldEditor.jsx b/dwertheimer.Forms/src/components/FieldEditor.jsx
index d907b7819..426e1922c 100644
--- a/dwertheimer.Forms/src/components/FieldEditor.jsx
+++ b/dwertheimer.Forms/src/components/FieldEditor.jsx
@@ -27,6 +27,16 @@ function isValidCSSWidth(value: string): boolean {
   return cssWidthRegex.test(value.trim())
 }
 
+/**
+ * Check if a field type is NOT in the excluded types array
+ * @param {string} fieldType - The field type to check
+ * @param {Array<string>} excludedTypes - Array of field types to exclude
+ * @returns {boolean} - True if field type is NOT in excluded types
+ */
+function shouldDisplayFieldType(fieldType: string, excludedTypes: Array<string>): boolean {
+  return !excludedTypes.some((excludedType) => fieldType === excludedType)
+}
+
 export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlugin }: FieldEditorProps): Node {
   const [editedField, setEditedField] = useState<TSettingItem>({ ...field })
   const [calendars, setCalendars] = useState<Array<string>>([])
@@ -37,6 +47,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
   const reminderListsLoadingRef = useRef<boolean>(false)
   const requestFromPluginRef = useRef<typeof requestFromPlugin>(requestFromPlugin)
   const [widthError, setWidthError] = useState<string>('')
+  const [templateJSError, setTemplateJSError] = useState<string>('')
 
   // Track previous field key to detect actual field changes
   const prevFieldKeyRef = useRef<string | void>(field.key)
@@ -198,7 +209,8 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
     onSave(editedField)
   }
 
-  const needsKey = editedField.type !== 'separator' && editedField.type !== 'heading' && editedField.type !== 'autosave' && editedField.type !== 'table-of-contents'
+  // templatejs-block fields don't need keys - they're auto-generated at execution time
+  const needsKey = shouldDisplayFieldType(editedField.type, ['separator', 'heading', 'autosave', 'table-of-contents', 'comment', 'templatejs-block'])
 
   // Construct header title with label, key, and type
   const headerTitle = needsKey && editedField.key ? `Editing ${editedField.type}: ${editedField.label || ''} (${editedField.key})` : `Editing: ${editedField.type}`
@@ -237,7 +249,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
             </div>
           )}
 
-          {editedField.type !== 'separator' && editedField.type !== 'heading' && editedField.type !== 'table-of-contents' && editedField.type !== 'calendarpicker' && editedField.type !== 'autosave' && (
+          {shouldDisplayFieldType(editedField.type, ['separator', 'heading', 'table-of-contents', 'calendarpicker', 'autosave', 'comment']) && (
             <div className="field-editor-row">
               <label>
                 <input type="checkbox" checked={editedField.compactDisplay || false} onChange={(e) => updateField({ compactDisplay: e.target.checked })} />
@@ -259,6 +271,31 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                 type="text"
                 value={((editedField: any): { width?: string }).width || ''}
                 onChange={(e) => {
+                  const rawValue = e.target.value
+                  const widthValue = rawValue.trim()
+                  const updated = { ...editedField }
+                  if (widthValue === '') {
+                    delete (updated: any).width
+                    setWidthError('')
+                  } else {
+                    // Always save the raw value while typing (allows partial/invalid values during typing)
+                    ;(updated: any).width = rawValue
+                    // Only validate if the trimmed value is complete (has a valid CSS unit or is a valid calc())
+                    // This allows typing intermediate values like "80", "80v", "calc(" without errors
+                    if (isValidCSSWidth(widthValue)) {
+                      // Valid complete value - trim and save trimmed version
+                      ;(updated: any).width = widthValue
+                      setWidthError('')
+                    } else {
+                      // Invalid or incomplete - keep raw value for typing, but don't show error yet
+                      // Error will be shown on blur if still invalid
+                      setWidthError('')
+                    }
+                  }
+                  setEditedField(updated)
+                }}
+                onBlur={(e) => {
+                  // Validate on blur when user is done typing
                   const widthValue = e.target.value.trim()
                   const updated = { ...editedField }
                   if (widthValue === '') {
@@ -268,6 +305,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                     ;(updated: any).width = widthValue
                     setWidthError('')
                   } else {
+                    ;(updated: any).width = widthValue
                     setWidthError('Invalid CSS width value. Use px, %, em, rem, vw, vh, or calc()')
                   }
                   setEditedField(updated)
@@ -288,12 +326,19 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
             </div>
           )}
 
-          {editedField.type !== 'separator' && (
+          {shouldDisplayFieldType(editedField.type, ['separator', 'comment']) && (
             <div className="field-editor-row">
               <label>Description (help text):</label>
               <textarea
                 value={editedField.description || ''}
                 onChange={(e) => updateField({ description: e.target.value })}
+                onKeyDown={(e) => {
+                  // Stop Enter key from bubbling to prevent any form submission
+                  if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                    e.stopPropagation()
+                    // Don't prevent default - let textarea handle Enter naturally
+                  }
+                }}
                 placeholder="Help text shown below the field"
                 rows={2}
               />
@@ -333,7 +378,19 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
             <>
               <div className="field-editor-row">
                 <label>Default Value:</label>
-                <textarea value={editedField.default || ''} onChange={(e) => updateField({ default: e.target.value })} placeholder="Default value (multi-line)" rows={3} />
+                <textarea
+                  value={editedField.default || ''}
+                  onChange={(e) => updateField({ default: e.target.value })}
+                  onKeyDown={(e) => {
+                    // Stop Enter key from bubbling to prevent any form submission
+                    if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                      e.stopPropagation()
+                      // Don't prevent default - let textarea handle Enter naturally
+                    }
+                  }}
+                  placeholder="Default value (multi-line)"
+                  rows={3}
+                />
               </div>
               <div className="field-editor-row">
                 <label>
@@ -361,14 +418,46 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                 <textarea
                   value={((editedField: any): { templateJSContent?: string }).templateJSContent || ''}
                   onChange={(e) => {
-                    updateField((({ templateJSContent: e.target.value }: any): Partial<TSettingItem>))
+                    const newValue = e.target.value
+                    // Check for illegal backticks (```) - these are not allowed in templatejs blocks
+                    if (newValue.includes('```')) {
+                      // Remove backticks and show error
+                      const cleanedValue = newValue.replace(/```/g, '')
+                      updateField((({ templateJSContent: cleanedValue }: any): Partial<TSettingItem>))
+                      // Show error message
+                      setTemplateJSError('Backticks (```) are not allowed in TemplateJS blocks. They have been removed.')
+                      // Clear error after 3 seconds
+                      setTimeout(() => setTemplateJSError(''), 3000)
+                    } else {
+                      updateField((({ templateJSContent: newValue }: any): Partial<TSettingItem>))
+                      // Clear any previous error
+                      if (templateJSError) setTemplateJSError('')
+                    }
+                  }}
+                  onKeyDown={(e) => {
+                    // Stop Enter key from bubbling to prevent any form submission
+                    if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                      e.stopPropagation()
+                      // Don't prevent default - let textarea handle Enter naturally
+                    }
                   }}
                   placeholder="// Enter JavaScript to run for this form"
                   rows={10}
-                  style={{ width: '100%', fontFamily: 'Menlo, monospace' }}
+                  style={{ width: '100%', fontFamily: 'Menlo, monospace', borderColor: templateJSError ? 'red' : undefined }}
                 />
+                {templateJSError && <div style={{ color: 'red', fontSize: '0.9rem', marginTop: '0.25rem' }}>{templateJSError}</div>}
                 <div className="field-editor-help">
-                  Enter without the backticks.Stored as plain text in the form definition. The form executor will wrap it in a <code>templateJS</code> code block at runtime.
+                  Enter without the backticks. Stored as plain text in the form definition.
+                  <br />
+                  <strong>Important:</strong> To set variables, your code must <strong>return an object</strong>. The returned object will be merged into the template context,
+                  making all its properties available to the template and later templatejs blocks.
+                  <br />
+                  Example:{' '}
+                  <code>
+                    return {'{'} bgColor: &apos;blue-50&apos;, iconColor: &apos;blue-500&apos; {'}'};
+                  </code>
+                  <br />
+                  All form field values are available as variables in your code. Blocks execute top-to-bottom, so later blocks can use values from earlier blocks.
                 </div>
               </div>
               <div className="field-editor-row">
@@ -462,7 +551,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
 
           {editedField.type === 'calendarpicker' && (
             <>
-              {editedField.type !== 'separator' && editedField.type !== 'heading' && (
+              {shouldDisplayFieldType(editedField.type, ['separator', 'heading']) && (
                 <div className="field-editor-row">
                   <label>
                     <input type="checkbox" checked={editedField.compactDisplay || false} onChange={(e) => updateField({ compactDisplay: e.target.checked })} />
@@ -1076,6 +1165,13 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                       .filter((h) => h.length > 0)
                     setEditedField(updated)
                   }}
+                  onKeyDown={(e) => {
+                    // Stop Enter key from bubbling to prevent any form submission
+                    if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                      e.stopPropagation()
+                      // Don't prevent default - let textarea handle Enter naturally
+                    }
+                  }}
                   placeholder="Enter one heading per line&#10;Tasks&#10;Projects&#10;Archive"
                   rows={5}
                 />
@@ -1155,9 +1251,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   }}
                   placeholder="e.g., status, category, priority"
                 />
-                <div className="field-editor-help">
-                  Enter the frontmatter key name (e.g., &quot;status&quot;). Leave empty if using a source field below.
-                </div>
+                <div className="field-editor-help">Enter the frontmatter key name (e.g., &quot;status&quot;). Leave empty if using a source field below.</div>
               </div>
               <div className="field-editor-row">
                 <label>Source Key Field (value dependency, optional):</label>
@@ -1241,7 +1335,9 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   />
                   Choose Single Value
                 </label>
-                <div className="field-editor-help">If checked, allows selecting only one value (no checkboxes, returns single value). Clicking an item or pressing Enter selects it immediately.</div>
+                <div className="field-editor-help">
+                  If checked, allows selecting only one value (no checkboxes, returns single value). Clicking an item or pressing Enter selects it immediately.
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>
@@ -1277,7 +1373,10 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   placeholder="e.g., 5 or 5.5"
                   min="0.1"
                 />
-                <div className="field-editor-help">Limit the height to show only this many result rows (overrides Max Height if provided). Assumes ~40px per row. Decimal values allowed (e.g., 5.5 for finer control).</div>
+                <div className="field-editor-help">
+                  Limit the height to show only this many result rows (overrides Max Height if provided). Assumes ~40px per row. Decimal values allowed (e.g., 5.5 for finer
+                  control).
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>Custom Width (optional):</label>
@@ -1285,8 +1384,33 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   type="text"
                   value={((editedField: any): { width?: string }).width || ''}
                   onChange={(e) => {
+                    const rawValue = e.target.value
+                    const widthValue = rawValue.trim()
                     const updated = { ...editedField }
+                    if (widthValue === '') {
+                      delete (updated: any).width
+                      setWidthError('')
+                    } else {
+                      // Always save the raw value while typing (allows partial/invalid values during typing)
+                      ;(updated: any).width = rawValue
+                      // Only validate if the trimmed value is complete (has a valid CSS unit or is a valid calc())
+                      // This allows typing intermediate values like "80", "80v", "calc(" without errors
+                      if (isValidCSSWidth(widthValue)) {
+                        // Valid complete value - trim and save trimmed version
+                        ;(updated: any).width = widthValue
+                        setWidthError('')
+                      } else {
+                        // Invalid or incomplete - keep raw value for typing, but don't show error yet
+                        // Error will be shown on blur if still invalid
+                        setWidthError('')
+                      }
+                    }
+                    setEditedField(updated)
+                  }}
+                  onBlur={(e) => {
+                    // Validate on blur when user is done typing
                     const widthValue = e.target.value.trim()
+                    const updated = { ...editedField }
                     if (widthValue === '') {
                       delete (updated: any).width
                       setWidthError('')
@@ -1294,6 +1418,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                       ;(updated: any).width = widthValue
                       setWidthError('')
                     } else {
+                      ;(updated: any).width = widthValue
                       setWidthError('Invalid CSS width value. Use px, %, em, rem, vw, vh, or calc()')
                     }
                     setEditedField(updated)
@@ -1306,7 +1431,8 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                     <span style={{ color: 'red' }}>{widthError}</span>
                   ) : (
                     <>
-                      Custom width for the entire control. Overrides default width. Examples: <code>300px</code>, <code>80%</code>, <code>calc(100% - 20px)</code>. Leave empty to use default width.
+                      Custom width for the entire control. Overrides default width. Examples: <code>300px</code>, <code>80%</code>, <code>calc(100% - 20px)</code>. Leave empty to
+                      use default width.
                     </>
                   )}
                 </div>
@@ -1328,7 +1454,10 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   }}
                   placeholder="e.g., 400px"
                 />
-                <div className="field-editor-help">Custom height for the entire control. Overrides Max Height and Max Result Rows. Examples: <code>400px</code>, <code>50vh</code>. Leave empty to use default height.</div>
+                <div className="field-editor-help">
+                  Custom height for the entire control. Overrides Max Height and Max Result Rows. Examples: <code>400px</code>, <code>50vh</code>. Leave empty to use default
+                  height.
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>Include Pattern (regex, optional):</label>
@@ -1431,7 +1560,9 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   />
                   Choose Single Value
                 </label>
-                <div className="field-editor-help">If checked, allows selecting only one value (no checkboxes, returns single value). Clicking an item or pressing Enter selects it immediately.</div>
+                <div className="field-editor-help">
+                  If checked, allows selecting only one value (no checkboxes, returns single value). Clicking an item or pressing Enter selects it immediately.
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>
@@ -1467,7 +1598,10 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   placeholder="e.g., 5 or 5.5"
                   min="0.1"
                 />
-                <div className="field-editor-help">Limit the height to show only this many result rows (overrides Max Height if provided). Assumes ~40px per row. Decimal values allowed (e.g., 5.5 for finer control).</div>
+                <div className="field-editor-help">
+                  Limit the height to show only this many result rows (overrides Max Height if provided). Assumes ~40px per row. Decimal values allowed (e.g., 5.5 for finer
+                  control).
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>Custom Width (optional):</label>
@@ -1475,8 +1609,33 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   type="text"
                   value={((editedField: any): { width?: string }).width || ''}
                   onChange={(e) => {
+                    const rawValue = e.target.value
+                    const widthValue = rawValue.trim()
                     const updated = { ...editedField }
+                    if (widthValue === '') {
+                      delete (updated: any).width
+                      setWidthError('')
+                    } else {
+                      // Always save the raw value while typing (allows partial/invalid values during typing)
+                      ;(updated: any).width = rawValue
+                      // Only validate if the trimmed value is complete (has a valid CSS unit or is a valid calc())
+                      // This allows typing intermediate values like "80", "80v", "calc(" without errors
+                      if (isValidCSSWidth(widthValue)) {
+                        // Valid complete value - trim and save trimmed version
+                        ;(updated: any).width = widthValue
+                        setWidthError('')
+                      } else {
+                        // Invalid or incomplete - keep raw value for typing, but don't show error yet
+                        // Error will be shown on blur if still invalid
+                        setWidthError('')
+                      }
+                    }
+                    setEditedField(updated)
+                  }}
+                  onBlur={(e) => {
+                    // Validate on blur when user is done typing
                     const widthValue = e.target.value.trim()
+                    const updated = { ...editedField }
                     if (widthValue === '') {
                       delete (updated: any).width
                       setWidthError('')
@@ -1484,6 +1643,7 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                       ;(updated: any).width = widthValue
                       setWidthError('')
                     } else {
+                      ;(updated: any).width = widthValue
                       setWidthError('Invalid CSS width value. Use px, %, em, rem, vw, vh, or calc()')
                     }
                     setEditedField(updated)
@@ -1496,7 +1656,8 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                     <span style={{ color: 'red' }}>{widthError}</span>
                   ) : (
                     <>
-                      Custom width for the entire control. Overrides default width. Examples: <code>300px</code>, <code>80%</code>, <code>calc(100% - 20px)</code>. Leave empty to use default width.
+                      Custom width for the entire control. Overrides default width. Examples: <code>300px</code>, <code>80%</code>, <code>calc(100% - 20px)</code>. Leave empty to
+                      use default width.
                     </>
                   )}
                 </div>
@@ -1518,7 +1679,10 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   }}
                   placeholder="e.g., 400px"
                 />
-                <div className="field-editor-help">Custom height for the entire control. Overrides Max Height and Max Result Rows. Examples: <code>400px</code>, <code>50vh</code>. Leave empty to use default height.</div>
+                <div className="field-editor-help">
+                  Custom height for the entire control. Overrides Max Height and Max Result Rows. Examples: <code>400px</code>, <code>50vh</code>. Leave empty to use default
+                  height.
+                </div>
               </div>
               <div className="field-editor-row">
                 <label>Include Pattern (regex, optional):</label>
@@ -1627,7 +1791,8 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                   <option value="field">Note from Another Field</option>
                 </select>
                 <div className="field-editor-help">
-                  Choose how to get the markdown content to display. <strong>Note:</strong> This is a very basic markdown renderer that does not display full NotePlan formatted tasks and items. It's intended for a quick preview, not a faithful rendering.
+                  Choose how to get the markdown content to display. <strong>Note:</strong> This is a very basic markdown renderer that does not display full NotePlan formatted
+                  tasks and items. It&apos;s intended for a quick preview, not a faithful rendering.
                 </div>
               </div>
 
@@ -1664,6 +1829,13 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
                             ;(updated: any).markdownText = e.target.value
                             setEditedField(updated)
                           }}
+                          onKeyDown={(e) => {
+                            // Stop Enter key from bubbling to prevent any form submission
+                            if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                              e.stopPropagation()
+                              // Don't prevent default - let textarea handle Enter naturally
+                            }
+                          }}
                           placeholder="Enter markdown text to display..."
                           rows={10}
                         />
@@ -1749,6 +1921,44 @@ export function FieldEditor({ field, allFields, onSave, onCancel, requestFromPlu
             </>
           )}
 
+          {editedField.type === 'comment' && (
+            <>
+              <div className="field-editor-row">
+                <label>Comment Text (Markdown):</label>
+                <textarea
+                  value={((editedField: any): { commentText?: string }).commentText || ''}
+                  onChange={(e) => {
+                    updateField((({ commentText: e.target.value }: any): Partial<TSettingItem>))
+                  }}
+                  onKeyDown={(e) => {
+                    // Stop Enter key from bubbling to prevent any form submission
+                    if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+                      e.stopPropagation()
+                      // Don't prevent default - let textarea handle Enter naturally
+                    }
+                  }}
+                  placeholder="Enter your comment or notes here (supports markdown)..."
+                  rows={10}
+                  style={{ width: '100%' }}
+                />
+                <div className="field-editor-help">Enter markdown text for your comment. This field is only visible in Form Builder and will not appear in the form output.</div>
+              </div>
+              <div className="field-editor-row">
+                <label>
+                  <input
+                    type="checkbox"
+                    checked={((editedField: any): { expanded?: boolean }).expanded !== false}
+                    onChange={(e) => {
+                      updateField((({ expanded: e.target.checked }: any): Partial<TSettingItem>))
+                    }}
+                  />
+                  Expanded by default
+                </label>
+                <div className="field-editor-help">If checked, the comment will be expanded (showing content) by default in Form Builder. If unchecked, it will be collapsed.</div>
+              </div>
+            </>
+          )}
+
           {editedField.type === 'heading' && (
             <>
               <div className="field-editor-row">
diff --git a/dwertheimer.Forms/src/components/FormBuilder.css b/dwertheimer.Forms/src/components/FormBuilder.css
index 906106afc..b602c5f40 100644
--- a/dwertheimer.Forms/src/components/FormBuilder.css
+++ b/dwertheimer.Forms/src/components/FormBuilder.css
@@ -346,7 +346,7 @@
   position: relative;
   overflow: auto;
   min-height: 0; /* Critical: allows flex child to shrink below content size */
-  max-height: 100%; /* Constrain to parent height */
+  height: 100%; /* Ensure full height in flex container */
 }
 
 /* Warning message when preview is scaled - shown in Form Builder */
@@ -410,6 +410,7 @@
   width: 100% !important;
   min-width: 0 !important;
   max-width: 100% !important;
+  height: 100% !important; /* Fill parent height */
   max-height: 100% !important; /* Constrain dialog to content area */
   box-shadow: none !important;
   border: none !important;
diff --git a/dwertheimer.Forms/src/components/FormBuilder.jsx b/dwertheimer.Forms/src/components/FormBuilder.jsx
index b812a60b6..cee5c49da 100644
--- a/dwertheimer.Forms/src/components/FormBuilder.jsx
+++ b/dwertheimer.Forms/src/components/FormBuilder.jsx
@@ -68,12 +68,35 @@ export function FormBuilder({
 }: FormBuilderProps): Node {
   // Get requestFromPlugin and sendActionToPlugin from context (needed early for useState)
   const { requestFromPlugin, dispatch, pluginData } = useAppContext()
-  
+
   // Get template's teamspace ID and title from pluginData (if form is in a teamspace, preserve that context)
   const templateTeamspaceID = pluginData?.templateTeamspaceID || ''
   const templateTeamspaceTitle = pluginData?.templateTeamspaceTitle || ''
 
-  const [fields, setFields] = useState<Array<TSettingItem>>(initialFields)
+  // Add default comment field for new forms
+  const defaultCommentField: TSettingItem = {
+    type: 'comment',
+    label: 'Getting Started',
+    commentText: `# Welcome to Form Builder
+
+Use this form builder to create your form:
+
+1. **Add Fields**: Click the "+ Add Field" button to add form fields (text inputs, dropdowns, date pickers, etc.)
+2. **Edit Fields**: Click any field to edit its properties (label, key, validation, etc.)
+3. **Reorder Fields**: Drag fields by their grip handle to reorder them
+4. **Preview**: Use the preview pane on the right to see how your form will look
+5. **Settings**: Use the settings panel on the left to configure form behavior and processing options
+
+You can edit or delete this **comment field** by clicking the pencil icon on the right - it's just a note to help you get started (does not appear in the form output)!`,
+    expanded: true,
+  }
+  const [fields, setFields] = useState<Array<TSettingItem>>(() => {
+    // If this is a new form and no initial fields, add default comment field
+    if (isNewForm && (!initialFields || initialFields.length === 0)) {
+      return [defaultCommentField]
+    }
+    return initialFields
+  })
   const [editingIndex, setEditingIndex] = useState<?number>(null)
   const [draggedIndex, setDraggedIndex] = useState<?number>(null)
   const [dragOverIndex, setDragOverIndex] = useState<?number>(null)
@@ -140,13 +163,13 @@ export function FormBuilder({
         mergedFrontmatter[key] = templateRunnerArgs[key]
       }
     })
-    
+
     // If space is not set in templateRunnerArgs and template is in a teamspace, set it as default
     // This ensures forms opened in a teamspace default to that teamspace for creating/loading notes
     if (templateTeamspaceID && !mergedFrontmatter.space) {
       mergedFrontmatter.space = templateTeamspaceID
     }
-    
+
     return mergedFrontmatter
   })
 
@@ -598,10 +621,7 @@ export function FormBuilder({
                 }}
                 style={{ cursor: templateFilename ? 'pointer' : 'default', fontSize: '0.875rem', color: 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))' }}
               >
-                Form:{' '}
-                {templateTeamspaceTitle && (
-                  <i className="fa-regular fa-cube" style={{ marginRight: '0.25rem', color: 'var(--item-icon-color, #1e66f5)' }} />
-                )}
+                Form: {templateTeamspaceTitle && <i className="fa-regular fa-cube" style={{ marginRight: '0.25rem', color: 'var(--item-icon-color, #1e66f5)' }} />}
                 {(() => {
                   const windowTitle = frontmatter.windowTitle || ''
                   const formTitle = frontmatter.formTitle || templateTitle || ''
diff --git a/dwertheimer.Forms/src/components/FormFieldsList.jsx b/dwertheimer.Forms/src/components/FormFieldsList.jsx
index bfef6af54..35ce27362 100644
--- a/dwertheimer.Forms/src/components/FormFieldsList.jsx
+++ b/dwertheimer.Forms/src/components/FormFieldsList.jsx
@@ -3,8 +3,9 @@
 // FormFieldsList Component - Middle column showing list of form fields
 //--------------------------------------------------------------------------
 
-import React, { type Node } from 'react'
+import React, { useState, useEffect, type Node } from 'react'
 import { type TSettingItem } from '@helpers/react/DynamicDialog/DynamicDialog.jsx'
+import { MarkdownPreview } from '@helpers/react/DynamicDialog/MarkdownPreview.jsx'
 
 type FormFieldsListProps = {
   fields: Array<TSettingItem>,
@@ -37,6 +38,40 @@ export function FormFieldsList({
   onDragEnd,
   requestFromPlugin,
 }: FormFieldsListProps): Node {
+  // Track expanded state for comment fields (by index as string)
+  const [expandedComments, setExpandedComments] = useState<{ [key: string]: boolean }>(() => {
+    const initial: { [key: string]: boolean } = {}
+    fields.forEach((field, index) => {
+      if (field.type === 'comment') {
+        // Use field.expanded if set, otherwise default to true
+        const indexStr = String(index)
+        initial[indexStr] = (field: any).expanded !== false
+      }
+    })
+    return initial
+  })
+
+  const toggleComment = (index: number) => {
+    const indexStr = String(index)
+    setExpandedComments((prev) => ({
+      ...prev,
+      [indexStr]: !prev[indexStr],
+    }))
+  }
+
+  // Sync expanded state when fields change (e.g., when comment fields are added/removed)
+  useEffect(() => {
+    const newExpanded: { [key: string]: boolean } = {}
+    fields.forEach((field, index) => {
+      if (field.type === 'comment') {
+        const indexStr = String(index)
+        // Preserve existing state if field still exists, otherwise use field.expanded or default to true
+        newExpanded[indexStr] = expandedComments[indexStr] !== undefined ? expandedComments[indexStr] : (field: any).expanded !== false
+      }
+    })
+    setExpandedComments(newExpanded)
+  }, [fields.length]) // Only update when number of fields changes
+
   return (
     <div className="form-builder-main">
       <div className="form-builder-editor">
@@ -73,12 +108,15 @@ export function FormFieldsList({
               const isDragOver = dragOverIndex === index
               const showDropIndicator = isDragOver && draggedIndex != null && draggedIndex !== index
               const isDraggingDown = draggedIndex != null && typeof draggedIndex === 'number' && draggedIndex < index
+              const isComment = field.type === 'comment'
+              const indexStr = String(index)
+              const isExpanded = expandedComments[indexStr] !== false // Default to true if not set
 
               return (
                 <React.Fragment key={`field-${index}`}>
                   {showDropIndicator && !isDraggingDown && <div className="field-drop-indicator" />}
                   <div
-                    className={`form-field-item ${isDragging ? 'dragging' : ''} ${editingIndex === index ? 'editing' : ''}`}
+                    className={`form-field-item ${isDragging ? 'dragging' : ''} ${editingIndex === index ? 'editing' : ''} ${isComment ? 'comment-field' : ''}`}
                     draggable={true}
                     onDragStart={(e) => onDragStart(e, index)}
                     onDragOver={(e) => onDragOver(e, index)}
@@ -93,30 +131,64 @@ export function FormFieldsList({
                       className="field-content"
                       onClick={() => {
                         // Don't open editor for separator - it has no editable properties
-                        if (field.type !== 'separator') {
+                        // For comment fields, clicking the header toggles expand/collapse
+                        if (isComment) {
+                          toggleComment(index)
+                        } else if (field.type !== 'separator') {
                           onEditField(index)
                         }
                       }}
                       style={{ cursor: field.type === 'separator' ? 'default' : 'pointer' }}
                     >
-                      <div className="field-header">
+                      <div className="field-header" style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+                        {isComment && (
+                          <span
+                            style={{
+                              fontSize: '0.75rem',
+                              transition: 'transform 0.2s',
+                              transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)',
+                              display: 'inline-block',
+                            }}
+                          >
+                            ▶
+                          </span>
+                        )}
                         <span className="field-label-preview">{field.label || field.key || ''}</span>
                         <span className="field-type-badge">{field.type}</span>
                       </div>
-                      {field.description && <div className="field-description-preview">{field.description}</div>}
-                      {field.key && (
+                      {!isComment && field.description && <div className="field-description-preview">{field.description}</div>}
+                      {!isComment && field.key && (
                         <div className="field-key-preview">
                           <code>key: {field.key}</code>
                         </div>
                       )}
+                      {isComment && isExpanded && (field: any).commentText && (
+                        <div style={{ marginTop: '0.5rem', padding: '0.5rem', border: '1px solid var(--divider-color, #CDCFD0)', borderRadius: '4px' }}>
+                          <MarkdownPreview markdownText={(field: any).commentText} requestFromPlugin={requestFromPlugin} compactDisplay={true} />
+                        </div>
+                      )}
                     </div>
                     <div className="field-actions">
                       {field.type !== 'separator' && (
-                        <button className="field-edit-button" onClick={() => onEditField(editingIndex === index ? -1 : index)} title="Edit field">
+                        <button
+                          className="field-edit-button"
+                          onClick={(e) => {
+                            e.stopPropagation()
+                            onEditField(editingIndex === index ? -1 : index)
+                          }}
+                          title="Edit field"
+                        >
                           <i className="fa-solid fa-edit"></i>
                         </button>
                       )}
-                      <button className="field-delete-button" onClick={() => onDeleteField(index)} title="Delete field">
+                      <button
+                        className="field-delete-button"
+                        onClick={(e) => {
+                          e.stopPropagation()
+                          onDeleteField(index)
+                        }}
+                        title="Delete field"
+                      >
                         <i className="fa-solid fa-trash"></i>
                       </button>
                     </div>
diff --git a/dwertheimer.Forms/src/components/FormPreview.jsx b/dwertheimer.Forms/src/components/FormPreview.jsx
index 2eeb44119..eed9f6e7a 100644
--- a/dwertheimer.Forms/src/components/FormPreview.jsx
+++ b/dwertheimer.Forms/src/components/FormPreview.jsx
@@ -391,7 +391,14 @@ export function FormPreview({
               onSave={onSave || (() => {})}
               onCancel={onCancel || (() => {})}
               handleButtonClick={() => {}}
-              style={{ width: '100%', maxWidth: '100%', margin: 0, content: { paddingLeft: '1.5rem', paddingRight: '1.5rem' } }}
+              style={{
+                width: '100%',
+                maxWidth: '100%',
+                margin: 0,
+                content: { paddingLeft: '1.5rem', paddingRight: '1.5rem' },
+                '--template-form-compact-label-width': frontmatter?.compactLabelWidth || undefined,
+                '--template-form-compact-input-width': frontmatter?.compactInputWidth || undefined,
+              }}
               allowEmptySubmit={allowEmptySubmit || frontmatter.allowEmptySubmit || false}
               hideDependentItems={frontmatter.hideDependentItems || false}
               folders={folders}
diff --git a/dwertheimer.Forms/src/components/FormSettings.jsx b/dwertheimer.Forms/src/components/FormSettings.jsx
index 2859f7313..aa54d66db 100644
--- a/dwertheimer.Forms/src/components/FormSettings.jsx
+++ b/dwertheimer.Forms/src/components/FormSettings.jsx
@@ -233,6 +233,67 @@ export function FormSettings({
                     </div>
                   </div>
                 </div>
+                <div className="frontmatter-field frontmatter-field-compact-mode-sizing" style={{ marginTop: '1rem' }}>
+                  <label className="frontmatter-field-label" style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', marginBottom: '0.5rem' }}>
+                    Compact Mode Sizing:
+                    <InfoIcon text="Control the width of labels and input fields in compact mode. Labels are right-aligned and inputs are left-aligned. Use CSS units like '10rem' for labels and '180px' for inputs. Leave empty to use defaults (10rem for labels, 180px for inputs)." />
+                  </label>
+                  <div className="frontmatter-field-compact-mode-sizing-controls" style={{ marginTop: '0.5rem' }}>
+                    <div className="frontmatter-field-compact-mode-sizing-row" style={{ display: 'flex', gap: '0.5rem', alignItems: 'flex-start', flexWrap: 'wrap' }}>
+                      <div className="frontmatter-field-compact-mode-sizing-field frontmatter-field-compact-label-width" style={{ flex: '1 1 0', minWidth: '120px' }}>
+                        <label className="frontmatter-field-compact-mode-sizing-label" style={{ fontSize: '0.85rem', display: 'block', marginBottom: '0.25rem' }}>
+                          Label Width:
+                        </label>
+                        <input
+                          className="frontmatter-field-input frontmatter-field-input-compact-label-width"
+                          type="text"
+                          value={frontmatter.compactLabelWidth || ''}
+                          onChange={(e) => onFrontmatterChange('compactLabelWidth', e.target.value || undefined)}
+                          onBlur={(e) => {
+                            const value = e.target.value.trim()
+                            if (value) {
+                              // Validate CSS width value (rem, em, px, %, vw, vh, or calc())
+                              const cssWidthPattern = /^(\d+(\.\d+)?(rem|em|px|%|vw|vh)|calc\(.+\))$/i
+                              if (!cssWidthPattern.test(value)) {
+                                alert('Label width must be a valid CSS width value (e.g., 10rem, 12em, 150px, 20%, or calc(10rem + 2px)).')
+                                onFrontmatterChange('compactLabelWidth', undefined)
+                              }
+                            }
+                          }}
+                          placeholder="10rem (default)"
+                          style={{ width: '100%', padding: '0.4rem', fontSize: '0.85rem' }}
+                        />
+                      </div>
+                      <div className="frontmatter-field-compact-mode-sizing-field frontmatter-field-compact-input-width" style={{ flex: '1 1 0', minWidth: '120px' }}>
+                        <label className="frontmatter-field-compact-mode-sizing-label" style={{ fontSize: '0.85rem', display: 'block', marginBottom: '0.25rem' }}>
+                          Input Width:
+                        </label>
+                        <input
+                          className="frontmatter-field-input frontmatter-field-input-compact-input-width"
+                          type="text"
+                          value={frontmatter.compactInputWidth || ''}
+                          onChange={(e) => onFrontmatterChange('compactInputWidth', e.target.value || undefined)}
+                          onBlur={(e) => {
+                            const value = e.target.value.trim()
+                            if (value) {
+                              // Validate CSS width value (rem, em, px, %, vw, vh, or calc())
+                              const cssWidthPattern = /^(\d+(\.\d+)?(rem|em|px|%|vw|vh)|calc\(.+\))$/i
+                              if (!cssWidthPattern.test(value)) {
+                                alert('Input width must be a valid CSS width value (e.g., 180px, 12rem, 20%, or calc(180px + 2rem)).')
+                                onFrontmatterChange('compactInputWidth', undefined)
+                              }
+                            }
+                          }}
+                          placeholder="180px (default)"
+                          style={{ width: '100%', padding: '0.4rem', fontSize: '0.85rem' }}
+                        />
+                      </div>
+                    </div>
+                    <div className="frontmatter-field-compact-mode-sizing-help-text" style={{ fontSize: '0.85rem', color: '#666', marginTop: '0.5rem', fontStyle: 'italic' }}>
+                      Use CSS units like '10rem' or '12em' for labels, and '180px' or '200px' for inputs. Labels are right-aligned and inputs are left-aligned in compact mode. Leave empty to use defaults.
+                    </div>
+                  </div>
+                </div>
                 <div className="frontmatter-field frontmatter-field-custom-css" style={{ marginTop: '1rem' }}>
                   <label className="frontmatter-field-label" style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', marginBottom: '0.5rem' }}>
                     Custom CSS:
diff --git a/dwertheimer.Forms/src/components/FormView.css b/dwertheimer.Forms/src/components/FormView.css
index bfa3ad415..94fa1d681 100644
--- a/dwertheimer.Forms/src/components/FormView.css
+++ b/dwertheimer.Forms/src/components/FormView.css
@@ -17,6 +17,173 @@
   transform: translate(-50%, -50%) !important;
   /* Override any conflicting margins */
   margin: 0 !important;
+
+  /* CSS Variables for template form compact mode sizing */
+  /* These can be overridden via inline styles or form-specific CSS */
+  --template-form-compact-label-width: 10rem; /* Default label width - can be overridden */
+  --template-form-compact-input-width: 180px; /* Default input width - can be overridden */
+
+  /* Template Form Specific Styles */
+  & .ui-button-group {
+    justify-content: normal;
+  }
+
+  /* For template forms, ensure all compact labels are right-aligned with consistent width */
+  /* This ensures all labels line up vertically in compact mode */
+  /* Override the min-width: fit-content rule from DynamicDialog.css and SearchableChooser.css */
+  & .input-box-container-compact .input-box-label,
+  & [class*="-chooser-container"].compact [class*="-chooser-label"],
+  & [class*="-chooser-container"].compact label,
+  & [class*="-chooser-label-compact"],
+  & .contained-multi-select-label-compact,
+  & .contained-multi-select-container.compact label,
+  & .searchable-chooser-base.compact [class*="-chooser-label"],
+  & .searchable-chooser-base.compact label,
+  & .searchable-chooser-base.compact > label,
+  & .expandable-textarea-container.compact .expandable-textarea-label,
+  & .autosave-field-container.compact .autosave-field-label {
+    text-align: right !important;
+    min-width: var(--template-form-compact-label-width, 10rem) !important;
+    max-width: var(--template-form-compact-label-width, 10rem) !important;
+    width: var(--template-form-compact-label-width, 10rem) !important;
+    padding-right: 1rem !important;
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    box-sizing: border-box !important;
+    flex-shrink: 0 !important;
+    flex-grow: 0 !important;
+    margin-bottom: 0 !important;
+    align-self: center !important;
+    white-space: nowrap !important;
+    overflow: hidden !important;
+    text-overflow: ellipsis !important;
+    order: -1 !important; /* Ensure labels come first in flex container */
+    display: block !important; /* Override any inline-flex or other display values */
+  }
+
+  /* Ensure the compact container itself uses flex to align labels */
+  /* Also target nested containers to remove all left spacing */
+  & .input-box-container-compact,
+  & [class*="-chooser-container"].compact,
+  & .searchable-chooser-base.compact,
+  & .expandable-textarea-container.compact,
+  & .autosave-field-container.compact,
+  & [class*="-chooser-container"].compact [class*="-chooser-container"].compact,
+  & [class*="-chooser-container"].compact .searchable-chooser-base,
+  & [data-field-type] [class*="-chooser-container"].compact,
+  & [data-field-type] .searchable-chooser-base.compact {
+    display: flex !important;
+    align-items: center !important;
+    gap: 1rem !important;
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  /* Ensure parent containers don't add extra spacing that misaligns labels */
+  & .ui-item,
+  & .dynamic-dialog-item {
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  /* Ensure all compact field containers start at the same horizontal position */
+  /* Target all nested wrapper divs to remove any spacing */
+  & .ui-item > .input-box-container-compact,
+  & .ui-item > [class*="-chooser-container"].compact,
+  & .ui-item > .searchable-chooser-base.compact,
+  & .ui-item > .expandable-textarea-container.compact,
+  & .ui-item > .autosave-field-container.compact,
+  & .ui-item > div > .input-box-container-compact,
+  & .ui-item > div > [class*="-chooser-container"].compact,
+  & .ui-item > div > .searchable-chooser-base.compact,
+  & .ui-item [data-field-type] > [class*="-chooser-container"].compact,
+  & .ui-item [data-field-type] > .searchable-chooser-base.compact,
+  & [class*="-chooser-container"].compact [class*="-chooser-container"].compact,
+  & [class*="-chooser-container"].compact .searchable-chooser-base {
+    margin-left: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  /* Ensure labels are positioned at exactly the same left edge by removing any margin/padding */
+  /* Also ensure any wrapper divs don't add spacing */
+  & .input-box-container-compact .input-box-label,
+  & [class*="-chooser-container"].compact [class*="-chooser-label"],
+  & [class*="-chooser-container"].compact label,
+  & [class*="-chooser-label-compact"],
+  & .contained-multi-select-label-compact,
+  & .contained-multi-select-container.compact label,
+  & .searchable-chooser-base.compact [class*="-chooser-label"],
+  & .searchable-chooser-base.compact label,
+  & .expandable-textarea-container.compact .expandable-textarea-label,
+  & .autosave-field-container.compact .autosave-field-label,
+  & .input-box-container-compact > div:first-child.input-box-label {
+    margin-left: 0 !important;
+    padding-left: 0 !important;
+    margin-right: 0 !important;
+  }
+
+  /* Target nested wrapper divs that contain compact fields - remove all left spacing and ensure consistent bottom spacing */
+  /* Target the outer data-field-type wrapper and its direct children when they contain compact fields */
+  & [data-field-type="dropdown-select"],
+  & [data-field-type="folder-chooser"],
+  & [data-field-type="note-chooser"],
+  & [data-field-type="space-chooser"],
+  & [data-field-type="heading-chooser"],
+  & [data-field-type="event-chooser"],
+  & [data-field-type="tag-chooser"],
+  & [data-field-type="mention-chooser"],
+  & [data-field-type="frontmatter-key-chooser"] {
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+    margin-bottom: 0 !important; /* Ensure consistent spacing - spacing is handled by .dynamic-dialog-item gap */
+  }
+
+  & [data-field-type] > div[class*="-chooser-container"],
+  & [data-field-type] > div[class*="-chooser-container"] > div {
+    padding-left: 0 !important;
+    margin-left: 0 !important;
+    margin-bottom: 0 !important; /* Ensure consistent spacing - spacing is handled by .dynamic-dialog-item gap */
+  }
+
+  /* Ensure all field wrapper divs have consistent spacing */
+  /* Spacing between fields is handled by .dynamic-dialog-content gap, not individual field margins */
+  & .ui-item,
+  & [data-field-type],
+  & .input-box-container,
+  & .input-box-container-compact,
+  & [class*="-chooser-container"],
+  & .searchable-chooser-base,
+  & .folder-chooser-wrapper,
+  & .folder-chooser-wrapper-compact,
+  & .dropdown-select-chooser-container {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  /* Use CSS variable for input field widths in template forms */
+  /* This allows both labels and inputs to align their right edges */
+  /* Cover all field types: InputBox, SearchableChooser, ThemedSelect, ExpandableTextarea, CalendarPicker, AutosaveField */
+  & .input-box-container-compact .input-box-wrapper,
+  & .input-box-container-compact .input-box-input,
+  & [class*="-chooser-container"].compact [class*="-chooser-input-wrapper"],
+  & .searchable-chooser-base.compact [class*="-chooser-input-wrapper"],
+  & .input-box-container-compact .input-box-wrapper > div, /* ThemedSelect react-select container */
+  & .input-box-container-compact .input-box-wrapper .react-select__control,
+  & .expandable-textarea-container.compact .expandable-textarea-input,
+  & .calendarpicker-container.compact .calendarpicker-input-wrapper,
+  & .autosave-field-container.compact .autosave-field-input-wrapper,
+  & .autosave-field-container.compact .autosave-field-input {
+    width: var(--template-form-compact-input-width, 180px) !important;
+    min-width: var(--template-form-compact-input-width, 180px) !important;
+    max-width: var(--template-form-compact-input-width, 180px) !important;
+  }
+
+  /* Override item-description margin-left in compact mode to align with input field values */
+  /* Uses label width (CSS variable) + gap (1rem) to align with the start of input field values */
+  & [data-compact-display="true"] .item-description {
+    margin-left: calc(var(--template-form-compact-label-width, 10rem) + 1rem) !important;
+  }
 }
 
 /* Form View Styles */
@@ -450,4 +617,4 @@
   white-space: pre-wrap;
   word-wrap: break-word;
   overflow-wrap: break-word;
-}
\ No newline at end of file
+}
diff --git a/dwertheimer.Forms/src/components/FormView.jsx b/dwertheimer.Forms/src/components/FormView.jsx
index eed7432d8..e044666ff 100644
--- a/dwertheimer.Forms/src/components/FormView.jsx
+++ b/dwertheimer.Forms/src/components/FormView.jsx
@@ -775,7 +775,11 @@ export function FormView({ data, dispatch, reactSettings, setReactSettings, onSu
               reloadNotes()
             }}
             className="template-form"
-            style={{ content: { paddingLeft: '1.5rem', paddingRight: '1.5rem' } }}
+            style={{
+              content: { paddingLeft: '1.5rem', paddingRight: '1.5rem' },
+              '--template-form-compact-label-width': pluginData?.compactLabelWidth || undefined,
+              '--template-form-compact-input-width': pluginData?.compactInputWidth || undefined,
+            }}
           />
         </div>
         {/* end of replace */}
diff --git a/dwertheimer.Forms/src/components/ProcessingMethodSection.jsx b/dwertheimer.Forms/src/components/ProcessingMethodSection.jsx
index 9b1aff4ea..963afa6c8 100644
--- a/dwertheimer.Forms/src/components/ProcessingMethodSection.jsx
+++ b/dwertheimer.Forms/src/components/ProcessingMethodSection.jsx
@@ -677,12 +677,11 @@ export function ProcessingMethodSection({
                     const trimmedTitle = noteTitle ? noteTitle.trim() : ''
                     logDebug(
                       pluginData,
-                      'ProcessingMethodSection',
-                      `NoteChooser onChange called: noteTitle="${noteTitle}", noteFilename="${noteFilename}", trimmedTitle="${trimmedTitle}"`,
+                      `ProcessingMethodSection: NoteChooser onChange called: noteTitle="${noteTitle}", noteFilename="${noteFilename}", trimmedTitle="${trimmedTitle}"`,
                     )
                     setSelectedProcessingTemplateFilename(noteFilename || '')
                     if (trimmedTitle) {
-                      logDebug(pluginData, 'ProcessingMethodSection', `Setting receivingTemplateTitle to: "${trimmedTitle}"`)
+                      logDebug(pluginData, `ProcessingMethodSection: Setting receivingTemplateTitle to: "${trimmedTitle}"`)
                       onFrontmatterChange('receivingTemplateTitle', trimmedTitle)
                       // Also clear formProcessorTitle if it exists and is different (for backward compatibility cleanup)
                       if (frontmatter.formProcessorTitle && frontmatter.formProcessorTitle !== trimmedTitle) {
@@ -690,7 +689,7 @@ export function ProcessingMethodSection({
                       }
                     } else {
                       // If empty, clear both
-                      logDebug(pluginData, 'ProcessingMethodSection', 'Clearing receivingTemplateTitle')
+                      logDebug(pluginData, 'ProcessingMethodSection: Clearing receivingTemplateTitle')
                       onFrontmatterChange('receivingTemplateTitle', '')
                       if (frontmatter.formProcessorTitle) {
                         onFrontmatterChange('formProcessorTitle', '')
@@ -729,17 +728,75 @@ export function ProcessingMethodSection({
                     try {
                       // If we have a filename, use it; otherwise try to find it from the title
                       let filenameToOpen = selectedProcessingTemplateFilename
-                      if (!filenameToOpen && notes.length > 0) {
-                        const currentTitle = frontmatter.receivingTemplateTitle || frontmatter.formProcessorTitle || ''
-                        const matchingNote = notes.find((note: NoteOption) => note.title === currentTitle)
-                        filenameToOpen = matchingNote?.filename || ''
+                      const currentTitle = frontmatter.receivingTemplateTitle || frontmatter.formProcessorTitle || ''
+
+                      logDebug(
+                        pluginData,
+                        `ProcessingMethodSection: Open button clicked: selectedProcessingTemplateFilename="${selectedProcessingTemplateFilename}", currentTitle="${currentTitle}", notes.length=${notes.length}`,
+                      )
+
+                      // If no filename, try to find it from notes
+                      if (!filenameToOpen && currentTitle) {
+                        // If notes aren't loaded yet, load them directly via requestFromPlugin
+                        // This ensures we have the notes data immediately in this async function
+                        let notesToSearch = notes
+                        if (notes.length === 0) {
+                          logDebug(pluginData, `ProcessingMethodSection: Notes not loaded, loading notes for processing templates via requestFromPlugin...`)
+                          try {
+                            const notesData = await requestFromPlugin('getNotes', {
+                              includePersonalNotes: true,
+                              includeCalendarNotes: false, // Skip calendar notes for processing templates (performance)
+                              includeRelativeNotes: false, // Skip relative notes for processing templates
+                              includeTeamspaceNotes: true,
+                              space: frontmatter.space || '', // Filter by selected space
+                              filterByType: ['forms-processor', 'template-runner'],
+                              includeTemplatesAndForms: true,
+                            })
+                            if (Array.isArray(notesData)) {
+                              notesToSearch = notesData
+                              logDebug(pluginData, `ProcessingMethodSection: Loaded ${notesData.length} notes via requestFromPlugin`)
+                            }
+                          } catch (error) {
+                            logDebug(pluginData, `ProcessingMethodSection: Error loading notes: ${error.message}`)
+                          }
+                        }
+
+                        // Try to find the note in the notes array
+                        if (notesToSearch.length > 0) {
+                          const matchingNote = notesToSearch.find((note: NoteOption) => note.title === currentTitle)
+                          if (matchingNote && matchingNote.filename) {
+                            filenameToOpen = matchingNote.filename
+                            logDebug(pluginData, `ProcessingMethodSection: Found matching note: filename="${matchingNote.filename}"`)
+                          } else {
+                            logDebug(pluginData, `ProcessingMethodSection: No matching note found in ${notesToSearch.length} notes for title="${currentTitle}"`)
+                          }
+                        }
                       }
+
                       if (filenameToOpen) {
+                        logDebug(pluginData, `ProcessingMethodSection: Opening note with filename="${filenameToOpen}"`)
                         await requestFromPlugin('openNote', {
                           filename: filenameToOpen,
                         })
+                      } else if (currentTitle) {
+                        // Fallback: try to open by title directly
+                        logDebug(pluginData, `ProcessingMethodSection: No filename found, trying to open by title: "${currentTitle}"`)
+                        try {
+                          await requestFromPlugin('openNote', {
+                            title: currentTitle,
+                          })
+                        } catch (titleError) {
+                          const errorMsg = `Could not find or open processing template "${currentTitle}". Please select the template again.`
+                          logDebug(pluginData, `ProcessingMethodSection: ${errorMsg}`)
+                          console.error(errorMsg)
+                        }
+                      } else {
+                        const errorMsg = `Could not find filename for processing template. Please select the template again.`
+                        logDebug(pluginData, `ProcessingMethodSection: ${errorMsg}`)
+                        console.error(errorMsg)
                       }
                     } catch (error) {
+                      logDebug(pluginData, `ProcessingMethodSection: Error opening note: ${error.message}`)
                       console.error('openNote: Error opening note:', error)
                     }
                   }}
@@ -763,7 +820,7 @@ export function ProcessingMethodSection({
                     formTemplateTitle: templateTitle,
                     formTemplateFilename: templateFilename,
                   })
-                  console.log('createProcessingTemplate: Received result:', result, 'type:', typeof result, 'JSON:', JSON.stringify(result))
+                  console.log(`createProcessingTemplate: Received result: ${JSON.stringify(result)}, type: ${typeof result}, JSON: ${JSON.stringify(result)}`)
                   let processingTitle = null
                   let processingFilename = null
 
@@ -786,7 +843,7 @@ export function ProcessingMethodSection({
                   }
 
                   if (processingTitle) {
-                    console.log('createProcessingTemplate: Updating receivingTemplateTitle to:', processingTitle, 'filename:', processingFilename)
+                    console.log(`createProcessingTemplate: Updating receivingTemplateTitle to: ${processingTitle}, filename: ${processingFilename || 'null'}`)
                     onFrontmatterChange('receivingTemplateTitle', processingTitle)
                     if (processingFilename) {
                       setSelectedProcessingTemplateFilename(processingFilename)
@@ -794,7 +851,7 @@ export function ProcessingMethodSection({
                     // Reload notes so the new processing template appears in the dropdown
                     await onLoadNotes(true) // Load only project notes for processing templates
                   } else {
-                    console.warn('createProcessingTemplate: Unexpected result format:', result, 'typeof:', typeof result, 'JSON:', JSON.stringify(result))
+                    console.warn(`createProcessingTemplate: Unexpected result format: ${JSON.stringify(result)}, typeof: ${typeof result}, JSON: ${JSON.stringify(result)}`)
                   }
                 } catch (error) {
                   const errorMessage = error?.message || error?.toString() || String(error) || 'Unknown error'
@@ -819,45 +876,47 @@ export function ProcessingMethodSection({
       )}
 
       {/* Debug JSON Viewer */}
-      <div className="frontmatter-field" style={{ marginTop: '2rem', paddingTop: '1rem', borderTop: '1px solid var(--divider-color, #CDCFD0)' }}>
-        <label style={{ fontWeight: 'bold', marginBottom: '0.5rem' }}>Debug: Frontmatter Values (JSON)</label>
-        <div
-          style={{
-            backgroundColor: 'var(--bg-alt-color, #f5f5f5)',
-            border: '1px solid var(--divider-color, #CDCFD0)',
-            borderRadius: '4px',
-            padding: '0.75rem',
-            fontFamily: 'Menlo, monospace',
-            fontSize: '0.8em',
-            maxHeight: '300px',
-            overflowY: 'auto',
-            whiteSpace: 'pre-wrap',
-            wordBreak: 'break-word',
-          }}
-        >
-          {JSON.stringify(
-            {
-              processingMethod: frontmatter.processingMethod,
-              shouldOpenInEditor: frontmatter.shouldOpenInEditor,
-              getNoteTitled: frontmatter.getNoteTitled,
-              getNoteFilename: frontmatter.getNoteFilename,
-              location: frontmatter.location,
-              writeUnderHeading: frontmatter.writeUnderHeading,
-              replaceNoteContents: frontmatter.replaceNoteContents,
-              createMissingHeading: frontmatter.createMissingHeading,
-              newNoteTitle: frontmatter.newNoteTitle,
-              newNoteFolder: frontmatter.newNoteFolder,
-              templateBody: frontmatter.templateBody,
-              receivingTemplateTitle: frontmatter.receivingTemplateTitle,
-            },
-            null,
-            2,
-          )}
-        </div>
-        <div style={{ fontSize: '0.85rem', color: '#666', marginTop: '0.25rem', fontStyle: 'italic' }}>
-          Current frontmatter values for debugging. This shows what will be saved.
+      {false && (
+        <div className="frontmatter-field" style={{ marginTop: '2rem', paddingTop: '1rem', borderTop: '1px solid var(--divider-color, #CDCFD0)' }}>
+          <label style={{ fontWeight: 'bold', marginBottom: '0.5rem' }}>Debug: Frontmatter Values (JSON)</label>
+          <div
+            style={{
+              backgroundColor: 'var(--bg-alt-color, #f5f5f5)',
+              border: '1px solid var(--divider-color, #CDCFD0)',
+              borderRadius: '4px',
+              padding: '0.75rem',
+              fontFamily: 'Menlo, monospace',
+              fontSize: '0.8em',
+              maxHeight: '300px',
+              overflowY: 'auto',
+              whiteSpace: 'pre-wrap',
+              wordBreak: 'break-word',
+            }}
+          >
+            {JSON.stringify(
+              {
+                processingMethod: frontmatter.processingMethod,
+                shouldOpenInEditor: frontmatter.shouldOpenInEditor,
+                getNoteTitled: frontmatter.getNoteTitled,
+                getNoteFilename: frontmatter.getNoteFilename,
+                location: frontmatter.location,
+                writeUnderHeading: frontmatter.writeUnderHeading,
+                replaceNoteContents: frontmatter.replaceNoteContents,
+                createMissingHeading: frontmatter.createMissingHeading,
+                newNoteTitle: frontmatter.newNoteTitle,
+                newNoteFolder: frontmatter.newNoteFolder,
+                templateBody: frontmatter.templateBody,
+                receivingTemplateTitle: frontmatter.receivingTemplateTitle,
+              },
+              null,
+              2,
+            )}
+          </div>
+          <div style={{ fontSize: '0.85rem', color: '#666', marginTop: '0.25rem', fontStyle: 'italic' }}>
+            Current frontmatter values for debugging. This shows what will be saved.
+          </div>
         </div>
-      </div>
+      )}
 
       {/* Template Tag Inserter Modal */}
       {showTagInserter && (
diff --git a/dwertheimer.Forms/src/components/fieldTypes.js b/dwertheimer.Forms/src/components/fieldTypes.js
index 7617f81c4..d4a757d13 100644
--- a/dwertheimer.Forms/src/components/fieldTypes.js
+++ b/dwertheimer.Forms/src/components/fieldTypes.js
@@ -40,4 +40,5 @@ export const FIELD_TYPES: Array<FieldTypeOption> = [
   { value: 'templatejs-block', label: 'TemplateJS Block', description: 'JavaScript code block that executes during template processing' },
   { value: 'autosave', label: 'Autosave', description: 'Automatically saves form state periodically (shows "Saved x ago" status)' },
   { value: 'table-of-contents', label: 'Table of Contents', description: 'Clickable table of contents that links to headings in the form' },
+  { value: 'comment', label: 'Comment', description: 'Comment/note field for Form Builder only - doesn\'t render in form output. Use for notes to yourself while building forms.' },
 ]
diff --git a/dwertheimer.Forms/src/formBrowserHandlers.js b/dwertheimer.Forms/src/formBrowserHandlers.js
index f62715d31..8ccdc0d04 100644
--- a/dwertheimer.Forms/src/formBrowserHandlers.js
+++ b/dwertheimer.Forms/src/formBrowserHandlers.js
@@ -471,11 +471,12 @@ export async function handleCreateNewForm(params: { formName?: string, space?: s
     // Update cache to ensure note is available
     DataStore.updateCache(templateNote, true)
 
-    // Open FormBuilder with the new form
+    // Open FormBuilder with the new form (pass isNewForm: true so default comment field is added)
     await openFormBuilderWindow({
       formFields: [],
       templateFilename: filename,
       templateTitle: newTitle,
+      isNewForm: true,
     })
 
     return {
diff --git a/dwertheimer.Forms/src/formBuilderHandlers.js b/dwertheimer.Forms/src/formBuilderHandlers.js
index 23f91c872..1f61aa739 100644
--- a/dwertheimer.Forms/src/formBuilderHandlers.js
+++ b/dwertheimer.Forms/src/formBuilderHandlers.js
@@ -21,7 +21,7 @@ import {
   updateReceivingTemplateWithFields,
 } from './templateIO'
 import { removeEmptyLinesFromNote, updateFormLinksInNote } from './requestHandlers'
-import { getNoteByFilename } from '@helpers/note'
+import { getNoteByFilename, getNote } from '@helpers/note'
 import { focusHTMLWindowIfAvailable } from '@helpers/NPWindows'
 import { updateFrontMatterVars, ensureFrontmatter, endOfFrontmatterLineIndex } from '@helpers/NPFrontMatter'
 import { saveCodeBlockToNote, loadCodeBlockFromNote } from '@helpers/codeBlocks'
@@ -91,28 +91,55 @@ export async function handleCreateProcessingTemplate(params: Object): Promise<Re
 /**
  * Handle opening a note from FormBuilder
  * @param {Object} params - Request parameters
- * @param {string} params.filename - The note filename to open
+ * @param {string} params.filename - The note filename to open (preferred)
+ * @param {string} params.title - The note title to open (fallback if filename not provided)
  * @returns {RequestResponse}
  */
-export function handleOpenNote(params: { filename?: string }): RequestResponse {
+export async function handleOpenNote(params: { filename?: string, title?: string }): Promise<RequestResponse> {
   try {
     const filename = params.filename
-    if (!filename) {
+    const title = params.title
+
+    if (!filename && !title) {
       return {
         success: false,
-        message: 'filename is required',
+        message: 'filename or title is required',
         data: null,
       }
     }
 
-    logDebug(pluginJson, `handleOpenNote: filename="${filename}"`)
-
-    // Open the note in the editor
-    Editor.openNoteByFilename(filename)
+    if (filename) {
+      logDebug(pluginJson, `handleOpenNote: Opening by filename="${filename}"`)
+      // Open the note in the editor
+      Editor.openNoteByFilename(filename)
+      return {
+        success: true,
+        message: 'Note opened successfully',
+        data: null,
+      }
+    } else if (title) {
+      logDebug(pluginJson, `handleOpenNote: Opening by title="${title}"`)
+      // Find note by title using getNote helper
+      const note = await getNote(title)
+      if (!note) {
+        return {
+          success: false,
+          message: `Note not found: ${title}`,
+          data: null,
+        }
+      }
+      // Open the note in the editor
+      Editor.openNoteByFilename(note.filename || '')
+      return {
+        success: true,
+        message: 'Note opened successfully',
+        data: null,
+      }
+    }
 
     return {
-      success: true,
-      message: 'Note opened successfully',
+      success: false,
+      message: 'No filename or title provided',
       data: null,
     }
   } catch (error) {
@@ -465,23 +492,22 @@ export async function saveFrontmatterToTemplate(templateFilename: string, frontm
  * @returns {Promise<{success: boolean, message?: string, data?: any}>}
  */
 // Buffer buster padding for NotePlan's console
-const BUFFER_BUSTER_PAD = `${'\n'.repeat(5)}${'.'.repeat(10000)}/`
-
-function bustLog(message: string): void {
-  console.log(`${message}${BUFFER_BUSTER_PAD}`)
-}
-
 export async function handleSaveRequest(data: any): Promise<{ success: boolean, message?: string, data?: any }> {
   const saveId = `SAVE-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`
-  // Add immediate console.log to catch hangs before logDebug with buffer busting
-  bustLog(`[handleSaveRequest] ENTRY - saveId=${saveId}`)
-  bustLog(`[handleSaveRequest] data.fields: ${data?.fields ? `exists, type=${typeof data.fields}, isArray=${Array.isArray(data.fields)}, length=${data.fields.length || 0}` : 'missing'}`)
+  logDebug(pluginJson, `[${saveId}] handleSaveRequest: ENTRY - saveId=${saveId}`)
+  logDebug(
+    pluginJson,
+    `[${saveId}] handleSaveRequest: data.fields: ${
+      data?.fields ? `exists, type=${typeof data.fields}, isArray=${String(Array.isArray(data.fields))}, length=${data.fields.length || 0}` : 'missing'
+    }`,
+  )
   if (data?.fields?.length > 0) {
-    bustLog(`[handleSaveRequest] First field: ${typeof data.fields[0] === 'string' ? data.fields[0].substring(0, 50) : JSON.stringify(data.fields[0]).substring(0, 50)}`)
+    logDebug(
+      pluginJson,
+      `[${saveId}] handleSaveRequest: First field: ${typeof data.fields[0] === 'string' ? data.fields[0].substring(0, 50) : JSON.stringify(data.fields[0]).substring(0, 50)}`,
+    )
   }
-  bustLog(`[handleSaveRequest] About to call logDebug`)
   logDebug(pluginJson, `[${saveId}] handleSaveRequest: ENTRY - Starting save request`)
-  bustLog(`[handleSaveRequest] logDebug completed`)
   try {
     // Get the template filename from the data passed from React, or fall back to reactWindowData
     const templateFilename = data?.templateFilename
@@ -492,24 +518,20 @@ export async function handleSaveRequest(data: any): Promise<{ success: boolean,
     try {
       // Note: getGlobalSharedData may hang if window is in bad state, but we can't use Promise.race
       // in NotePlan's JSContext (Promise is not a constructor). Just try it and let it fail naturally.
-      bustLog(`[handleSaveRequest] Attempting to get window data for windowId="${windowId}"`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Attempting to get window data for windowId="${windowId}"`)
       const reactWindowData = await getGlobalSharedData(windowId)
       fallbackTemplateFilename = reactWindowData?.pluginData?.templateFilename || ''
-      bustLog(`[handleSaveRequest] Got window data, fallbackTemplateFilename="${fallbackTemplateFilename}"`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Got window data, fallbackTemplateFilename="${fallbackTemplateFilename}"`)
     } catch (e) {
       // If we can't get window data, that's ok - we'll use templateFilename from data
-      bustLog(`[handleSaveRequest] Could not get window data: ${e.message || String(e)}`)
-      logDebug(pluginJson, `handleSaveRequest: Could not get window data for windowId="${windowId}", using templateFilename from data`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Could not get window data: ${e.message || String(e)}`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Could not get window data for windowId="${windowId}", using templateFilename from data`)
     }
     const finalTemplateFilename = templateFilename || fallbackTemplateFilename
-    bustLog(`[handleSaveRequest] finalTemplateFilename="${finalTemplateFilename}"`)
-    bustLog(`[handleSaveRequest] About to call logDebug for finalTemplateFilename`)
     logDebug(pluginJson, `[${saveId}] handleSaveRequest: finalTemplateFilename="${finalTemplateFilename}"`)
-    bustLog(`[handleSaveRequest] logDebug for finalTemplateFilename completed`)
 
-      bustLog(`[handleSaveRequest] About to check if finalTemplateFilename is empty`)
     if (!finalTemplateFilename) {
-      bustLog(`[handleSaveRequest] ERROR: No template filename provided`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: ERROR: No template filename provided`)
       return {
         success: false,
         message: 'No template filename provided',
@@ -518,37 +540,47 @@ export async function handleSaveRequest(data: any): Promise<{ success: boolean,
     }
 
     // Check for missing or empty fields array
-    bustLog(`[handleSaveRequest] Checking fields: data?.fields=${data?.fields ? 'exists' : 'missing'}, isArray=${Array.isArray(data?.fields)}, length=${data?.fields?.length || 0}`)
+    logDebug(
+      pluginJson,
+      `[${saveId}] handleSaveRequest: Checking fields: data?.fields=${data?.fields ? 'exists' : 'missing'}, isArray=${String(Array.isArray(data?.fields))}, length=${
+        data?.fields?.length || 0
+      }`,
+    )
     if (!data?.fields || !Array.isArray(data.fields) || data.fields.length === 0) {
-      bustLog(`[handleSaveRequest] ERROR: No fields provided to save`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: ERROR: No fields provided to save`)
       return {
         success: false,
         message: 'No fields provided to save',
         data: null,
       }
     }
-    bustLog(`[handleSaveRequest] Fields check passed, proceeding with save`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Fields check passed, proceeding with save`)
 
     // Parse fields if they're strings (shouldn't happen, but just in case)
-    bustLog(`[handleSaveRequest] Fields before parsing: type=${typeof data.fields}, isArray=${Array.isArray(data.fields)}, length=${data.fields?.length || 0}, firstFieldType=${data.fields?.[0] ? typeof data.fields[0] : 'none'}`)
+    logDebug(
+      pluginJson,
+      `[${saveId}] handleSaveRequest: Fields before parsing: type=${typeof data.fields}, isArray=${String(Array.isArray(data.fields))}, length=${
+        data.fields?.length || 0
+      }, firstFieldType=${data.fields?.[0] ? typeof data.fields[0] : 'none'}`,
+    )
     let fieldsToSave = data.fields
     if (Array.isArray(fieldsToSave) && fieldsToSave.length > 0 && typeof fieldsToSave[0] === 'string') {
-      bustLog(`[handleSaveRequest] Fields are strings, attempting to parse`)
-      logWarn(pluginJson, `handleSaveRequest: Fields are strings, attempting to parse`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Fields are strings, attempting to parse`)
+      logWarn(pluginJson, `[${saveId}] handleSaveRequest: Fields are strings, attempting to parse`)
       fieldsToSave = fieldsToSave.map((field) => {
         try {
           const parsed = typeof field === 'string' ? JSON.parse(field) : field
-          bustLog(`[handleSaveRequest] Parsed field: ${JSON.stringify(parsed).substring(0, 100)}`)
+          logDebug(pluginJson, `[${saveId}] handleSaveRequest: Parsed field: ${JSON.stringify(parsed).substring(0, 100)}`)
           return parsed
         } catch (e) {
-          bustLog(`[handleSaveRequest] Error parsing field: ${e.message}`)
-          logError(pluginJson, `handleSaveRequest: Error parsing field: ${e.message}`)
+          logDebug(pluginJson, `[${saveId}] handleSaveRequest: Error parsing field: ${e.message}`)
+          logError(pluginJson, `[${saveId}] handleSaveRequest: Error parsing field: ${e.message}`)
           return field
         }
       })
-      bustLog(`[handleSaveRequest] Finished parsing ${fieldsToSave.length} fields`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Finished parsing ${fieldsToSave.length} fields`)
     } else {
-      bustLog(`[handleSaveRequest] Fields are already objects, no parsing needed`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Fields are already objects, no parsing needed`)
     }
 
     // Clean up markdown-preview fields: remove empty string values
@@ -578,17 +610,14 @@ export async function handleSaveRequest(data: any): Promise<{ success: boolean,
       return field
     })
 
-    bustLog(`[handleSaveRequest] About to save ${fieldsToSave.length} fields to template "${finalTemplateFilename}"`)
-    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Saving ${fieldsToSave.length} fields to template "${finalTemplateFilename}"`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to save ${fieldsToSave.length} fields to template "${finalTemplateFilename}"`)
 
     await saveFormFieldsToTemplate(finalTemplateFilename, fieldsToSave)
-    bustLog(`[handleSaveRequest] Fields saved to template successfully`)
-    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Fields saved to template`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Fields saved to template successfully`)
 
-    bustLog(`[handleSaveRequest] About to extract TemplateRunner processing variables from frontmatter`)
     // Extract TemplateRunner processing variables from frontmatter
     // These contain template tags and should be stored in codeblock, not frontmatter
-    bustLog(`[handleSaveRequest] Creating templateRunnerArgs object`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Creating templateRunnerArgs object`)
     const templateRunnerArgs: { [string]: any } = {}
     const templateRunnerArgKeys = [
       'newNoteTitle', // Contains template tags like <%- field1 %>
@@ -601,74 +630,71 @@ export async function handleSaveRequest(data: any): Promise<{ success: boolean,
     ]
 
     // Extract TemplateRunner args from frontmatter
-    bustLog(`[handleSaveRequest] Checking if frontmatter exists: ${data?.frontmatter ? 'yes' : 'no'}`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Checking if frontmatter exists: ${data?.frontmatter ? 'yes' : 'no'}`)
     if (data?.frontmatter) {
-      bustLog(`[handleSaveRequest] Extracting TemplateRunner args from frontmatter`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Extracting TemplateRunner args from frontmatter`)
       templateRunnerArgKeys.forEach((key) => {
         if (data.frontmatter[key] !== undefined) {
           templateRunnerArgs[key] = data.frontmatter[key]
         }
       })
-      bustLog(`[handleSaveRequest] Extracted ${Object.keys(templateRunnerArgs).length} TemplateRunner args`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Extracted ${Object.keys(templateRunnerArgs).length} TemplateRunner args`)
     } else {
-      bustLog(`[handleSaveRequest] No frontmatter found, skipping TemplateRunner args extraction`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: No frontmatter found, skipping TemplateRunner args extraction`)
     }
 
     // Save templateBody to codeblock if provided
-    bustLog(`[handleSaveRequest] Checking templateBody: ${data?.frontmatter?.templateBody !== undefined ? 'exists' : 'missing'}`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Checking templateBody: ${data?.frontmatter?.templateBody !== undefined ? 'exists' : 'missing'}`)
     if (data?.frontmatter?.templateBody !== undefined) {
-      bustLog(`[handleSaveRequest] About to save templateBody to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to save templateBody to codeblock`)
       await saveTemplateBodyToTemplate(finalTemplateFilename, data.frontmatter.templateBody || '')
-      bustLog(`[handleSaveRequest] templateBody saved to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: templateBody saved to codeblock`)
     }
 
     // Save custom CSS to codeblock if provided
-    bustLog(`[handleSaveRequest] Checking customCSS: ${data?.frontmatter?.customCSS !== undefined ? 'exists' : 'missing'}`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Checking customCSS: ${data?.frontmatter?.customCSS !== undefined ? 'exists' : 'missing'}`)
     if (data?.frontmatter?.customCSS !== undefined) {
-      bustLog(`[handleSaveRequest] About to save customCSS to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to save customCSS to codeblock`)
       await saveCustomCSSToTemplate(finalTemplateFilename, data.frontmatter.customCSS || '')
-      bustLog(`[handleSaveRequest] customCSS saved to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: customCSS saved to codeblock`)
     }
 
     // Save TemplateRunner args to codeblock if any exist
-    bustLog(`[handleSaveRequest] Checking TemplateRunner args: ${Object.keys(templateRunnerArgs).length} keys`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Checking TemplateRunner args: ${Object.keys(templateRunnerArgs).length} keys`)
     if (Object.keys(templateRunnerArgs).length > 0) {
-      bustLog(`[handleSaveRequest] About to save TemplateRunner args to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to save TemplateRunner args to codeblock`)
       await saveTemplateRunnerArgsToTemplate(finalTemplateFilename, templateRunnerArgs)
-      bustLog(`[handleSaveRequest] TemplateRunner args saved to codeblock`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: TemplateRunner args saved to codeblock`)
     } else {
-      bustLog(`[handleSaveRequest] No TemplateRunner args to save`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: No TemplateRunner args to save`)
     }
 
     // Save frontmatter if provided (but exclude TemplateRunner args and templateBody as they're in codeblocks)
-    bustLog(`[handleSaveRequest] About to check if frontmatter needs to be saved`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to check if frontmatter needs to be saved`)
     if (data?.frontmatter) {
-      bustLog(`[handleSaveRequest] Frontmatter exists, preparing for save`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Frontmatter exists, preparing for save`)
       const frontmatterForSave = { ...data.frontmatter }
       logDebug(pluginJson, `[${saveId}] handleSaveRequest: Frontmatter to save: ${JSON.stringify(frontmatterForSave)}`)
       logDebug(pluginJson, `[${saveId}] handleSaveRequest: receivingTemplateTitle="${frontmatterForSave.receivingTemplateTitle || 'MISSING'}"`)
-      // Remove TemplateRunner args and templateBody from frontmatter
-      bustLog(`[handleSaveRequest] Removing TemplateRunner args from frontmatter`)
+      // Remove TemplateRunner args, templateBody, and customCSS from frontmatter (they're in codeblocks)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Removing TemplateRunner args, templateBody, and customCSS from frontmatter`)
       delete frontmatterForSave.templateBody
+      delete frontmatterForSave.customCSS
       templateRunnerArgKeys.forEach((key) => {
         delete frontmatterForSave[key]
       })
       logDebug(pluginJson, `[${saveId}] handleSaveRequest: Frontmatter after cleanup: ${JSON.stringify(frontmatterForSave)}`)
-      bustLog(`[handleSaveRequest] About to save frontmatter to template`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: About to save frontmatter to template`)
       await saveFrontmatterToTemplate(finalTemplateFilename, frontmatterForSave)
-      bustLog(`[handleSaveRequest] Frontmatter saved successfully`)
-      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Frontmatter saved`)
+      logDebug(pluginJson, `[${saveId}] handleSaveRequest: Frontmatter saved successfully`)
     } else {
-      bustLog(`[handleSaveRequest] No frontmatter provided in data`)
       logDebug(pluginJson, `[${saveId}] handleSaveRequest: No frontmatter provided in data`)
     }
 
     // Get template note for success message and cleanup
-    bustLog(`[handleSaveRequest] Getting template note for "${finalTemplateFilename}"...`)
-    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Getting template note...`)
+    logDebug(pluginJson, `[${saveId}] handleSaveRequest: Getting template note for "${finalTemplateFilename}"...`)
     const templateNote = await getNoteByFilename(finalTemplateFilename)
     const templateTitle = templateNote?.title || finalTemplateFilename
-    bustLog(`[handleSaveRequest] Template note found: title="${templateTitle}", type="${templateNote?.frontmatterAttributes?.type || 'none'}"`)
     logDebug(pluginJson, `[${saveId}] handleSaveRequest: Template note found: title="${templateTitle}", type="${templateNote?.frontmatterAttributes?.type || 'none'}"`)
 
     // Remove empty lines from the note
diff --git a/dwertheimer.Forms/src/formBuilderRouter.js b/dwertheimer.Forms/src/formBuilderRouter.js
index 890735c5d..46a68c098 100644
--- a/dwertheimer.Forms/src/formBuilderRouter.js
+++ b/dwertheimer.Forms/src/formBuilderRouter.js
@@ -22,29 +22,21 @@ import { logDebug, logError, logWarn } from '@helpers/dev'
  * @param {any} data - Request data
  * @returns {Promise<RequestResponse>}
  */
-// Buffer buster padding for NotePlan's console
-const BUFFER_BUSTER_PAD = `${'\n'.repeat(5)}${'.'.repeat(10000)}/`
-
-function bustLog(message: string): void {
-  console.log(`${message}${BUFFER_BUSTER_PAD}`)
-}
-
 async function routeFormBuilderRequest(actionType: string, data: any): Promise<RequestResponse> {
-  // Add immediate logging to catch hangs with buffer busting
-  bustLog(`[routeFormBuilderRequest] Called with actionType="${actionType}", data.type="${data?.type || 'none'}"`)
-  bustLog(`[routeFormBuilderRequest] data.fields type: ${Array.isArray(data?.fields) ? 'array' : typeof data?.fields}, length: ${data?.fields?.length || 0}`)
+  logDebug(pluginJson, `[routeFormBuilderRequest] Called with actionType="${actionType}", data.type="${data?.type || 'none'}"`)
+  logDebug(pluginJson, `[routeFormBuilderRequest] data.fields type: ${Array.isArray(data?.fields) ? 'array' : typeof data?.fields}, length: ${data?.fields?.length || 0}`)
   if (data?.fields?.length > 0) {
-    bustLog(`[routeFormBuilderRequest] First field type: ${typeof data.fields[0]}, is string: ${typeof data.fields[0] === 'string'}`)
+    logDebug(pluginJson, `[routeFormBuilderRequest] First field type: ${typeof data.fields[0]}, is string: ${String(typeof data.fields[0] === 'string')}`)
   }
 
   // Handle save action as a special case (it's not a standard request)
   const actualActionType = data?.type
-  bustLog(`[routeFormBuilderRequest] actualActionType="${actualActionType}"`)
+  logDebug(pluginJson, `[routeFormBuilderRequest] actualActionType="${actualActionType}"`)
   if (actualActionType === 'save') {
-    bustLog(`[routeFormBuilderRequest] Routing to handleSaveRequest with fields type: ${typeof data.fields}, isArray: ${Array.isArray(data.fields)}`)
-    bustLog(`[routeFormBuilderRequest] About to call handleSaveRequest`)
+    logDebug(pluginJson, `[routeFormBuilderRequest] Routing to handleSaveRequest with fields type: ${typeof data.fields}, isArray: ${String(Array.isArray(data.fields))}`)
+    logDebug(pluginJson, `[routeFormBuilderRequest] About to call handleSaveRequest`)
     const result = await handleSaveRequest(data)
-    bustLog(`[routeFormBuilderRequest] handleSaveRequest returned, success: ${result?.success}`)
+    logDebug(pluginJson, `[routeFormBuilderRequest] handleSaveRequest returned, success: ${String(result?.success ?? 'undefined')}`)
     return result
   }
 
@@ -53,7 +45,7 @@ async function routeFormBuilderRequest(actionType: string, data: any): Promise<R
     case 'createProcessingTemplate':
       return await handleCreateProcessingTemplate(data)
     case 'openNote':
-      return handleOpenNote(data)
+      return await handleOpenNote(data)
     case 'copyFormUrl':
       return handleCopyFormUrl(data)
     case 'duplicateForm':
diff --git a/dwertheimer.Forms/src/formSubmission.js b/dwertheimer.Forms/src/formSubmission.js
index 81edc572a..ab123f469 100644
--- a/dwertheimer.Forms/src/formSubmission.js
+++ b/dwertheimer.Forms/src/formSubmission.js
@@ -7,6 +7,551 @@ import pluginJson from '../plugin.json'
 import { type PassedData } from './NPTemplateForm.js'
 import { logError, logDebug, clo, JSP } from '@helpers/dev'
 import { showMessage } from '@helpers/userInput'
+import { replaceSmartQuotes } from '@templating/utils/stringUtils'
+
+// ============================================================================
+// Helper Functions
+// ============================================================================
+
+/**
+ * Check if a key is a valid JavaScript identifier
+ * @param {string} key - The key to check
+ * @returns {boolean} - True if the key is a valid JavaScript identifier
+ */
+function isValidIdentifier(key: string): boolean {
+  // JavaScript identifier: starts with letter/underscore/$ and contains only letters, digits, underscore, $
+  return /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key)
+}
+
+/**
+ * Generate a key from label + random string for use in error messages
+ * @param {string} label - The field label
+ * @param {number} index - The field index
+ * @returns {string} - A valid JavaScript identifier
+ */
+function generateKeyFromLabel(label: string, index: number): string {
+  // Sanitize label: remove special chars, replace spaces/hyphens with underscores, ensure starts with letter/underscore
+  let sanitized = (label || 'templatejs-block')
+    .replace(/[^a-zA-Z0-9\s-_]/g, '') // Remove special chars except spaces, hyphens, underscores
+    .replace(/[\s-]+/g, '_') // Replace spaces and hyphens with underscores
+    .replace(/_+/g, '_') // Replace multiple underscores with single underscore
+    .substring(0, 30) // Limit length
+    .toLowerCase()
+    .trim()
+
+  // Ensure it starts with a letter or underscore (valid JS identifier requirement)
+  if (sanitized.length === 0 || !/^[a-zA-Z_]/.test(sanitized)) {
+    sanitized = `block_${sanitized}`
+  }
+
+  // Generate random string (4 chars) for uniqueness
+  const randomStr = Math.random().toString(36).substring(2, 6)
+  return `${sanitized}_${randomStr}_${index + 1}`
+}
+
+/**
+ * Prepare form values for rendering by removing internal flags
+ * @param {Object} formValues - The raw form values
+ * @returns {Object} - Cleaned form values
+ */
+function prepareFormValuesForRendering(formValues: Object): Object {
+  const cleaned = { ...formValues }
+  delete cleaned.__isJSON__
+  return cleaned
+}
+
+/**
+ * Get the full templating context with form values merged in
+ * @param {Object} formValues - The form values to merge into context
+ * @returns {Promise<Object>} - The full templating context
+ */
+async function getTemplatingContext(formValues: Object): Promise<Object> {
+  logDebug(pluginJson, `getTemplatingContext: Getting templating render context...`)
+  const templatingContext = await DataStore.invokePluginCommandByName('getRenderContext', 'np.Templating', [formValues])
+  logDebug(pluginJson, `getTemplatingContext: Got templating context with ${Object.keys(templatingContext).length} keys`)
+  return templatingContext
+}
+
+/**
+ * Extract templatejs blocks from form fields
+ * @param {Array<Object>} formFields - The form fields array
+ * @param {string} executeTiming - Filter by execute timing ('before' or 'after')
+ * @returns {Array<{field: Object, code: string, order: number}>} - Array of templatejs blocks
+ */
+function extractTemplateJSBlocks(formFields: Array<Object>, executeTiming?: string): Array<{ field: Object, code: string, order: number }> {
+  const blocks: Array<{ field: Object, code: string, order: number }> = []
+  formFields.forEach((field, index) => {
+    if (field.type === 'templatejs-block' && field.templateJSContent) {
+      const rawCode = String(field.templateJSContent).trim()
+      // Sanitize the code when extracting (replace smart quotes, etc.)
+      const code = sanitizeTemplateJSCode(rawCode)
+      if (code) {
+        const fieldExecuteTiming = field.executeTiming || 'after'
+        if (!executeTiming || fieldExecuteTiming === executeTiming) {
+          blocks.push({ field, code, order: index })
+        }
+      }
+    }
+  })
+  // Sort by order (top to bottom)
+  blocks.sort((a, b) => a.order - b.order)
+  return blocks
+}
+
+/**
+ * Sanitize templateJS code before execution
+ * - Replaces smart quotes with straight quotes
+ * - Removes any other problematic characters
+ * @param {string} code - The raw templateJS code
+ * @returns {string} - The sanitized code
+ */
+function sanitizeTemplateJSCode(code: string): string {
+  if (!code || typeof code !== 'string') {
+    return code || ''
+  }
+
+  // Replace smart quotes with straight quotes
+  let sanitized = replaceSmartQuotes(code)
+
+  // Ensure it's still a string after processing
+  if (typeof sanitized !== 'string') {
+    sanitized = String(sanitized)
+  }
+
+  return sanitized
+}
+
+/**
+ * Execute a single templatejs block with the given context
+ * @param {Object} field - The field object
+ * @param {string} code - The JavaScript code to execute
+ * @param {Object} context - The execution context
+ * @param {number} blockIndex - The index of this block (for error messages)
+ * @returns {Promise<Object|null>} - The returned object from the block, or null on error
+ */
+async function executeTemplateJSBlock(field: Object, code: string, context: Object, blockIndex: number): Promise<Object | null> {
+  const fieldIdentifier = field.key || generateKeyFromLabel(field.label || '', blockIndex)
+  try {
+    logDebug(pluginJson, `executeTemplateJSBlock: Executing templatejs block from field "${fieldIdentifier}"`)
+
+    // Sanitize the code before execution (replace smart quotes, etc.)
+    const sanitizedCode = sanitizeTemplateJSCode(code)
+    if (sanitizedCode !== code) {
+      logDebug(pluginJson, `executeTemplateJSBlock: Code was sanitized (smart quotes replaced)`)
+    }
+
+    // Build context variables - only create variables for valid JavaScript identifiers
+    const contextVars = Object.keys(context)
+      .map((key) => {
+        if (isValidIdentifier(key)) {
+          return `const ${key} = params.${key};`
+        }
+        // For invalid identifiers, don't create a variable - user can access via params['key-name']
+        return `// Key "${key}" is not a valid JavaScript identifier - access via params['${key}']`
+      })
+      .join('\n')
+
+    const functionBody = `
+      ${contextVars}
+      // Execute user's code
+      // All templating functions are available: moment, date, note, tasks, etc.
+      ${sanitizedCode}
+    `
+
+    // $FlowIgnore[prop-missing] - Function constructor is safe here as code comes from form definition
+    const fn = Function.apply(null, ['params', functionBody])
+    const result = fn(context)
+
+    // Validate that the code returned an object
+    if (result && typeof result === 'object' && !Array.isArray(result)) {
+      logDebug(pluginJson, `executeTemplateJSBlock: TemplateJS block "${fieldIdentifier}" returned object with keys: ${Object.keys(result).join(', ')}`)
+      return result
+    } else if (result !== undefined) {
+      logError(pluginJson, `executeTemplateJSBlock: TemplateJS block "${fieldIdentifier}" should return an object, but returned: ${typeof result}`)
+      await showMessage(
+        `TemplateJS block "${fieldIdentifier}" should return an object, but returned ${typeof result}. Please update your code to return an object (e.g., return { key: value }).`,
+      )
+      return null
+    } else {
+      logError(pluginJson, `executeTemplateJSBlock: TemplateJS block "${fieldIdentifier}" did not return anything. It should return an object.`)
+      await showMessage(`TemplateJS block "${fieldIdentifier}" did not return anything. Please update your code to return an object (e.g., return { key: value }).`)
+      return null
+    }
+  } catch (error) {
+    logError(pluginJson, `executeTemplateJSBlock: Error executing templatejs block "${fieldIdentifier}": ${error.message}`)
+    await showMessage(`Error executing TemplateJS block "${fieldIdentifier}": ${error.message}`)
+    return null
+  }
+}
+
+/**
+ * Execute all templatejs blocks in order and merge their results into context
+ * @param {Array<{field: Object, code: string, order: number}>} blocks - The templatejs blocks to execute
+ * @param {Object} initialContext - The initial execution context
+ * @returns {Promise<Object|null>} - The merged context, or null on error
+ */
+async function executeTemplateJSBlocks(blocks: Array<{ field: Object, code: string, order: number }>, initialContext: Object): Promise<Object | null> {
+  let context = { ...initialContext }
+
+  for (let blockIndex = 0; blockIndex < blocks.length; blockIndex++) {
+    const { field, code } = blocks[blockIndex]
+    const result = await executeTemplateJSBlock(field, code, context, blockIndex)
+
+    if (result === null) {
+      // Error occurred, abort
+      return null
+    }
+
+    // Merge the returned object into context
+    context = { ...context, ...result }
+  }
+
+  return context
+}
+
+/**
+ * Handle template runner result - check for AI analysis and store in reactWindowData
+ * @param {any} templateRunnerResult - The result from templateRunner
+ * @param {PassedData} reactWindowData - The React window data to update
+ */
+function handleTemplateRunnerResult(templateRunnerResult: any, reactWindowData: PassedData): void {
+  logDebug(
+    pluginJson,
+    `handleTemplateRunnerResult: templateRunner result type=${typeof templateRunnerResult}, length=${templateRunnerResult?.length || 0}, includes AI marker=${String(
+      templateRunnerResult?.includes?.('==**Templating Error Found**') || false,
+    )}`,
+  )
+
+  // Check if result contains AI analysis (error message from template rendering)
+  if (templateRunnerResult && typeof templateRunnerResult === 'string' && templateRunnerResult.includes('==**Templating Error Found**')) {
+    logDebug(pluginJson, `handleTemplateRunnerResult: AI analysis result detected, storing in reactWindowData.pluginData.aiAnalysisResult`)
+    // Store AI analysis result in reactWindowData so it can be passed back to React window
+    if (!reactWindowData.pluginData) {
+      reactWindowData.pluginData = {}
+    }
+    ;(reactWindowData.pluginData: any).aiAnalysisResult = templateRunnerResult
+    logDebug(
+      pluginJson,
+      `handleTemplateRunnerResult: AI analysis stored, reactWindowData.pluginData.aiAnalysisResult length=${reactWindowData.pluginData.aiAnalysisResult?.length || 0}`,
+    )
+  } else {
+    logDebug(pluginJson, `handleTemplateRunnerResult: No AI analysis result detected in templateRunner result`)
+  }
+}
+
+// ============================================================================
+// Processing Method Handlers
+// ============================================================================
+
+/**
+ * Process form submission using form-processor method
+ * @param {Object} data - The submission data
+ * @param {PassedData} reactWindowData - The React window data
+ * @returns {Promise<PassedData | null>} - Updated React window data or null on error
+ */
+async function processFormProcessor(data: any, reactWindowData: PassedData): Promise<PassedData | null> {
+  const { receivingTemplateTitle, formValues, shouldOpenInEditor } = data
+
+  if (!receivingTemplateTitle) {
+    await showMessage('No Processing Template was Provided; You should set a processing template in your form settings.')
+    return null
+  }
+
+  // Step 1: Prepare form values and get templating context
+  const formValuesForRendering = prepareFormValuesForRendering(formValues)
+  const templatingContext = await getTemplatingContext(formValuesForRendering)
+
+  // Step 2: Extract and execute templatejs blocks
+  // Note: We use the full templating context for execution so templatejs blocks have access to moment, date, etc.
+  const formFields = reactWindowData?.pluginData?.formFields || []
+  const templateJSBlocks = extractTemplateJSBlocks(formFields, 'after')
+
+  const fullContext = await executeTemplateJSBlocks(templateJSBlocks, templatingContext)
+  if (fullContext === null) {
+    return null // Error occurred during templatejs block execution
+  }
+
+  // Step 3: Extract only form-specific variables (form values + templatejs block results)
+  // Don't pass templating context (modules, globals) to templateRunner - it will add those itself
+  // Track which keys are templating context keys (these should be excluded)
+  const templatingContextKeys = new Set(Object.keys(templatingContext))
+
+  // Build a clean object with only form-specific variables
+  const formSpecificVars: { [string]: any } = {}
+  Object.keys(fullContext).forEach((key) => {
+    // Only include keys that are NOT in the templating context (i.e., form values or templatejs block results)
+    if (!templatingContextKeys.has(key)) {
+      formSpecificVars[key] = fullContext[key]
+    }
+  })
+
+  // Also include original form values (in case templatejs blocks didn't add them)
+  Object.keys(formValuesForRendering).forEach((key) => {
+    if (!(key in formSpecificVars)) {
+      formSpecificVars[key] = formValuesForRendering[key]
+    }
+  })
+
+  // Step 4: Call templateRunner with only form-specific variables
+  const argumentsToSend = [receivingTemplateTitle, shouldOpenInEditor, formSpecificVars]
+  clo(argumentsToSend, `processFormProcessor: Calling templateRunner with form-specific variables only (after executing ${templateJSBlocks.length} templatejs blocks)`)
+
+  const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', argumentsToSend)
+  handleTemplateRunnerResult(templateRunnerResult, reactWindowData)
+
+  return reactWindowData
+}
+
+/**
+ * Process form submission using write-existing method
+ * @param {Object} data - The submission data
+ * @param {PassedData} reactWindowData - The React window data
+ * @returns {Promise<PassedData | null>} - Updated React window data or null on error
+ */
+async function processWriteExisting(data: any, reactWindowData: PassedData): Promise<PassedData | null> {
+  const { getNoteTitled, location, writeUnderHeading, createMissingHeading, formValues, shouldOpenInEditor } = data
+
+  if (!getNoteTitled) {
+    logError(pluginJson, `processWriteExisting: No target note was specified. Please set a target note in your form settings.`)
+    // await showMessage('No target note was specified. Please set a target note in your form settings.')
+    return null
+  }
+
+  // Step 1: Prepare form values and get templating context
+  const formValuesForRendering = prepareFormValuesForRendering(formValues)
+  const templatingContext = await getTemplatingContext(formValuesForRendering)
+
+  // Step 2: Extract and execute templatejs blocks
+  const formFields = reactWindowData?.pluginData?.formFields || []
+  const templateJSBlocks = extractTemplateJSBlocks(formFields, 'after')
+
+  const fullContext = await executeTemplateJSBlocks(templateJSBlocks, templatingContext)
+  if (fullContext === null) {
+    return null // Error occurred during templatejs block execution
+  }
+
+  // Step 3: Extract only form-specific variables (form values + templatejs block results)
+  // Don't pass templating context (modules, globals) to templateRunner - it will add those itself
+  const templatingContextKeys = new Set(Object.keys(templatingContext))
+
+  // Build a clean object with only form-specific variables
+  const formSpecificVars: { [string]: any } = {}
+  Object.keys(fullContext).forEach((key) => {
+    // Only include keys that are NOT in the templating context (i.e., form values or templatejs block results)
+    if (!templatingContextKeys.has(key)) {
+      formSpecificVars[key] = fullContext[key]
+    }
+  })
+
+  // Also include original form values (in case templatejs blocks didn't add them)
+  Object.keys(formValuesForRendering).forEach((key) => {
+    if (!(key in formSpecificVars)) {
+      formSpecificVars[key] = formValuesForRendering[key]
+    }
+  })
+
+  // Step 4: Build template body (DO NOT insert templatejs blocks - they're already executed)
+  const templateBody = reactWindowData?.pluginData?.templateBody || data?.templateBody || ''
+  const finalTemplateBody =
+    templateBody ||
+    Object.keys(formSpecificVars)
+      .filter((key) => key !== '__isJSON__')
+      .map((key) => `${key}: <%- ${key} %>`)
+      .join('\n')
+
+  // Step 5: Build templateRunner args with form-specific variables
+  const templateRunnerArgs: { [string]: any } = {
+    getNoteTitled,
+    templateBody: finalTemplateBody,
+  }
+  // Add form-specific variables (spread after explicit keys to avoid Flow error)
+  Object.keys(formSpecificVars).forEach((key) => {
+    templateRunnerArgs[key] = formSpecificVars[key]
+  })
+
+  // Step 4: Handle location options
+  if (location === 'replace') {
+    templateRunnerArgs.replaceNoteContents = true
+  } else if (location === 'prepend-under-heading') {
+    templateRunnerArgs.location = 'prepend'
+    if (writeUnderHeading) {
+      templateRunnerArgs.writeUnderHeading = writeUnderHeading
+      if (createMissingHeading !== undefined) {
+        templateRunnerArgs.createMissingHeading = createMissingHeading
+      }
+    }
+  } else if (location === 'append-under-heading') {
+    templateRunnerArgs.location = 'append'
+    if (writeUnderHeading) {
+      templateRunnerArgs.writeUnderHeading = writeUnderHeading
+      if (createMissingHeading !== undefined) {
+        templateRunnerArgs.createMissingHeading = createMissingHeading
+      }
+    }
+  } else {
+    // For other location values (append, prepend, cursor, insert)
+    if (location) {
+      templateRunnerArgs.location = location
+    }
+    if (writeUnderHeading) {
+      templateRunnerArgs.writeUnderHeading = writeUnderHeading
+      if (createMissingHeading !== undefined) {
+        templateRunnerArgs.createMissingHeading = createMissingHeading
+      }
+    }
+  }
+
+  // Step 5: Call templateRunner
+  clo(templateRunnerArgs, `processWriteExisting: Calling templateRunner with args`)
+  const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', ['', shouldOpenInEditor, templateRunnerArgs])
+  handleTemplateRunnerResult(templateRunnerResult, reactWindowData)
+
+  return reactWindowData
+}
+
+/**
+ * Process form submission using run-js-only method
+ * @param {Object} data - The submission data
+ * @param {PassedData} reactWindowData - The React window data
+ * @returns {Promise<PassedData | null>} - Updated React window data or null on error
+ */
+async function processRunJSOnly(data: any, reactWindowData: PassedData): Promise<PassedData | null> {
+  const { formValues } = data
+  const formFields = reactWindowData?.pluginData?.formFields || []
+
+  logDebug(pluginJson, `processRunJSOnly: formFields.length=${formFields.length}`)
+
+  // Step 1: Prepare form values and get templating context
+  const formValuesForRendering = prepareFormValuesForRendering(formValues)
+  const templatingContext = await getTemplatingContext(formValuesForRendering)
+
+  // Step 2: Extract and execute templatejs blocks
+  const templateJSBlocks = extractTemplateJSBlocks(formFields, 'after')
+
+  if (templateJSBlocks.length === 0) {
+    await showMessage('No TemplateJS block found in form fields. Please add a TemplateJS Block field to your form with the JavaScript code to execute.')
+    return null
+  }
+
+  logDebug(pluginJson, `processRunJSOnly: Found ${templateJSBlocks.length} templatejs blocks to execute`)
+
+  const fullContext = await executeTemplateJSBlocks(templateJSBlocks, templatingContext)
+  if (fullContext === null) {
+    return null // Error occurred during templatejs block execution
+  }
+
+  // Step 3: Extract only form-specific variables (form values + templatejs block results)
+  // Don't pass templating context (modules, globals) - we just want the results
+  const templatingContextKeys = new Set(Object.keys(templatingContext))
+
+  // Build a clean object with only form-specific variables (the results)
+  const results: { [string]: any } = {}
+  Object.keys(fullContext).forEach((key) => {
+    // Only include keys that are NOT in the templating context (i.e., form values or templatejs block results)
+    if (!templatingContextKeys.has(key)) {
+      results[key] = fullContext[key]
+    }
+  })
+
+  // Step 4: Show results to user (or store in reactWindowData for display)
+  const resultsString = Object.keys(results)
+    .map((key) => `${key}: ${JSON.stringify(results[key])}`)
+    .join('\n')
+
+  logDebug(pluginJson, `processRunJSOnly: JavaScript executed successfully. Results: ${resultsString}`)
+  await showMessage(`JavaScript executed successfully.\n\nResults:\n${resultsString}`)
+
+  return reactWindowData
+}
+
+/**
+ * Process form submission using create-new method
+ * @param {Object} data - The submission data
+ * @param {PassedData} reactWindowData - The React window data
+ * @returns {Promise<PassedData | null>} - Updated React window data or null on error
+ */
+async function processCreateNew(data: any, reactWindowData: PassedData): Promise<PassedData | null> {
+  const { newNoteTitle, newNoteFolder, space, formValues, shouldOpenInEditor } = data
+
+  // Step 1: Validate and clean new note title
+  const cleanedNewNoteTitle = newNoteTitle ? String(newNoteTitle).replace(/\n/g, ' ').trim() : ''
+  if (!cleanedNewNoteTitle) {
+    await showMessage('No new note title was specified. Please set a new note title in your form settings.')
+    return null
+  }
+
+  // Step 2: Prepare form values and get templating context
+  const formValuesForRendering = prepareFormValuesForRendering(formValues)
+  const templatingContext = await getTemplatingContext(formValuesForRendering)
+
+  // Step 3: Extract and execute templatejs blocks
+  const formFields = reactWindowData?.pluginData?.formFields || []
+  const templateJSBlocks = extractTemplateJSBlocks(formFields, 'after')
+
+  const fullContext = await executeTemplateJSBlocks(templateJSBlocks, templatingContext)
+  if (fullContext === null) {
+    return null // Error occurred during templatejs block execution
+  }
+
+  // Step 4: Extract only form-specific variables (form values + templatejs block results)
+  // Don't pass templating context (modules, globals) to templateRunner - it will add those itself
+  const templatingContextKeys = new Set(Object.keys(templatingContext))
+
+  // Build a clean object with only form-specific variables
+  const formSpecificVars: { [string]: any } = {}
+  Object.keys(fullContext).forEach((key) => {
+    // Only include keys that are NOT in the templating context (i.e., form values or templatejs block results)
+    if (!templatingContextKeys.has(key)) {
+      formSpecificVars[key] = fullContext[key]
+    }
+  })
+
+  // Also include original form values (in case templatejs blocks didn't add them)
+  Object.keys(formValuesForRendering).forEach((key) => {
+    if (!(key in formSpecificVars)) {
+      formSpecificVars[key] = formValuesForRendering[key]
+    }
+  })
+
+  // Step 5: Build template body (DO NOT insert templatejs blocks - they're already executed)
+  const templateBody = reactWindowData?.pluginData?.templateBody || data?.templateBody || ''
+  const finalTemplateBody =
+    templateBody ||
+    Object.keys(formSpecificVars)
+      .filter((key) => key !== '__isJSON__')
+      .map((key) => `${key}: <%- ${key} %>`)
+      .join('\n')
+
+  // Step 6: Build templateRunner args with form-specific variables
+  const templateRunnerArgs: { [string]: any } = {
+    newNoteTitle: cleanedNewNoteTitle,
+    templateBody: finalTemplateBody,
+  }
+  // Add form-specific variables (spread after explicit keys to avoid Flow error)
+  Object.keys(formSpecificVars).forEach((key) => {
+    templateRunnerArgs[key] = formSpecificVars[key]
+  })
+
+  // Step 5: Handle folder path and teamspace
+  let folderPath = newNoteFolder && newNoteFolder.trim() ? newNoteFolder.trim() : '/'
+  if (space && space.trim() && !folderPath.startsWith('%%NotePlanCloud%%')) {
+    if (folderPath === '/' || folderPath === '') {
+      folderPath = `%%NotePlanCloud%%/${space}/`
+    } else {
+      const cleanFolder = folderPath.startsWith('/') ? folderPath.slice(1) : folderPath
+      folderPath = `%%NotePlanCloud%%/${space}/${cleanFolder}`
+    }
+    logDebug(pluginJson, `processCreateNew: Prefixed folder with teamspace: ${folderPath}`)
+  }
+  templateRunnerArgs.folder = folderPath
+
+  // Step 6: Call templateRunner
+  clo(templateRunnerArgs, `processCreateNew: Calling templateRunner with args`)
+  const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', ['', shouldOpenInEditor, templateRunnerArgs])
+  handleTemplateRunnerResult(templateRunnerResult, reactWindowData)
+
+  return reactWindowData
+}
 
 /**
  * Insert TemplateJS blocks into templateBody based on executeTiming
@@ -25,7 +570,9 @@ export function insertTemplateJSBlocks(templateBody: string, formFields: Array<O
   // Extract TemplateJS blocks from form fields
   formFields.forEach((field) => {
     if (field.type === 'templatejs-block' && field.templateJSContent && field.key) {
-      const code = String(field.templateJSContent).trim()
+      const rawCode = String(field.templateJSContent).trim()
+      // Sanitize the code (replace smart quotes, etc.)
+      const code = sanitizeTemplateJSCode(rawCode)
       if (code) {
         // Format as templatejs code block (no extra whitespace)
         const codeBlock = `\`\`\`templatejs\n${code}\n\`\`\``
@@ -54,6 +601,13 @@ export function insertTemplateJSBlocks(templateBody: string, formFields: Array<O
   return parts.join('\n')
 }
 
+/**
+ * When someone clicks a "Submit" button in the React Window, it calls the router (onMessageFromHTMLView)
+ * which sees the actionType === "onSubmitClick" so it routes to this function for processing
+ * @param {any} data - the data sent from the React Window for the action 'onSubmitClick'
+ * @param {any} reactWindowData - the current data in the React Window
+ * @returns {any} - the updated data to send back to the React Window
+ */
 /**
  * When someone clicks a "Submit" button in the React Window, it calls the router (onMessageFromHTMLView)
  * which sees the actionType === "onSubmitClick" so it routes to this function for processing
@@ -64,282 +618,53 @@ export function insertTemplateJSBlocks(templateBody: string, formFields: Array<O
 export async function handleSubmitButtonClick(data: any, reactWindowData: PassedData): Promise<PassedData | null> {
   const { type, formValues, processingMethod, receivingTemplateTitle } = data
   clo(data, `handleSubmitButtonClick: data BEFORE acting on it`)
-  if (type === 'submit') {
-    if (formValues) {
-      formValues['__isJSON__'] = true // include a flag to indicate that the formValues are JSON for use in the Templating plugin later
-      const shouldOpenInEditor = data.shouldOpenInEditor !== false // Default to true if not set
-
-      // Get processing method from data or fall back to form-processor for backward compatibility
-      const method = processingMethod || (receivingTemplateTitle ? 'form-processor' : 'write-existing')
-
-      if (method === 'form-processor') {
-        // Option C: Use Form Processor (existing behavior)
-        if (!receivingTemplateTitle) {
-          await showMessage('No Processing Template was Provided; You should set a processing template in your form settings.')
-          return null
-        }
-        const argumentsToSend = [receivingTemplateTitle, shouldOpenInEditor, JSON.stringify(formValues)]
-        clo(argumentsToSend, `handleSubmitButtonClick: Using form-processor, calling templateRunner with arguments`)
-        const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', argumentsToSend)
-        logDebug(pluginJson, `handleSubmitButtonClick: templateRunner result type=${typeof templateRunnerResult}, length=${templateRunnerResult?.length || 0}, includes AI marker=${String(templateRunnerResult?.includes?.('==**Templating Error Found**') || false)}`)
-        // Check if result contains AI analysis (error message from template rendering)
-        if (templateRunnerResult && typeof templateRunnerResult === 'string' && templateRunnerResult.includes('==**Templating Error Found**')) {
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis result detected, storing in reactWindowData.pluginData.aiAnalysisResult`)
-          // Store AI analysis result in reactWindowData so it can be passed back to React window
-          if (!reactWindowData.pluginData) {
-            reactWindowData.pluginData = {}
-          }
-          ;(reactWindowData.pluginData: any).aiAnalysisResult = templateRunnerResult
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis stored, reactWindowData.pluginData.aiAnalysisResult length=${reactWindowData.pluginData.aiAnalysisResult?.length || 0}`)
-        } else {
-          logDebug(pluginJson, `handleSubmitButtonClick: No AI analysis result detected in templateRunner result`)
-        }
-      } else if (method === 'write-existing') {
-        // Option A: Write to Existing File
-        const { getNoteTitled, location, writeUnderHeading, createMissingHeading } = data
-        if (!getNoteTitled) {
-          await showMessage('No target note was specified. Please set a target note in your form settings.')
-          return null
-        }
 
-        // Get templateBody from reactWindowData (loaded from template codeblock) or from data, otherwise build from form values
-        const templateBody = reactWindowData?.pluginData?.templateBody || data?.templateBody || ''
-        const baseTemplateBody =
-          templateBody ||
-          Object.keys(formValues)
-            .filter((key) => key !== '__isJSON__')
-            .map((key) => `${key}: <%- ${key} %>`)
-            .join('\n')
-
-        // Insert TemplateJS blocks into templateBody based on executeTiming
-        const formFields = reactWindowData?.pluginData?.formFields || []
-        const finalTemplateBody = insertTemplateJSBlocks(baseTemplateBody, formFields)
-
-        // NOTE: For 'write-existing', we do NOT pre-render templateBody here.
-        // TemplateRunner will render it at line 764 using renderTemplate(frontmatterBody, data).
-        // The form values are spread into templateRunnerArgs below so TemplateRunner can access them for rendering.
-        // Pre-rendering here would cause double-rendering, which is safe (already-rendered content with no <% tags
-        // will pass through unchanged), but unnecessary.
-
-        // Build frontmatter object for TemplateRunner
-        // Spread formValues into templateRunnerArgs so they're available for rendering template tags in templateBody
-        // Filter out __isJSON__ flag as it's not needed for rendering
-        const formValuesForRendering = { ...formValues }
-        delete formValuesForRendering.__isJSON__
-
-        const templateRunnerArgs: { [string]: any } = {
-          getNoteTitled,
-          templateBody: finalTemplateBody, // TemplateRunner will render this with form values at line 764
-          ...formValuesForRendering, // Spread form values so TemplateRunner can render template tags like <%- field1 %>
-        }
+  // Validate submission type
+  if (type !== 'submit') {
+    logDebug(pluginJson, `handleSubmitButtonClick: type is not 'submit', returning`)
+    return reactWindowData
+  }
 
-        // Handle location options
-        if (location === 'replace') {
-          templateRunnerArgs.replaceNoteContents = true
-        } else if (location === 'prepend-under-heading') {
-          templateRunnerArgs.location = 'prepend'
-          if (writeUnderHeading) {
-            templateRunnerArgs.writeUnderHeading = writeUnderHeading
-            if (createMissingHeading !== undefined) {
-              templateRunnerArgs.createMissingHeading = createMissingHeading
-            }
-          }
-        } else if (location === 'append-under-heading') {
-          templateRunnerArgs.location = 'append'
-          if (writeUnderHeading) {
-            templateRunnerArgs.writeUnderHeading = writeUnderHeading
-            if (createMissingHeading !== undefined) {
-              templateRunnerArgs.createMissingHeading = createMissingHeading
-            }
-          }
-        } else {
-          // For other location values (append, prepend, cursor, insert)
-          if (location) {
-            templateRunnerArgs.location = location
-          }
-          // Only set writeUnderHeading if it's provided (for backward compatibility)
-          if (writeUnderHeading) {
-            templateRunnerArgs.writeUnderHeading = writeUnderHeading
-            if (createMissingHeading !== undefined) {
-              templateRunnerArgs.createMissingHeading = createMissingHeading
-            }
-          }
-        }
+  if (!formValues) {
+    logError(pluginJson, `handleSubmitButtonClick: formValues is undefined`)
+    return reactWindowData
+  }
 
-        clo(templateRunnerArgs, `handleSubmitButtonClick: Using write-existing, calling templateRunner with args`)
-        const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', ['', shouldOpenInEditor, templateRunnerArgs])
-        logDebug(pluginJson, `handleSubmitButtonClick: templateRunner result type=${typeof templateRunnerResult}, length=${templateRunnerResult?.length || 0}, includes AI marker=${String(templateRunnerResult?.includes?.('==**Templating Error Found**') || false)}`)
-        // Check if result contains AI analysis (error message from template rendering)
-        if (templateRunnerResult && typeof templateRunnerResult === 'string' && templateRunnerResult.includes('==**Templating Error Found**')) {
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis result detected, storing in reactWindowData.pluginData.aiAnalysisResult`)
-          // Store AI analysis result in reactWindowData so it can be passed back to React window
-          if (!reactWindowData.pluginData) {
-            reactWindowData.pluginData = {}
-          }
-          ;(reactWindowData.pluginData: any).aiAnalysisResult = templateRunnerResult
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis stored, reactWindowData.pluginData.aiAnalysisResult length=${reactWindowData.pluginData.aiAnalysisResult?.length || 0}`)
-        } else {
-          logDebug(pluginJson, `handleSubmitButtonClick: No AI analysis result detected in templateRunner result`)
-        }
-      } else if (method === 'run-js-only') {
-        // Option D: Run JS Only (no note creation)
-        // Get TemplateJS blocks from form fields (templatejs-block type)
-        const formFields = reactWindowData?.pluginData?.formFields || []
-        
-        logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: formFields.length=${formFields.length}`)
-        
-        // Find all TemplateJS blocks from form fields
-        const templateJSBlocks: Array<string> = []
-        formFields.forEach((field) => {
-          if (field.type === 'templatejs-block' && field.templateJSContent && field.key) {
-            const code = String(field.templateJSContent).trim()
-            logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: Found templatejs-block field "${field.key}" with ${code.length} chars of code`)
-            logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: JavaScript code: ${code.substring(0, 200)}${code.length > 200 ? '...' : ''}`)
-            if (code) {
-              templateJSBlocks.push(code)
-            }
-          }
-        })
-        
-        if (templateJSBlocks.length === 0) {
-          await showMessage('No TemplateJS block found in form fields. Please add a TemplateJS Block field to your form with the JavaScript code to execute.')
-          return null
-        }
+  // Mark form values as JSON for templating plugin
+  formValues['__isJSON__'] = true
+  const shouldOpenInEditor = data.shouldOpenInEditor !== false // Default to true if not set
 
-        // Combine all TemplateJS blocks (they will be executed in order)
-        // Format as templatejs code blocks
-        const finalTemplateBody = templateJSBlocks.map((code) => `\`\`\`templatejs\n${code}\n\`\`\``).join('\n')
-
-        // Build form values for rendering (filter out __isJSON__ flag)
-        const formValuesForRendering = { ...formValues }
-        delete formValuesForRendering.__isJSON__
-
-        logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: formValues keys: ${Object.keys(formValuesForRendering).join(', ')}`)
-        logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: templateBody length: ${finalTemplateBody.length} chars`)
-
-        // Execute JavaScript directly using templating plugin's render command
-        // This will process the templatejs blocks, convert them to EJS, and execute them with form values as context
-        try {
-          logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: About to execute JavaScript with form values: ${JSON.stringify(formValuesForRendering)}`)
-          const result = await DataStore.invokePluginCommandByName('render', 'np.Templating', [finalTemplateBody, formValuesForRendering])
-          logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: render result type=${typeof result}, length=${result?.length || 0}, includes AI marker=${String(result?.includes?.('==**Templating Error Found**') || false)}`)
-          
-          // Check if result contains AI analysis (error message from template rendering)
-          if (result && typeof result === 'string' && result.includes('==**Templating Error Found**')) {
-            logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: AI analysis result detected, storing in reactWindowData.pluginData.aiAnalysisResult`)
-            // Store AI analysis result in reactWindowData so it can be passed back to React window
-            if (!reactWindowData.pluginData) {
-              reactWindowData.pluginData = {}
-            }
-            ;(reactWindowData.pluginData: any).aiAnalysisResult = result
-            logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: AI analysis stored, reactWindowData.pluginData.aiAnalysisResult length=${reactWindowData.pluginData.aiAnalysisResult?.length || 0}`)
-          } else {
-            logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: No AI analysis result detected in render result`)
-          }
-          
-          logDebug(pluginJson, `handleSubmitButtonClick: run-js-only: JavaScript executed successfully, result length: ${result?.length || 0} chars`)
-          // Result is typically empty for JS-only execution (no output expected, just side effects like creating folders)
-          // Note: If folders aren't being created, check that the JavaScript code uses the correct folder paths
-          // For example, if parentFolder is "DELETEME" and folderName is "tetpara", the code should use:
-          // DataStore.createFolder(`${parentFolder}/${folderName}`) or similar
-        } catch (error) {
-          logError(pluginJson, `handleSubmitButtonClick: run-js-only: Error executing JavaScript: ${error.message}`)
-          logError(pluginJson, `handleSubmitButtonClick: run-js-only: Error stack: ${error.stack}`)
-          await showMessage(`Error executing JavaScript: ${error.message}`)
-          return null
-        }
-      } else if (method === 'create-new') {
-        // Option B: Create New Note
-        const { newNoteTitle, newNoteFolder, space } = data
-        // Clean newNoteTitle: trim and remove any newlines (defensive)
-        const cleanedNewNoteTitle = newNoteTitle ? String(newNoteTitle).replace(/\n/g, ' ').trim() : ''
-        if (!cleanedNewNoteTitle) {
-          await showMessage('No new note title was specified. Please set a new note title in your form settings.')
-          return null
-        }
+  // Determine processing method
+  const method = processingMethod || (receivingTemplateTitle ? 'form-processor' : 'write-existing')
 
-        // NOTE: We do NOT pre-render newNoteTitle here anymore.
-        // TemplateRunner now handles rendering in handleNewNoteCreation.
-        // This ensures consistent behavior: TemplateRunner always renders newNoteTitle, regardless of which path is taken.
-        // The form values are spread into templateRunnerArgs below so TemplateRunner can access them for rendering.
-
-        // Get templateBody from reactWindowData (loaded from template codeblock) or from data, otherwise build from form values
-        const templateBody = reactWindowData?.pluginData?.templateBody || data?.templateBody || ''
-        const baseTemplateBody =
-          templateBody ||
-          Object.keys(formValues)
-            .filter((key) => key !== '__isJSON__')
-            .map((key) => `${key}: <%- ${key} %>`)
-            .join('\n')
-
-        // Insert TemplateJS blocks into templateBody based on executeTiming
-        const formFields = reactWindowData?.pluginData?.formFields || []
-        const finalTemplateBody = insertTemplateJSBlocks(baseTemplateBody, formFields)
-
-        // NOTE: We do NOT pre-render templateBody here anymore.
-        // TemplateRunner now handles rendering in handleNewNoteCreation (for create-new) and renderTemplate (for write-existing).
-        // This ensures consistent behavior: TemplateRunner always renders templateBody, regardless of which path is taken.
-        // The form values are spread into templateRunnerArgs below so TemplateRunner can access them for rendering.
-
-        // Build frontmatter object for TemplateRunner
-        // Spread formValues into templateRunnerArgs so they're available for rendering template tags in templateBody
-        // Filter out __isJSON__ flag as it's not needed for rendering
-        const formValuesForRendering = { ...formValues }
-        delete formValuesForRendering.__isJSON__
-
-        const templateRunnerArgs: { [string]: any } = {
-          newNoteTitle: cleanedNewNoteTitle, // TemplateRunner will render this with form values in handleNewNoteCreation
-          templateBody: finalTemplateBody, // TemplateRunner will render this with form values in handleNewNoteCreation
-          ...formValuesForRendering, // Spread form values so TemplateRunner can render template tags like <%- field1 %>
-        }
+  // Add shouldOpenInEditor to data for processing functions
+  data.shouldOpenInEditor = shouldOpenInEditor
 
-        // Set folder - use '/' for root folder if empty, otherwise use the specified folder
-        // If space (teamspace) is set and folder doesn't already have teamspace prefix, prepend it
-        // Don't pass null as DataStore.newNote treats null as the literal string "null"
-        let folderPath = newNoteFolder && newNoteFolder.trim() ? newNoteFolder.trim() : '/'
-        
-        // If space is set (teamspace) and folder doesn't already have teamspace prefix, prepend it
-        if (space && space.trim() && !folderPath.startsWith('%%NotePlanCloud%%')) {
-          // Construct teamspace folder path: %%NotePlanCloud%%/{teamspaceID}/{folder}
-          // Note: teamspace folder format requires / after %%NotePlanCloud%%
-          if (folderPath === '/' || folderPath === '') {
-            folderPath = `%%NotePlanCloud%%/${space}/`
-          } else {
-            // Remove leading slash from folderPath if present (we'll add it after teamspace prefix)
-            const cleanFolder = folderPath.startsWith('/') ? folderPath.slice(1) : folderPath
-            folderPath = `%%NotePlanCloud%%/${space}/${cleanFolder}`
-          }
-          logDebug(pluginJson, `handleSubmitButtonClick: Prefixed folder with teamspace: ${folderPath}`)
-        }
-        
-        templateRunnerArgs.folder = folderPath
-
-        clo(templateRunnerArgs, `handleSubmitButtonClick: Using create-new, calling templateRunner with args`)
-        const templateRunnerResult = await DataStore.invokePluginCommandByName('templateRunner', 'np.Templating', ['', shouldOpenInEditor, templateRunnerArgs])
-        logDebug(pluginJson, `handleSubmitButtonClick: templateRunner result type=${typeof templateRunnerResult}, length=${templateRunnerResult?.length || 0}, includes AI marker=${String(templateRunnerResult?.includes?.('==**Templating Error Found**') || false)}`)
-        // Check if result contains AI analysis (error message from template rendering)
-        if (templateRunnerResult && typeof templateRunnerResult === 'string' && templateRunnerResult.includes('==**Templating Error Found**')) {
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis result detected, storing in reactWindowData.pluginData.aiAnalysisResult`)
-          // Store AI analysis result in reactWindowData so it can be passed back to React window
-          if (!reactWindowData.pluginData) {
-            reactWindowData.pluginData = {}
-          }
-          ;(reactWindowData.pluginData: any).aiAnalysisResult = templateRunnerResult
-          logDebug(pluginJson, `handleSubmitButtonClick: AI analysis stored, reactWindowData.pluginData.aiAnalysisResult length=${reactWindowData.pluginData.aiAnalysisResult?.length || 0}`)
-        } else {
-          logDebug(pluginJson, `handleSubmitButtonClick: No AI analysis result detected in templateRunner result`)
-        }
-      } else {
-        logError(pluginJson, `handleSubmitButtonClick: Unknown processing method: ${method}`)
-        await showMessage(`Unknown processing method: ${method}`)
-        return null
-      }
-    } else {
-      logError(pluginJson, `handleSubmitButtonClick: formValues is undefined`)
-    }
+  // Route to appropriate processing method
+  let result: PassedData | null = null
+  if (method === 'form-processor') {
+    result = await processFormProcessor(data, reactWindowData)
+  } else if (method === 'create-new') {
+    result = await processCreateNew(data, reactWindowData)
+  } else if (method === 'write-existing') {
+    result = await processWriteExisting(data, reactWindowData)
+  } else if (method === 'run-js-only') {
+    result = await processRunJSOnly(data, reactWindowData)
   } else {
-    logDebug(pluginJson, `handleSubmitButtonClick: formValues is undefined`)
+    logError(pluginJson, `handleSubmitButtonClick: Unknown processing method: ${method}`)
+    await showMessage(`Unknown processing method: ${method}`)
+    return null
+  }
+
+  // Return result (null on error, or updated reactWindowData on success)
+  if (result === null) {
+    return null
   }
-  logDebug(pluginJson, `handleSubmitButtonClick: Returning reactWindowData, has aiAnalysisResult=${String(!!reactWindowData?.pluginData?.aiAnalysisResult)}, aiAnalysisResult length=${reactWindowData?.pluginData?.aiAnalysisResult?.length || 0}`)
+  logDebug(
+    pluginJson,
+    `handleSubmitButtonClick: Returning reactWindowData, has aiAnalysisResult=${String(!!reactWindowData?.pluginData?.aiAnalysisResult)}, aiAnalysisResult length=${
+      reactWindowData?.pluginData?.aiAnalysisResult?.length || 0
+    }`,
+  )
   return reactWindowData
 }
diff --git a/dwertheimer.Forms/src/templateIO.js b/dwertheimer.Forms/src/templateIO.js
index 970f0cf64..cc89f1e5a 100644
--- a/dwertheimer.Forms/src/templateIO.js
+++ b/dwertheimer.Forms/src/templateIO.js
@@ -110,22 +110,16 @@ export async function saveFormFieldsToTemplate(templateFilename: string, fields:
  * @returns {Promise<void>}
  */
 // Buffer buster padding for NotePlan's console
-const BUFFER_BUSTER_PAD = `${'\n'.repeat(5)}${'.'.repeat(10000)}/`
-
-function bustLog(message: string): void {
-  console.log(`${message}${BUFFER_BUSTER_PAD}`)
-}
-
 export async function saveTemplateBodyToTemplate(templateFilename: string, templateBody: string): Promise<void> {
   try {
-    bustLog(`[saveTemplateBodyToTemplate] ENTRY - templateFilename="${templateFilename}", templateBody length=${templateBody?.length || 0}`)
+    logDebug(pluginJson, `saveTemplateBodyToTemplate: ENTRY - templateFilename="${templateFilename}", templateBody length=${templateBody?.length || 0}`)
     let cleanedBody = templateBody || ''
     
     // IMPORTANT: Check if the content coming from React is already corrupted
     // This can happen if the data was corrupted when sent through the bridge
     // We should fix it before saving to prevent the corruption from persisting
     // Note: isDoubleEncoded and fixDoubleEncoded are already imported at the top of the file
-    bustLog(`[saveTemplateBodyToTemplate] About to check for double encoding`)
+    logDebug(pluginJson, `saveTemplateBodyToTemplate: About to check for double encoding`)
     if (cleanedBody && isDoubleEncoded(cleanedBody)) {
       logDebug(pluginJson, `saveTemplateBodyToTemplate: Detected corruption in content from React, fixing before save`)
       const fixed = fixDoubleEncoded(cleanedBody)
@@ -150,7 +144,7 @@ export async function saveTemplateBodyToTemplate(templateFilename: string, templ
     }
     
     // Use generalized helper function (no formatting needed for templateBody, it's already a string)
-    bustLog(`[saveTemplateBodyToTemplate] About to call saveCodeBlockToNote`)
+    logDebug(pluginJson, `saveTemplateBodyToTemplate: About to call saveCodeBlockToNote`)
     await saveCodeBlockToNote(
       templateFilename,
       templateBodyCodeBlockType,
@@ -159,9 +153,9 @@ export async function saveTemplateBodyToTemplate(templateFilename: string, templ
       null, // No format function needed
       false, // Don't show error messages to user (silent operation)
     )
-    bustLog(`[saveTemplateBodyToTemplate] Successfully saved codeblock`)
+    logDebug(pluginJson, `saveTemplateBodyToTemplate: Successfully saved codeblock`)
   } catch (error) {
-    bustLog(`[saveTemplateBodyToTemplate] ERROR: ${error.message || String(error)}`)
+    logDebug(pluginJson, `saveTemplateBodyToTemplate: ERROR: ${error.message || String(error)}`)
     logError(pluginJson, `saveTemplateBodyToTemplate error: ${JSP(error)}`)
   }
 }
@@ -402,8 +396,18 @@ export async function updateReceivingTemplateWithFields(receivingTemplateTitle:
     
     logDebug(pluginJson, `[${updateId}] updateReceivingTemplateWithFields: Found receiving note: "${receivingNote.filename}", type="${receivingNote.frontmatterAttributes?.type || 'none'}"`)
 
-    // Extract fields that have keys (only fields that have keys, excluding separators and headings)
-    const fieldsWithKeys = fields.filter((f) => f.key && f.type !== 'separator' && f.type !== 'heading')
+    // Extract fields that have keys (only fields that have keys, excluding separators, headings, templatejs-block, and other display-only fields)
+    const fieldsWithKeys = fields.filter(
+      (f) =>
+        f.key &&
+        f.type !== 'separator' &&
+        f.type !== 'heading' &&
+        f.type !== 'templatejs-block' &&
+        f.type !== 'markdown-preview' &&
+        f.type !== 'button' &&
+        f.type !== 'table-of-contents' &&
+        f.type !== 'comment',
+    )
 
     logDebug(pluginJson, `[${updateId}] updateReceivingTemplateWithFields: Found ${fieldsWithKeys.length} fields with keys to add`)
 
diff --git a/dwertheimer.Forms/src/windowManagement.js b/dwertheimer.Forms/src/windowManagement.js
index 1b1b35746..14565a8c0 100644
--- a/dwertheimer.Forms/src/windowManagement.js
+++ b/dwertheimer.Forms/src/windowManagement.js
@@ -470,6 +470,10 @@ export async function openFormBuilderWindow(argObj: Object): Promise<void> {
       // No templateFilename means this is a new form
       isNewForm = true
     }
+    // Allow explicit override (e.g., when creating a new form but note already exists)
+    if (argObj.isNewForm !== undefined) {
+      isNewForm = argObj.isNewForm
+    }
 
     // Generate unique window ID based on template title/filename
     const windowId = getFormBuilderWindowId(templateTitleForWindow, argObj.templateFilename)
@@ -498,7 +502,7 @@ export async function openFormBuilderWindow(argObj: Object): Promise<void> {
         windowId: windowId, // Store window ID in pluginData so React can send it in requests
         templateTeamspaceID: templateTeamspaceID, // Pass template's teamspace ID as default space for form operations
         templateTeamspaceTitle: templateTeamspaceTitle, // Pass template's teamspace title for display
-        logBufferBuster: true, // Enable buffer buster for logging infinite renders to prevent log when buffering is keeping it from showing all messages
+        // logBufferBuster: true, // Enable buffer buster for logging infinite renders to prevent log when buffering is keeping it from showing all messages
       },
       title: templateTitleForWindow
         ? templateTeamspaceTitle
diff --git a/helpers/CHANGELOG.md b/helpers/CHANGELOG.md
deleted file mode 100644
index 15e48af61..000000000
--- a/helpers/CHANGELOG.md
+++ /dev/null
@@ -1,37 +0,0 @@
-# NotePlan Plugin Helpers Changelog
-
-### Plugin Versioning Uses Semver
-All NotePlan plugins follow `semver` versioning. For details, please refer to [semver website](https://semver.org/)
-
-### About NotePlan Plugin Helpers
-See NotePlan Plugin Helpers [README](https://github.com/NotePlan/plugins/blob/main/helpers/README.md) for details on available commands and use case.
-
-## [Unreleased] - 2026-01-12 @dwertheimer
-
-### Fixed
-- **SearchableChooser.jsx**: Fixed portal positioning when dropdown is inside a scrollable parent container - now listens for scroll events on all scrollable parent elements, not just window scroll. This fixes dropdowns appearing at incorrect positions when the parent container is scrolled.
-- **NPFrontMatter.js**: Fixed `updateFrontMatterVars()` to remove empty frontmatter blocks when the last field is deleted. Previously, when deleting the last frontmatter field (e.g., `favorite: true`), the function would remove the field but leave the empty frontmatter delimiters (`---\n---`) at the top of the note. Now it properly detects when no fields remain and removes the entire frontmatter block including the separators.
-
-### Changed
-- **NoteChooser.jsx**: Enhanced `filterByType` prop to accept either a single string or an array of strings, allowing filtering by multiple frontmatter types (e.g., `filterByType={['forms-processor', 'template-runner']}`)
-
-## [0.0.4] - 2022-02-03 (mikeerickson)
-
-- Renamed `configuration.js` to `NPConfiguration.js` to properly align with naming conventions
-
-## [0.0.3] - 2022-02-03 (mikeerickson)
-
-- Removed async `configuration :: updateSettingsData
-
-## [0.0.2] - 2022-02-03 (mikeerickson)
-
-- Added `configuration :: updateSettingsData
-- Updated `configuration :: migrateConfiguration
-
-## [0.0.1] - 2022-02-01 (mikeerickson)
-
-- Added `configuration :: migrateConfiguration
-
-## Changelog
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
diff --git a/helpers/NPnote.js b/helpers/NPnote.js
index 6a2ce9260..b63c1e4fb 100644
--- a/helpers/NPnote.js
+++ b/helpers/NPnote.js
@@ -45,7 +45,7 @@ export type NoteOption = {
 
 const pluginJson = 'NPnote.js'
 
-export const TEAMSPACE_ICON_COLOR = 'green-800'
+export const TEAMSPACE_ICON_COLOR = 'green-700'
 
 // Define icons to use in decorated CommandBar options
 export const defaultNoteIconDetails = { icon: 'file-lines', color: 'gray-500', alpha: 0.7, darkAlpha: 0.7 }
@@ -252,7 +252,7 @@ export function getNoteDecorationForReact(note: TNote | NoteOption): { icon: str
   const folderIconDetails = noteIconsToUse.find((details) => details.firstLevelFolder === noteTypeForIcon) ?? defaultNoteIconDetails
 
   // Determine color - use same logic as chooseNoteV2
-  const isTeamspace = possTeamspaceDetails.isTeamspace || (note.isTeamspaceNote === true)
+  const isTeamspace = possTeamspaceDetails.isTeamspace || note.isTeamspaceNote === true
   const color = isTeamspace ? TEAMSPACE_ICON_COLOR : userSetIconColor ? userSetIconColor : folderIconDetails.color
 
   // Short description - use same logic as chooseNoteV2
diff --git a/helpers/colors.js b/helpers/colors.js
index 3d6ec94ef..561294324 100644
--- a/helpers/colors.js
+++ b/helpers/colors.js
@@ -31,3 +31,156 @@ export const getAltColor = (bgColor, strength = 0.2) => {
 // export const howDifferentAreTheseColors = (a: string, b: string): number => chroma.deltaE(a, b)
 // NOTE: DO NOT FLOW TYPE THIS FUNCTION. IT IS IMPORTED BY JSX FILE AND FOR SOME REASON, ROLLUP CHOKES ON FLOW
 export const howDifferentAreTheseColors = (a, b) => (a && b ? chroma.deltaE(a, b) : null)
+
+/**
+ * Tailwind CSS default color palette (hex values)
+ * Based on Tailwind CSS v3 default colors: https://tailwindcss.com/docs/customizing-colors
+ * This allows any Tailwind color name (e.g., 'gray-500', 'blue-500', 'orange-500') to be converted to hex values
+ */
+// NOTE: DO NOT FLOW TYPE THIS. IT IS IMPORTED BY JSX FILE AND FOR SOME REASON, ROLLUP CHOKES ON FLOW
+const TAILWIND_COLORS = {
+  // Gray scale
+  'gray-50': '#f9fafb',
+  'gray-100': '#f3f4f6',
+  'gray-200': '#e5e7eb',
+  'gray-300': '#d1d5db',
+  'gray-400': '#9ca3af',
+  'gray-500': '#6b7280',
+  'gray-600': '#4b5563',
+  'gray-700': '#374151',
+  'gray-800': '#1f2937',
+  'gray-900': '#111827',
+  'gray-950': '#030712',
+  // Red
+  'red-50': '#fef2f2',
+  'red-100': '#fee2e2',
+  'red-200': '#fecaca',
+  'red-300': '#fca5a5',
+  'red-400': '#f87171',
+  'red-500': '#ef4444',
+  'red-600': '#dc2626',
+  'red-700': '#b91c1c',
+  'red-800': '#991b1b',
+  'red-900': '#7f1d1d',
+  'red-950': '#450a0a',
+  // Orange
+  'orange-50': '#fff7ed',
+  'orange-100': '#ffedd5',
+  'orange-200': '#fed7aa',
+  'orange-300': '#fdba74',
+  'orange-400': '#fb923c',
+  'orange-500': '#f97316',
+  'orange-600': '#ea580c',
+  'orange-700': '#c2410c',
+  'orange-800': '#9a3412',
+  'orange-900': '#7c2d12',
+  'orange-950': '#431407',
+  // Yellow
+  'yellow-50': '#fefce8',
+  'yellow-100': '#fef9c3',
+  'yellow-200': '#fef08a',
+  'yellow-300': '#fde047',
+  'yellow-400': '#facc15',
+  'yellow-500': '#eab308',
+  'yellow-600': '#ca8a04',
+  'yellow-700': '#a16207',
+  'yellow-800': '#854d0e',
+  'yellow-900': '#713f12',
+  'yellow-950': '#422006',
+  // Green
+  'green-50': '#f0fdf4',
+  'green-100': '#dcfce7',
+  'green-200': '#bbf7d0',
+  'green-300': '#86efac',
+  'green-400': '#4ade80',
+  'green-500': '#22c55e',
+  'green-600': '#16a34a',
+  'green-700': '#15803d',
+  'green-800': '#166534',
+  'green-900': '#14532d',
+  'green-950': '#052e16',
+  // Blue
+  'blue-50': '#eff6ff',
+  'blue-100': '#dbeafe',
+  'blue-200': '#bfdbfe',
+  'blue-300': '#93c5fd',
+  'blue-400': '#60a5fa',
+  'blue-500': '#3b82f6',
+  'blue-600': '#2563eb',
+  'blue-700': '#1d4ed8',
+  'blue-800': '#1e40af',
+  'blue-900': '#1e3a8a',
+  'blue-950': '#172554',
+  // Indigo
+  'indigo-50': '#eef2ff',
+  'indigo-100': '#e0e7ff',
+  'indigo-200': '#c7d2fe',
+  'indigo-300': '#a5b4fc',
+  'indigo-400': '#818cf8',
+  'indigo-500': '#6366f1',
+  'indigo-600': '#4f46e5',
+  'indigo-700': '#4338ca',
+  'indigo-800': '#3730a3',
+  'indigo-900': '#312e81',
+  'indigo-950': '#1e1b4b',
+  // Purple
+  'purple-50': '#faf5ff',
+  'purple-100': '#f3e8ff',
+  'purple-200': '#e9d5ff',
+  'purple-300': '#d8b4fe',
+  'purple-400': '#c084fc',
+  'purple-500': '#a855f7',
+  'purple-600': '#9333ea',
+  'purple-700': '#7e22ce',
+  'purple-800': '#6b21a8',
+  'purple-900': '#581c87',
+  'purple-950': '#3b0764',
+  // Pink
+  'pink-50': '#fdf2f8',
+  'pink-100': '#fce7f3',
+  'pink-200': '#fbcfe8',
+  'pink-300': '#f9a8d4',
+  'pink-400': '#f472b6',
+  'pink-500': '#ec4899',
+  'pink-600': '#db2777',
+  'pink-700': '#be185d',
+  'pink-800': '#9f1239',
+  'pink-900': '#831843',
+  'pink-950': '#500724',
+}
+
+/**
+ * Convert a color value to CSS color string
+ * Supports CSS variables (e.g., 'teamspace-color'), Tailwind color names (e.g., 'gray-500', 'blue-500', 'green-700'),
+ * and direct colors (e.g., '#8cbb9b', 'rgb(...)', 'rgba(...)')
+ *
+ * Tailwind colors are converted to their hex values. Special mappings allow some colors to use CSS variables
+ * with hex fallbacks (e.g., green-700 can use --teamspace-color if available).
+ *
+ * @param {?string} color - Color value (CSS variable name, Tailwind color name, or direct color)
+ * @returns {?string} CSS color string or undefined
+ */
+// NOTE: DO NOT FLOW TYPE THIS FUNCTION. IT IS IMPORTED BY JSX FILE AND FOR SOME REASON, ROLLUP CHOKES ON FLOW
+export const getColorStyle = (color) => {
+  if (!color) return undefined
+  // If it's a direct color (hex, rgb, rgba), use it as-is
+  if (color.startsWith('#') || color.startsWith('rgb')) {
+    return color
+  }
+  // Special mappings: Tailwind colors that should prefer CSS variables with hex fallbacks
+  // These match what NotePlan uses internally and what's defined in helper CSS files
+  const specialMappings = {
+    'green-700': { var: 'teamspace-color', fallback: TAILWIND_COLORS['green-700'] || '#15803d' },
+  }
+  // Check for special mappings first
+  const specialMapping = specialMappings[color]
+  if (specialMapping) {
+    return `var(--${specialMapping.var}, ${specialMapping.fallback})`
+  }
+  // Check if it's a Tailwind color name (format: colorName-number, e.g., 'gray-500')
+  if (TAILWIND_COLORS[color]) {
+    return TAILWIND_COLORS[color]
+  }
+  // Otherwise, treat it as a CSS variable name (fallback to inherit if not defined)
+  return `var(--${color}, inherit)`
+}
diff --git a/helpers/react/DynamicDialog/ContainedMultiSelectChooser.css b/helpers/react/DynamicDialog/ContainedMultiSelectChooser.css
index b5ac7d270..036ad458b 100644
--- a/helpers/react/DynamicDialog/ContainedMultiSelectChooser.css
+++ b/helpers/react/DynamicDialog/ContainedMultiSelectChooser.css
@@ -58,8 +58,8 @@
   position: relative;
   display: flex;
   align-items: center;
-  flex: 1;
-  min-width: 150px;
+  flex: 0.6;
+  min-width: 130px;
 }
 
 .contained-multi-select-search-input {
@@ -136,9 +136,13 @@
   border-radius: 4px;
   color: var(--tint-color, #dc8a78);
   cursor: pointer;
-  font-size: 0.85rem;
-  padding: 0.4rem 0.75rem;
-  white-space: nowrap;
+  font-size: 0.9rem;
+  padding: 0.4rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2rem;
+  height: 2rem;
   background-color: var(--bg-main-color, #eff1f5);
 }
 
@@ -205,9 +209,13 @@
   border-radius: 4px;
   color: var(--tint-color, #dc8a78);
   cursor: pointer;
-  font-size: 0.85rem;
-  padding: 0.4rem 0.75rem;
-  white-space: nowrap;
+  font-size: 0.9rem;
+  padding: 0.4rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2rem;
+  height: 2rem;
   background-color: var(--bg-main-color, #eff1f5);
 }
 
@@ -223,6 +231,39 @@
   background-color: var(--bg-disabled-color, #f5f5f5);
 }
 
+/* Checked filter button */
+.contained-multi-select-checked-filter-btn {
+  background: none;
+  border: 1px solid var(--divider-color, #CDCFD0);
+  border-radius: 4px;
+  color: var(--tint-color, #dc8a78);
+  cursor: pointer;
+  font-size: 0.9rem;
+  padding: 0.4rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2rem;
+  height: 2rem;
+  background-color: var(--bg-main-color, #eff1f5);
+}
+
+.contained-multi-select-checked-filter-btn:hover {
+  background-color: var(--bg-alt-color, #e6e9ef);
+}
+
+.contained-multi-select-checked-filter-btn.active {
+  background-color: var(--tint-color, #dc8a78);
+  color: var(--bg-main-color, #eff1f5);
+  border-color: var(--tint-color, #dc8a78);
+}
+
+.contained-multi-select-checked-filter-btn:disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+  background-color: var(--bg-disabled-color, #f5f5f5);
+}
+
 /* List container */
 .contained-multi-select-list-container {
   overflow-y: auto;
diff --git a/helpers/react/DynamicDialog/ContainedMultiSelectChooser.jsx b/helpers/react/DynamicDialog/ContainedMultiSelectChooser.jsx
index 6fed3203c..4a917a0d7 100644
--- a/helpers/react/DynamicDialog/ContainedMultiSelectChooser.jsx
+++ b/helpers/react/DynamicDialog/ContainedMultiSelectChooser.jsx
@@ -32,6 +32,7 @@ export type ContainedMultiSelectChooserProps = {
   onCreate?: (newItem: string) => Promise<void> | void, // Callback when creating a new item
   singleValue?: boolean, // If true, allow selecting only one value (no checkboxes, returns single value) (default: false)
   renderAsDropdown?: boolean, // If true and singleValue is true, render as dropdown-select instead of filterable chooser (default: false)
+  fieldKey?: string, // Unique key for this field instance (used to generate unique input id)
 }
 
 /**
@@ -64,12 +65,17 @@ export function ContainedMultiSelectChooser({
   onCreate,
   singleValue = false,
   renderAsDropdown = false,
+  fieldKey,
 }: ContainedMultiSelectChooserProps): React$Node {
   const searchInputRef = useRef<?HTMLInputElement>(null)
   const [showCreateMode, setShowCreateMode] = useState<boolean>(false)
   const [createValue, setCreateValue] = useState<string>('')
   const [isCreating, setIsCreating] = useState<boolean>(false)
   const [showList, setShowList] = useState<boolean>(true) // For single-value mode: show list or show selected value
+  const [showCheckedOnly, setShowCheckedOnly] = useState<boolean>(false) // Toggle to show only checked items
+  
+  // Generate unique input id - use fieldKey if provided, otherwise fallback to fieldType with random suffix
+  const inputId = fieldKey ? `${fieldType}-${fieldKey}-search` : `${fieldType}-search-${Math.random().toString(36).substr(2, 9)}`
 
   // Filter items based on include/exclude patterns
   const filteredItems = useMemo(() => {
@@ -106,10 +112,12 @@ export function ContainedMultiSelectChooser({
   // Initialize from defaultChecked when items first load (only once, when filteredItems becomes available)
   useEffect(() => {
     if (!defaultInitializedRef.current && defaultChecked && (!value || value === '' || (Array.isArray(value) && value.length === 0)) && filteredItems.length > 0) {
-      setSelectedValues(filteredItems)
+      // Filter out "is:checked" to prevent it from being saved as a value
+      const filtered = filteredItems.filter((item: string) => item.toLowerCase() !== 'is:checked')
+      setSelectedValues(filtered)
       defaultInitializedRef.current = true
       // Format and store the value we just set
-      const formattedItems = filteredItems.map((item: string) => getItemDisplayLabel(item))
+      const formattedItems = filtered.map((item: string) => getItemDisplayLabel(item))
       const newValue: string | Array<string> = returnAsArray ? formattedItems : formattedItems.join(',')
       lastSyncedValueRef.current = newValue
       // Call onChange to notify parent component of the initial value
@@ -184,6 +192,8 @@ export function ContainedMultiSelectChooser({
         parsed = Array.from(new Set(cleaned))
       }
     }
+    // Filter out "is:checked" to prevent it from being saved as a value
+    parsed = parsed.filter((item: string) => item.toLowerCase() !== 'is:checked')
     setSelectedValues(parsed)
     // Update ref to track what we synced
     lastSyncedValueRef.current = value
@@ -201,14 +211,41 @@ export function ContainedMultiSelectChooser({
     return maxHeight
   }, [height, maxRows, maxHeight])
 
-  // Filter items based on search term
+  // Filter items based on search term and checked filter
+  // Also include selected items that aren't in filteredItems yet (e.g., newly created items)
+  // Always filter out "is:checked" to prevent it from being displayed or saved
   const displayItems = useMemo(() => {
+    const filterOutIsChecked = (items: Array<string>) => items.filter((item: string) => item.toLowerCase() !== 'is:checked')
+    
+    // If checked filter is active, show only checked items
+    if (showCheckedOnly) {
+      return filterOutIsChecked(selectedValues)
+    }
+    
+    // Normal filtering based on search term
     if (!searchTerm.trim()) {
-      return filteredItems
+      // No search term: show all filtered items plus any selected items not yet in the list
+      const selectedNotInList = selectedValues.filter((selected: string) => !filteredItems.includes(selected))
+      return filterOutIsChecked([...filteredItems, ...selectedNotInList])
     }
+    
     const term = searchTerm.toLowerCase()
-    return filteredItems.filter((item: string) => item.toLowerCase().includes(term))
-  }, [filteredItems, searchTerm])
+    // Check if search term is "is:checked" to show only checked items
+    if (term === 'is:checked') {
+      // Show only checked items
+      return filterOutIsChecked(selectedValues)
+    }
+    
+    // Regular search filtering
+    const filtered = filteredItems.filter((item: string) => item.toLowerCase().includes(term))
+    // Also include selected items that match the search term but aren't in filteredItems yet
+    const selectedMatching = selectedValues.filter(
+      (selected: string) => 
+        !filteredItems.includes(selected) && 
+        selected.toLowerCase().includes(term)
+    )
+    return filterOutIsChecked([...filtered, ...selectedMatching])
+  }, [filteredItems, searchTerm, selectedValues, showCheckedOnly])
 
   // For single-value mode: determine if we should show the list or the selected value
   const hasSelectedValue = singleValue && selectedValues.length > 0
@@ -225,10 +262,11 @@ export function ContainedMultiSelectChooser({
   }, [singleValue, selectedValues.length])
 
   // Show create mode automatically when search has no matches and allowCreate is true
+  // Skip create mode when "is:checked" filter is active
   useEffect(() => {
-    logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Effect triggered: searchTerm="${searchTerm}", displayItems.length=${displayItems.length}, filteredItems.length=${filteredItems.length}, showCreateMode=${String(showCreateMode)}`)
+    logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Effect triggered: searchTerm="${searchTerm}", displayItems.length=${displayItems.length}, filteredItems.length=${filteredItems.length}, showCreateMode=${String(showCreateMode)}, showCheckedOnly=${String(showCheckedOnly)}`)
     
-    if (allowCreate && searchTerm.trim() && displayItems.length === 0 && filteredItems.length > 0) {
+    if (allowCreate && searchTerm.trim() && searchTerm.toLowerCase() !== 'is:checked' && !showCheckedOnly && displayItems.length === 0 && filteredItems.length > 0) {
       // No matches found for the search term, show create mode with the search term pre-filled
       if (!showCreateMode) {
         logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Auto-showing create mode with searchTerm="${searchTerm.trim()}"`)
@@ -241,12 +279,18 @@ export function ContainedMultiSelectChooser({
       setShowCreateMode(false)
       setCreateValue('')
     }
-  }, [displayItems.length, searchTerm, filteredItems.length, allowCreate, showCreateMode])
+  }, [displayItems.length, searchTerm, filteredItems.length, allowCreate, showCreateMode, showCheckedOnly])
 
   // Handle checkbox toggle (multi-select) or item selection (single-value)
   const handleToggle = (itemName: string) => {
     if (disabled) return
 
+    // Prevent "is:checked" from being added as an item
+    if (itemName.toLowerCase() === 'is:checked') {
+      logDebug('ContainedMultiSelectChooser', `handleToggle blocked: cannot add "is:checked" as an item`)
+      return
+    }
+
     if (singleValue) {
       // Single-value mode: select this item and return immediately
       const formattedValue = getItemDisplayLabel(itemName)
@@ -307,8 +351,8 @@ export function ContainedMultiSelectChooser({
   // Handle select all
   const handleSelectAll = () => {
     if (disabled) return
-    // Get unique items from displayItems (remove duplicates)
-    const allValues = Array.from(new Set(displayItems))
+    // Get unique items from displayItems (remove duplicates and filter out "is:checked")
+    const allValues = Array.from(new Set(displayItems)).filter((item: string) => item.toLowerCase() !== 'is:checked')
     setSelectedValues(allValues)
     const formattedItems = allValues.map((item: string) => getItemDisplayLabel(item))
     const newValue = returnAsArray ? formattedItems : formattedItems.join(',')
@@ -335,6 +379,7 @@ export function ContainedMultiSelectChooser({
   // Clear search
   const handleClearSearch = () => {
     setSearchTerm('')
+    setShowCheckedOnly(false)
     setShowCreateMode(false)
     setCreateValue('')
     if (searchInputRef.current) {
@@ -349,9 +394,15 @@ export function ContainedMultiSelectChooser({
       logDebug('ContainedMultiSelectChooser', `[CREATE MODE] handleNewClick blocked: disabled=${String(disabled)}, allowCreate=${String(allowCreate)}`)
       return
     }
-    logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Setting showCreateMode=true, createValue="${searchTerm.trim()}"`)
+    const trimmedSearch = searchTerm.trim()
+    // Prevent creating "is:checked" as an item
+    if (trimmedSearch.toLowerCase() === 'is:checked') {
+      logDebug('ContainedMultiSelectChooser', `[CREATE MODE] handleNewClick blocked: cannot create "is:checked" as an item`)
+      return
+    }
+    logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Setting showCreateMode=true, createValue="${trimmedSearch}"`)
     setShowCreateMode(true)
-    setCreateValue(searchTerm.trim())
+    setCreateValue(trimmedSearch)
     if (searchInputRef.current) {
       searchInputRef.current.focus()
     }
@@ -372,6 +423,15 @@ export function ContainedMultiSelectChooser({
       return
     }
 
+    // Prevent creating "is:checked" as an item
+    if (trimmedValue.toLowerCase() === 'is:checked') {
+      logDebug('ContainedMultiSelectChooser', `[CREATE MODE] handleCreateConfirm blocked: cannot create "is:checked" as an item`)
+      setShowCreateMode(false)
+      setCreateValue('')
+      setSearchTerm('')
+      return
+    }
+
     logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Starting create process for "${trimmedValue}"`)
     setIsCreating(true)
     try {
@@ -395,12 +455,12 @@ export function ContainedMultiSelectChooser({
       lastSyncedValueRef.current = newValue
       onChange(newValue)
 
-      // Reset create mode but keep the search term so the newly created item is visible and checked
-      logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Resetting create mode, keeping search term="${trimmedValue}"`)
+      // Reset create mode and clear search term
+      // The newly created item is now in selectedValues and will be visible in the selected items
+      logDebug('ContainedMultiSelectChooser', `[CREATE MODE] Resetting create mode, clearing search term`)
       setShowCreateMode(false)
       setCreateValue('')
-      // Keep the search term set to the newly created item so it appears in the filtered list
-      setSearchTerm(trimmedValue)
+      setSearchTerm('') // Clear search term so the list shows all items, including the newly created one when items are refreshed
       if (searchInputRef.current) {
         searchInputRef.current.focus()
       }
@@ -458,13 +518,14 @@ export function ContainedMultiSelectChooser({
         {/* Top row: Label (compact), Filter, Clear, Select All, Select None */}
         <div className="contained-multi-select-header">
           {label && compactDisplay && (
-            <label className="contained-multi-select-label-compact" htmlFor={`${fieldType}-search`}>
+            <label className="contained-multi-select-label-compact" htmlFor={inputId}>
               {label}
             </label>
           )}
           <div className="contained-multi-select-search-wrapper">
             <input
-              id={`${fieldType}-search`}
+              id={inputId}
+              name={fieldKey || inputId}
               ref={searchInputRef}
               type="text"
               className={`contained-multi-select-search-input ${showCreateMode ? 'create-mode' : ''} ${singleValue && hasSelectedValue && !showList ? 'single-value-selected' : ''}`}
@@ -488,10 +549,25 @@ export function ContainedMultiSelectChooser({
                   setCreateValue(inputValue)
                 } else {
                   setSearchTerm(inputValue)
+                  // Auto-toggle checked filter when user types "is:checked"
+                  if (inputValue.toLowerCase() === 'is:checked') {
+                    setShowCheckedOnly(true)
+                  } else if (showCheckedOnly && inputValue.toLowerCase() !== 'is:checked') {
+                    // If checked filter is on but search term changed, turn off the filter
+                    setShowCheckedOnly(false)
+                  }
                 }
               }}
               onClick={handleInputClick}
               onKeyDown={(e) => {
+                // Prevent Enter key from submitting the form
+                if (e.key === 'Enter') {
+                  e.preventDefault()
+                  e.stopPropagation()
+                  // Don't do anything else - just prevent form submission
+                  // The input is for filtering/searching, not for submitting
+                  return
+                }
                 // Prevent space key for tag-chooser and mention-chooser when in create mode
                 if (showCreateMode && (fieldType === 'tag-chooser' || fieldType === 'mention-chooser') && e.key === ' ') {
                   e.preventDefault()
@@ -557,7 +633,7 @@ export function ContainedMultiSelectChooser({
               disabled={disabled || showCreateMode}
               title="Create new item"
             >
-              +New
+              <i className="fa-solid fa-plus"></i>
             </button>
           )}
           {!singleValue && (
@@ -569,7 +645,7 @@ export function ContainedMultiSelectChooser({
                 disabled={disabled || displayItems.length === 0 || showCreateMode}
                 title="Select all"
               >
-                Select All
+                <i className="fa-solid fa-check-double"></i>
               </button>
               <button
                 type="button"
@@ -578,7 +654,24 @@ export function ContainedMultiSelectChooser({
                 disabled={disabled || selectedValues.length === 0}
                 title="Select none"
               >
-                Select None
+                <i className="fa-solid fa-square"></i>
+              </button>
+              <button
+                type="button"
+                className={`contained-multi-select-checked-filter-btn ${showCheckedOnly ? 'active' : ''}`}
+                onClick={() => {
+                  setShowCheckedOnly(!showCheckedOnly)
+                  // If toggling on, set search term to "is:checked", otherwise clear it
+                  if (!showCheckedOnly) {
+                    setSearchTerm('is:checked')
+                  } else {
+                    setSearchTerm('')
+                  }
+                }}
+                disabled={disabled || showCreateMode}
+                title="Show only checked items"
+              >
+                <i className="fa-solid fa-filter"></i>
               </button>
             </>
           )}
diff --git a/helpers/react/DynamicDialog/DropdownSelectChooser.jsx b/helpers/react/DynamicDialog/DropdownSelectChooser.jsx
index eea12e8e9..348f1da79 100644
--- a/helpers/react/DynamicDialog/DropdownSelectChooser.jsx
+++ b/helpers/react/DynamicDialog/DropdownSelectChooser.jsx
@@ -107,7 +107,7 @@ export function DropdownSelectChooser({
     iconClass: null, // Use arrow instead of icon
     showArrow: true, // Show down arrow on the right
     fieldType: 'dropdown-select-chooser',
-    debugLogging: true, // Enable debug logging to verify maxResults
+    debugLogging: false, // Disable debug logging by default (set to true only when debugging)
     maxResults: 25,
     inputMaxLength: 60,
     dropdownMaxLength: 80,
diff --git a/helpers/react/DynamicDialog/DynamicDialog.css b/helpers/react/DynamicDialog/DynamicDialog.css
index 02d934f31..d16778df9 100644
--- a/helpers/react/DynamicDialog/DynamicDialog.css
+++ b/helpers/react/DynamicDialog/DynamicDialog.css
@@ -53,6 +53,7 @@
         gap: 1rem;
         background-color: var(--bg-mid-color);
         padding: 0.75rem 1.0rem;
+        padding-bottom: 1.5rem; /* Extra bottom padding to prevent clipping of last element */
         border-radius: 8px;
         flex: 1;
         overflow-y: auto;
diff --git a/helpers/react/DynamicDialog/DynamicDialog.jsx b/helpers/react/DynamicDialog/DynamicDialog.jsx
index 7df1a2281..7ff72c8f3 100644
--- a/helpers/react/DynamicDialog/DynamicDialog.jsx
+++ b/helpers/react/DynamicDialog/DynamicDialog.jsx
@@ -62,6 +62,7 @@ export type TSettingItemType =
   | 'markdown-preview' // Non-editable markdown preview (static text, note by filename/title, or note from another field)
   | 'autosave' // Autosave field that saves form state periodically
   | 'table-of-contents' // Table of contents that links to headings in the form
+  | 'comment' // Comment field for Form Builder - expandable markdown textarea that doesn't render in form output
 
 export type TSettingItem = {
   type: TSettingItemType,
@@ -145,6 +146,9 @@ export type TSettingItem = {
   markdownText?: string, // for markdown-preview, static markdown text to display (if not using note)
   markdownNoteFilename?: string, // for markdown-preview, filename of note to display (alternative to markdownText)
   markdownNoteTitle?: string, // for markdown-preview, title of note to display (alternative to markdownText and markdownNoteFilename)
+  // comment options (Form Builder only - doesn't render in form output)
+  commentText?: string, // for comment, markdown text content for the comment
+  expanded?: boolean, // for comment, whether the comment is expanded (default: true)
   selectedCalendars?: Array<string>, // for event-chooser, array of calendar titles to filter events by (ignored if allCalendars=true)
   allCalendars?: boolean, // for event-chooser, if true, include events from all calendars NotePlan can access (bypasses selectedCalendars)
   calendarFilterRegex?: string, // for event-chooser, optional regex pattern to filter calendars after fetching (applied when allCalendars=true)
@@ -443,6 +447,43 @@ const DynamicDialog = ({
     previousIsOpenRef.current = isNowOpen
   }, [isOpen, updatedSettings]) // Keep updatedSettings for reading current values
 
+  // Auto-focus the first focusable field when dialog opens
+  useEffect(() => {
+    if (!isOpen) return
+
+    // Wait for DOM to be ready, then find and focus the first focusable field
+    const focusFirstField = () => {
+      const dialogElement = dialogRef.current
+      if (!dialogElement) return
+
+      // Find all focusable inputs in DOM order (excluding hidden and disabled)
+      const allInputs = Array.from(dialogElement.querySelectorAll('input:not([type="hidden"]):not([disabled])'))
+      
+      // Filter to only inputs that are visible (not in hidden containers)
+      const visibleInputs = allInputs.filter((input) => {
+        if (!(input instanceof HTMLElement)) return false
+        const style = window.getComputedStyle(input)
+        return style.display !== 'none' && style.visibility !== 'hidden' && style.opacity !== '0'
+      })
+
+      // Take the first input in DOM order (which matches the visual order of fields)
+      // This ensures we focus the first field in the form, regardless of its type
+      const firstInput = visibleInputs.length > 0 ? visibleInputs[0] : null
+
+      if (firstInput && firstInput instanceof HTMLInputElement) {
+        // Small delay to ensure the dialog is fully rendered and any animations complete
+        setTimeout(() => {
+          firstInput.focus()
+          logDebug('DynamicDialog', `Auto-focused first field: ${firstInput.id || 'unnamed'}`)
+        }, 100)
+      }
+    }
+
+    // Use a small delay to ensure DOM is ready
+    const timeoutId = setTimeout(focusFirstField, 150)
+    return () => clearTimeout(timeoutId)
+  }, [isOpen, items]) // Re-run when dialog opens or items change
+
   // Watch for dependency changes and clear values (generic - no hardcoded reload logic)
   // Handles cascading dependencies recursively (e.g., space -> note -> heading)
   useEffect(() => {
@@ -570,6 +611,12 @@ const DynamicDialog = ({
       // For regular Enter, check if the focused element is within a field that consumes Enter key
       const activeElement = document.activeElement
       if (activeElement instanceof HTMLElement) {
+        // First, check if the active element itself is a textarea (most common case)
+        if (activeElement.tagName === 'TEXTAREA') {
+          // Textareas should never submit on Enter - they create newlines
+          return
+        }
+
         // Look for the closest parent with data-field-type attribute
         const fieldContainer = activeElement.closest('[data-field-type]')
         if (fieldContainer instanceof HTMLElement) {
diff --git a/helpers/react/DynamicDialog/ExpandableTextarea.jsx b/helpers/react/DynamicDialog/ExpandableTextarea.jsx
index 917845f62..000a04377 100644
--- a/helpers/react/DynamicDialog/ExpandableTextarea.jsx
+++ b/helpers/react/DynamicDialog/ExpandableTextarea.jsx
@@ -118,7 +118,12 @@ export function ExpandableTextarea({
       }, 0)
       return
     }
-    // Allow all other keys including Enter to work normally
+    // Stop Enter key from bubbling up to prevent form submission
+    // Textareas should create newlines, not submit forms
+    if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey && !e.metaKey && !e.altKey) {
+      e.stopPropagation() // Prevent event from bubbling to DynamicDialog
+      // Don't prevent default - let the textarea handle Enter naturally to create newline
+    }
     // Call custom onKeyDown if provided
     if (onKeyDown) {
       onKeyDown(e)
diff --git a/helpers/react/DynamicDialog/FrontmatterKeyChooser.jsx b/helpers/react/DynamicDialog/FrontmatterKeyChooser.jsx
index 8431e8392..0c2574ca4 100644
--- a/helpers/react/DynamicDialog/FrontmatterKeyChooser.jsx
+++ b/helpers/react/DynamicDialog/FrontmatterKeyChooser.jsx
@@ -34,6 +34,7 @@ export type FrontmatterKeyChooserProps = {
   folderString?: string, // Folder to limit search to (optional)
   fullPathMatch?: boolean, // Whether to match full path (default: false)
   requestFromPlugin?: (command: string, dataToSend?: any, timeout?: number) => Promise<any>, // Function to request data from plugin
+  fieldKey?: string, // Unique key for this field instance (used to generate unique input id)
 }
 
 /**
@@ -66,6 +67,7 @@ export function FrontmatterKeyChooser({
   folderString = '',
   fullPathMatch = false,
   requestFromPlugin,
+  fieldKey,
 }: FrontmatterKeyChooserProps): React$Node {
   const [values, setValues] = useState<Array<string>>([])
   const [loaded, setLoaded] = useState<boolean>(false)
@@ -244,6 +246,7 @@ export function FrontmatterKeyChooser({
         allowCreate={allowCreate}
         singleValue={singleValue}
         onCreate={handleCreateValue}
+        fieldKey={fieldKey}
       />
     </div>
   )
diff --git a/helpers/react/DynamicDialog/InputBox.jsx b/helpers/react/DynamicDialog/InputBox.jsx
index 9911db0e7..6de9c2ac5 100644
--- a/helpers/react/DynamicDialog/InputBox.jsx
+++ b/helpers/react/DynamicDialog/InputBox.jsx
@@ -24,6 +24,8 @@ type InputBoxProps = {
   validationType?: 'email' | 'number' | 'date-interval',
   debounceOnChange?: boolean, // If true, debounce onChange callback (useful when this input provides a key for another field)
   debounceMs?: number, // Debounce delay in milliseconds (default: 500ms)
+  id?: string, // Optional unique id for the input (if not provided, will be generated)
+  name?: string, // Optional name attribute for the input
 }
 
 const InputBox = ({
@@ -43,6 +45,8 @@ const InputBox = ({
   validationType,
   debounceOnChange = true, // Default to true: debounce onChange to prevent excessive updates when input provides a key for another field
   debounceMs = 500,
+  id,
+  name,
 }: InputBoxProps): React$Node => {
   const [inputValue, setInputValue] = useState(value)
   const [isSaveEnabled, setIsSaveEnabled] = useState(false)
@@ -51,6 +55,10 @@ const InputBox = ({
   const inputRef = useRef<?HTMLInputElement>(null) // Create a ref for the input element
   const [validationError, setValidationError] = useState<string | null>(null) // Add state for validation error message
   const debounceTimeoutRef = useRef<?TimeoutID>(null) // Track debounce timeout
+  
+  // Generate unique id if not provided - use label or fallback
+  const inputId = id || `input-${label.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '')}-${Math.random().toString(36).substr(2, 9)}`
+  const inputName = name || id || inputId // Use name if provided, otherwise use id or generated id
 
   const validateInput = (value: string): string | null => {
     if (required && value.trim() === '') {
@@ -145,9 +153,11 @@ const InputBox = ({
 
   return (
     <div className={`${disabled ? 'disabled' : ''} ${className} ${compactDisplay ? 'input-box-container-compact' : 'input-box-container'}`}>
-      <label className="input-box-label">{label}</label>
+      <label className="input-box-label" htmlFor={inputId}>{label}</label>
       <div className="input-box-wrapper">
         <input
+          id={inputId}
+          name={inputName}
           ref={inputRef} // Attach the ref to the input element
           type={inputType}
           readOnly={readOnly}
diff --git a/helpers/react/DynamicDialog/MentionChooser.jsx b/helpers/react/DynamicDialog/MentionChooser.jsx
index 669fa9cd8..75585fafc 100644
--- a/helpers/react/DynamicDialog/MentionChooser.jsx
+++ b/helpers/react/DynamicDialog/MentionChooser.jsx
@@ -29,6 +29,7 @@ export type MentionChooserProps = {
   singleValue?: boolean, // If true, allow selecting only one value (no checkboxes, returns single value) (default: false)
   renderAsDropdown?: boolean, // If true and singleValue is true, render as dropdown-select instead of filterable chooser (default: false)
   requestFromPlugin?: (command: string, dataToSend?: any, timeout?: number) => Promise<any>, // Function to request data from plugin
+  fieldKey?: string, // Unique key for this field instance (used to generate unique input id)
 }
 
 /**
@@ -56,6 +57,7 @@ export function MentionChooser({
   singleValue = false,
   renderAsDropdown = false,
   requestFromPlugin,
+  fieldKey,
 }: MentionChooserProps): React$Node {
   const [mentions, setMentions] = useState<Array<string>>([])
   const [loaded, setLoaded] = useState<boolean>(false)
@@ -184,6 +186,7 @@ export function MentionChooser({
         allowCreate={allowCreate}
         singleValue={singleValue}
         onCreate={handleCreateMention}
+        fieldKey={fieldKey}
       />
     </div>
   )
diff --git a/helpers/react/DynamicDialog/NoteChooser.jsx b/helpers/react/DynamicDialog/NoteChooser.jsx
index 9fa1e3563..b3f5cc30a 100644
--- a/helpers/react/DynamicDialog/NoteChooser.jsx
+++ b/helpers/react/DynamicDialog/NoteChooser.jsx
@@ -182,24 +182,37 @@ export function NoteChooser({
   }
 
   /**
-   * Format a date string (YYYYMMDD) for display using moment
-   * @param {string} dateStr - Date string in YYYYMMDD format
-   * @returns {string} - Formatted date string (e.g., "Daily Note: Tuesday, Jan 22, 2026")
+   * Check if a value is an ISO date string (YYYY-MM-DD format)
+   * @param {string} value - The value to check
+   * @returns {boolean}
+   */
+  const isISODateString = (value: string): boolean => {
+    return /^\d{4}-\d{2}-\d{2}$/.test(value)
+  }
+
+  /**
+   * Format a date string (YYYYMMDD or YYYY-MM-DD) for display using moment
+   * @param {string} dateStr - Date string in YYYYMMDD or YYYY-MM-DD format
+   * @returns {string} - ISO 8601 date string (YYYY-MM-DD) for display
    */
   const formatDateStringForDisplay = (dateStr: string): string => {
-    if (!isDateString(dateStr)) return dateStr
-    try {
-      const year = dateStr.substring(0, 4)
-      const month = dateStr.substring(4, 6)
-      const day = dateStr.substring(6, 8)
-      const date = moment(`${year}-${month}-${day}`, 'YYYY-MM-DD')
-      if (!date.isValid()) return dateStr
-      // Format as "Daily Note: Tuesday, Jan 22, 2026"
-      return `Daily Note: ${date.format('dddd, MMM D, YYYY')}`
-    } catch (error) {
-      logError('NoteChooser', `Error formatting date: ${error.message}`)
+    // If already in ISO format, return as-is (user wants ISO format, not formatted date)
+    if (isISODateString(dateStr)) {
       return dateStr
     }
+    // If in YYYYMMDD format, convert to ISO format
+    if (isDateString(dateStr)) {
+      try {
+        const year = dateStr.substring(0, 4)
+        const month = dateStr.substring(4, 6)
+        const day = dateStr.substring(6, 8)
+        return `${year}-${month}-${day}`
+      } catch (error) {
+        logError('NoteChooser', `Error formatting date: ${error.message}`)
+        return dateStr
+      }
+    }
+    return dateStr
   }
 
   /**
@@ -615,9 +628,9 @@ export function NoteChooser({
     shortDescriptionOnLine2,
   }
 
-  // Format value for display if it's a date string
+  // Format value for display if it's a date string (YYYYMMDD or YYYY-MM-DD format)
   const displayValue = useMemo(() => {
-    if (value && isDateString(value)) {
+    if (value && (isDateString(value) || isISODateString(value))) {
       return formatDateStringForDisplay(value)
     }
     return value
@@ -685,7 +698,11 @@ export function NoteChooser({
             >
               <DayPicker
                 mode="single"
-                selected={value && isDateString(value) ? new Date(formatDateStringForDisplay(value)) : null}
+                selected={
+                  value && (isDateString(value) || isISODateString(value))
+                    ? new Date(formatDateStringForDisplay(value))
+                    : null
+                }
                 onSelect={handleCalendarDateSelect}
                 numberOfMonths={1}
                 fixedHeight
diff --git a/helpers/react/DynamicDialog/SearchableChooser.css b/helpers/react/DynamicDialog/SearchableChooser.css
index b546e8332..f1a1e7c67 100644
--- a/helpers/react/DynamicDialog/SearchableChooser.css
+++ b/helpers/react/DynamicDialog/SearchableChooser.css
@@ -584,3 +584,19 @@
   margin-top: 0.5rem;
   padding-left: calc(8rem + 1rem); /* Align with input field: 8rem (label width) + 1rem (label padding-right) */
 }
+
+/* Simple list mode: when no items have icons or shortDescriptions, make labels full width */
+.searchable-chooser-dropdown-portal.simple-list-no-icons-descriptions .searchable-chooser-option.simple-item {
+  justify-content: flex-start; /* Left-align the entire option */
+}
+
+.searchable-chooser-dropdown-portal.simple-list-no-icons-descriptions .searchable-chooser-option.simple-item .searchable-chooser-option-left {
+  flex: 1 1 auto; /* Take full width */
+  max-width: 100%; /* Allow full width */
+  min-width: 0; /* Allow shrinking if needed */
+}
+
+.searchable-chooser-dropdown-portal.simple-list-no-icons-descriptions .searchable-chooser-option.simple-item .searchable-chooser-option-text {
+  width: 100%; /* Take full width of left side */
+  max-width: 100%; /* Don't constrain width */
+}
diff --git a/helpers/react/DynamicDialog/SearchableChooser.jsx b/helpers/react/DynamicDialog/SearchableChooser.jsx
index a8353db8f..157864d2e 100644
--- a/helpers/react/DynamicDialog/SearchableChooser.jsx
+++ b/helpers/react/DynamicDialog/SearchableChooser.jsx
@@ -7,6 +7,7 @@
 import React, { useState, useEffect, useRef } from 'react'
 import { createPortal } from 'react-dom'
 import { calculatePortalPosition } from '@helpers/react/reactUtils.js'
+import { getColorStyle } from '@helpers/colors.js'
 import './SearchableChooser.css'
 
 /**
@@ -148,6 +149,9 @@ export function SearchableChooser({
   const containerRef = useRef<?HTMLDivElement>(null)
   const inputRef = useRef<?HTMLInputElement>(null)
   const dropdownRef = useRef<?HTMLDivElement>(null)
+  // When we programmatically refocus the input (e.g. after clicking an option),
+  // we sometimes *don't* want focus to immediately reopen the dropdown.
+  const suppressOpenOnFocusRef = useRef<boolean>(false)
   const [closeDropdownTriggered, setCloseDropdownTriggered] = useState<boolean>(false)
   const [dropdownPosition, setDropdownPosition] = useState<{ top: number, left: number, width: number, openAbove: boolean } | null>(null)
 
@@ -239,16 +243,26 @@ export function SearchableChooser({
   // Calculate dropdown position when it opens and on scroll/resize
   useEffect(() => {
     if (isOpen && inputRef.current) {
+      // Flow typing for requestAnimationFrame / cancelAnimationFrame can vary by environment
+      // so we keep this as `any` to avoid incompatible-call noise.
+      let rafId: any = null
       const updatePosition = () => {
-        const position = calculateDropdownPosition()
-        if (position) {
-          setDropdownPosition(position)
+        // Coalesce bursts of layout changes (async data loads can trigger many resizes)
+        if (rafId != null) {
+          cancelAnimationFrame(rafId)
         }
+        rafId = requestAnimationFrame(() => {
+          rafId = null
+          const position = calculateDropdownPosition()
+          if (position) {
+            setDropdownPosition(position)
+          }
+        })
       }
 
       // Calculate position immediately
       updatePosition()
-      
+
       // Listen for window scroll and resize
       window.addEventListener('scroll', updatePosition, true)
       window.addEventListener('resize', updatePosition)
@@ -256,14 +270,32 @@ export function SearchableChooser({
       // Also listen for scroll events on all scrollable parent elements
       // This ensures the dropdown repositions when a parent container scrolls
       const scrollableParents: Array<HTMLElement> = []
-      let parent = inputRef.current.parentElement
-      while (parent) {
-        const overflowY = window.getComputedStyle(parent).overflowY
-        if (overflowY === 'scroll' || overflowY === 'auto') {
-          scrollableParents.push(parent)
-          parent.addEventListener('scroll', updatePosition)
+      const inputEl = inputRef.current
+      if (inputEl) {
+        let parentNode: ?Node = inputEl.parentNode
+        while (parentNode && parentNode instanceof HTMLElement) {
+          const overflowY = window.getComputedStyle(parentNode).overflowY
+          if (overflowY === 'scroll' || overflowY === 'auto') {
+            scrollableParents.push(parentNode)
+            parentNode.addEventListener('scroll', updatePosition)
+          }
+          parentNode = parentNode.parentNode
+        }
+      }
+
+      // Handle layout shifts that *aren't* scroll/resize events (e.g. async data changes dialog height)
+      // Use ResizeObserver while dropdown is open to keep the portal aligned.
+      let resizeObserver: any = null
+      if (typeof ResizeObserver !== 'undefined') {
+        resizeObserver = new ResizeObserver(() => updatePosition())
+        // Observe the nearest dialog (if present) and the chooser container itself
+        const dialogEl = inputEl instanceof HTMLElement ? inputEl.closest('.dynamic-dialog') : null
+        if (dialogEl instanceof HTMLElement) {
+          resizeObserver.observe(dialogEl)
+        }
+        if (containerRef.current instanceof HTMLElement) {
+          resizeObserver.observe(containerRef.current)
         }
-        parent = parent.parentElement
       }
 
       return () => {
@@ -273,6 +305,12 @@ export function SearchableChooser({
         scrollableParents.forEach((el) => {
           el.removeEventListener('scroll', updatePosition)
         })
+        if (resizeObserver) {
+          resizeObserver.disconnect()
+        }
+        if (rafId != null) {
+          cancelAnimationFrame(rafId)
+        }
       }
     } else {
       setDropdownPosition(null)
@@ -283,13 +321,7 @@ export function SearchableChooser({
   useEffect(() => {
     const handleClickOutside = (event: MouseEvent) => {
       const target = event.target
-      if (
-        containerRef.current &&
-        target instanceof HTMLElement &&
-        !containerRef.current.contains(target) &&
-        dropdownRef.current &&
-        !dropdownRef.current.contains(target)
-      ) {
+      if (containerRef.current && target instanceof HTMLElement && !containerRef.current.contains(target) && dropdownRef.current && !dropdownRef.current.contains(target)) {
         setIsOpen(false)
         setSearchTerm('')
       }
@@ -322,6 +354,10 @@ export function SearchableChooser({
   }
 
   const handleInputFocus = () => {
+    if (suppressOpenOnFocusRef.current) {
+      suppressOpenOnFocusRef.current = false
+      return
+    }
     if (debugLogging) {
       console.log(`${fieldType}: Input focused, opening dropdown. items=${items.length}, filteredItems=${filteredItems.length}`)
     }
@@ -366,9 +402,41 @@ export function SearchableChooser({
       return
     }
 
+    // Handle Tab key: close dropdown and allow normal tab navigation
+    if (e.key === 'Tab') {
+      if (isOpen) {
+        // Close dropdown when Tab is pressed, but don't prevent default
+        // This allows normal tab navigation to proceed
+        setIsOpen(false)
+        setSearchTerm('')
+        setHoveredIndex(null)
+      }
+      // Don't prevent default - allow Tab to move to next field
+      return
+    }
+
     if (e.key === 'Enter') {
       e.preventDefault() // Prevent form submission
       e.stopPropagation() // Stop event from bubbling to DynamicDialog
+
+      // If dropdown is closed, reopen it
+      if (!isOpen) {
+        setIsOpen(true)
+        setSearchTerm('')
+        setHoveredIndex(null)
+        // Calculate position immediately when opening
+        const position = calculateDropdownPosition()
+        if (position) {
+          setDropdownPosition(position)
+        }
+        // Trigger lazy loading if needed
+        if (onOpen) {
+          onOpen()
+        }
+        return
+      }
+
+      // Dropdown is open: select an item
       // If an item is hovered/highlighted, select that one; otherwise select first
       const itemToSelect =
         hoveredIndex != null && hoveredIndex >= 0 && hoveredIndex < filteredItems.length ? filteredItems[hoveredIndex] : filteredItems.length > 0 ? filteredItems[0] : null
@@ -382,8 +450,11 @@ export function SearchableChooser({
         onSelect(manualEntryItem)
         setIsOpen(false)
         setSearchTerm('')
+        // Keep focus on the input to allow tab navigation to continue working
         if (inputRef.current) {
-          inputRef.current.blur()
+          setTimeout(() => {
+            inputRef.current?.focus()
+          }, 0)
         }
       }
     } else if (e.key === 'Escape' || e.key === 'Esc') {
@@ -413,8 +484,13 @@ export function SearchableChooser({
     onSelect(item)
     setIsOpen(false)
     setSearchTerm('')
+    // Keep focus on the input to allow tab navigation to continue working
+    // Use setTimeout to ensure the dropdown closes first, then refocus
     if (inputRef.current) {
-      inputRef.current.blur()
+      setTimeout(() => {
+        suppressOpenOnFocusRef.current = true
+        inputRef.current?.focus()
+      }, 0)
     }
   }
 
@@ -587,7 +663,11 @@ export function SearchableChooser({
         {showArrow ? (
           <i className={`fa-solid fa-chevron-down ${classNamePrefix}-arrow ${isOpen ? 'open' : ''}`}></i>
         ) : iconClass ? (
-          <i className={`fa-solid ${iconClass} ${classNamePrefix}-icon ${isOpen ? 'open' : ''}`}></i>
+          <i
+            className={`${typeof iconClass === 'string' && iconClass.startsWith('fa-') ? iconClass : `fa-solid ${iconClass || ''}`} ${classNamePrefix}-icon ${
+              isOpen ? 'open' : ''
+            }`}
+          ></i>
         ) : null}
       </div>
       {showValue && value && (
@@ -603,7 +683,16 @@ export function SearchableChooser({
         ? createPortal(
             <div
               ref={dropdownRef}
-              className={`searchable-chooser-dropdown-portal ${classNamePrefix}-dropdown ${dropdownPosition?.openAbove ? 'open-above' : ''}`}
+              className={`searchable-chooser-dropdown-portal ${classNamePrefix}-dropdown ${dropdownPosition?.openAbove ? 'open-above' : ''} ${(() => {
+                // Check if any items have icons or shortDescriptions
+                const itemsToCheck = maxResults != null && maxResults > 0 ? filteredItems.slice(0, maxResults) : filteredItems
+                const hasIconsOrDescriptions = itemsToCheck.some((item: any) => {
+                  const hasIcon = getOptionIcon ? getOptionIcon(item) : false
+                  const hasShortDesc = getOptionShortDescription ? getOptionShortDescription(item) : false
+                  return hasIcon || hasShortDesc
+                })
+                return !hasIconsOrDescriptions ? 'simple-list-no-icons-descriptions' : ''
+              })()}`}
               style={{
                 position: 'fixed',
                 top: dropdownPosition ? `${dropdownPosition.top}px` : '0px',
@@ -619,102 +708,175 @@ export function SearchableChooser({
               data-debug-items-count={items.length}
               data-debug-isloading={String(isLoading)}
             >
-            {debugLogging &&
-              console.log(
-                `${fieldType}: Rendering dropdown, isOpen=${String(isOpen)}, isLoading=${String(isLoading)}, items.length=${items.length}, filteredItems.length=${
-                  filteredItems.length
-                }`,
-              )}
-            {isLoading ? (
-              <div
-                className={`searchable-chooser-empty ${classNamePrefix}-empty`}
-                style={{ padding: '1rem', textAlign: 'center', color: 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))' }}
-              >
-                <i className="fa-solid fa-spinner fa-spin" style={{ marginRight: '0.5rem' }}></i>
-                Loading...
-              </div>
-            ) : filteredItems.length === 0 ? (
-              <div className={`searchable-chooser-empty ${classNamePrefix}-empty`}>
-                {items.length === 0 ? emptyMessageNoItems : `${emptyMessageNoMatch} "${searchTerm}"`}
-                {allowManualEntry && searchTerm.trim() && (
-                  <div
-                    className={`${classNamePrefix}-manual-entry-hint`}
-                    style={{
-                      marginTop: '0.5rem',
-                      padding: '0.5rem',
-                      backgroundColor: 'var(--bg-alt-color, #f5f5f5)',
-                      borderRadius: '4px',
-                      fontSize: '0.85em',
-                      color: 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))',
-                    }}
-                  >
-                    Press Enter to use &quot;{searchTerm.trim()}&quot; as {manualEntryIndicator.toLowerCase()}
-                  </div>
+              {debugLogging &&
+                console.log(
+                  `${fieldType}: Rendering dropdown, isOpen=${String(isOpen)}, isLoading=${String(isLoading)}, items.length=${items.length}, filteredItems.length=${
+                    filteredItems.length
+                  }`,
                 )}
-              </div>
-            ) : (
-              (() => {
-                // Show all items if maxResults is undefined, otherwise limit to maxResults
-                const itemsToShow = maxResults != null && maxResults > 0 ? filteredItems.slice(0, maxResults) : filteredItems
-                if (debugLogging) {
-                  console.log(`${fieldType}: Rendering ${itemsToShow.length} options (filtered from ${filteredItems.length} total, maxResults=${maxResults || 'unlimited'})`)
-                }
-                return itemsToShow.map((item: any, index: number) => {
-                  const optionText = getOptionText(item)
-                  // Only apply JavaScript truncation for very long items (>dropdownMaxLength)
-                  // For shorter items, let CSS handle truncation based on actual width
-                  const truncatedText = optionText.length > dropdownMaxLength ? truncateDisplay(optionText, dropdownMaxLength) : optionText
-                  const optionTitle = getOptionTitle(item)
-                  if (debugLogging && index < 3) {
-                    const jsTruncated = optionText.length > dropdownMaxLength
-                    console.log(
-                      `${fieldType}: Dropdown option[${index}]: original="${optionText}", length=${optionText.length}, truncated="${truncatedText}", length=${
-                        truncatedText.length
-                      }, maxLength=${dropdownMaxLength}, jsTruncated=${String(jsTruncated)}`,
-                    )
-                  }
-                  const optionIcon = getOptionIcon ? getOptionIcon(item) : null
-                  const optionColor = getOptionColor ? getOptionColor(item) : null
-                  const optionShortDesc = getOptionShortDescription ? getOptionShortDescription(item) : null
-                  const isHovered = hoveredIndex === index
-                  const isSelected = hoveredIndex === index // For keyboard navigation highlighting
-                  const showOptionClickHint: boolean = Boolean(optionKeyPressed && isHovered && !!onOptionClick)
-                  const optionClickIcon = optionClickIconProp || 'plus'
-                  const finalTitle = optionShortDesc ? `${optionTitle}${optionShortDesc ? ` - ${optionShortDesc}` : ''}` : optionTitle
-
-                  // If custom renderOption is provided, use it
-                  if (renderOption) {
-                    return (
-                      <div key={`${fieldType}-${index}`} onMouseEnter={() => setHoveredIndex(index)} onMouseLeave={() => setHoveredIndex(null)}>
-                        {renderOption(item, {
-                          index,
-                          isHovered,
-                          isSelected,
-                          showOptionClickHint: showOptionClickHint,
-                          optionClickIcon,
-                          optionClickHint: optionClickHint || undefined,
-                          classNamePrefix,
-                          fieldType,
-                          handleItemSelect,
-                          setHoveredIndex,
-                          getOptionTitle,
-                          getOptionIcon: getOptionIcon || (() => null),
-                          getOptionColor: getOptionColor || (() => null),
-                          getOptionShortDescription: getOptionShortDescription || (() => null),
-                        })}
-                      </div>
-                    )
+              {isLoading ? (
+                <div
+                  className={`searchable-chooser-empty ${classNamePrefix}-empty`}
+                  style={{ padding: '1rem', textAlign: 'center', color: 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))' }}
+                >
+                  <i className="fa-solid fa-spinner fa-spin" style={{ marginRight: '0.5rem' }}></i>
+                  Loading...
+                </div>
+              ) : filteredItems.length === 0 ? (
+                <div className={`searchable-chooser-empty ${classNamePrefix}-empty`}>
+                  {items.length === 0 ? emptyMessageNoItems : `${emptyMessageNoMatch} "${searchTerm}"`}
+                  {allowManualEntry && searchTerm.trim() && (
+                    <div
+                      className={`${classNamePrefix}-manual-entry-hint`}
+                      style={{
+                        marginTop: '0.5rem',
+                        padding: '0.5rem',
+                        backgroundColor: 'var(--bg-alt-color, #f5f5f5)',
+                        borderRadius: '4px',
+                        fontSize: '0.85em',
+                        color: 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))',
+                      }}
+                    >
+                      Press Enter to use &quot;{searchTerm.trim()}&quot; as {manualEntryIndicator.toLowerCase()}
+                    </div>
+                  )}
+                </div>
+              ) : (
+                (() => {
+                  // Show all items if maxResults is undefined, otherwise limit to maxResults
+                  const itemsToShow = maxResults != null && maxResults > 0 ? filteredItems.slice(0, maxResults) : filteredItems
+                  if (debugLogging) {
+                    console.log(`${fieldType}: Rendering ${itemsToShow.length} options (filtered from ${filteredItems.length} total, maxResults=${maxResults || 'unlimited'})`)
                   }
 
-                  // Default rendering
-                  if (shortDescriptionOnLine2 && optionShortDesc) {
-                    // Two-line layout: icon + label on first line, description on second line
+                  // Check if any items have icons or shortDescriptions (calculate once for all items)
+                  const hasIconsOrDescriptions = itemsToShow.some((item: any) => {
+                    const hasIcon = getOptionIcon ? getOptionIcon(item) : false
+                    const hasShortDesc = getOptionShortDescription ? getOptionShortDescription(item) : false
+                    return hasIcon || hasShortDesc
+                  })
+
+                  return itemsToShow.map((item: any, index: number) => {
+                    const optionText = getOptionText(item)
+                    // Only apply JavaScript truncation for very long items (>dropdownMaxLength)
+                    // For shorter items, let CSS handle truncation based on actual width
+                    const truncatedText = optionText.length > dropdownMaxLength ? truncateDisplay(optionText, dropdownMaxLength) : optionText
+                    const optionTitle = getOptionTitle(item)
+                    if (debugLogging && index < 3) {
+                      const jsTruncated = optionText.length > dropdownMaxLength
+                      console.log(
+                        `${fieldType}: Dropdown option[${index}]: original="${optionText}", length=${optionText.length}, truncated="${truncatedText}", length=${
+                          truncatedText.length
+                        }, maxLength=${dropdownMaxLength}, jsTruncated=${String(jsTruncated)}`,
+                      )
+                    }
+                    const optionIcon = getOptionIcon ? getOptionIcon(item) : null
+                    const optionColor = getOptionColor ? getOptionColor(item) : null
+                    let optionShortDesc = getOptionShortDescription ? getOptionShortDescription(item) : null
+                    // Hide short description if it's identical to the label text
+                    if (optionShortDesc && optionText && optionShortDesc.trim() === optionText.trim()) {
+                      optionShortDesc = null
+                    }
+                    const isHovered = hoveredIndex === index
+                    const isSelected = hoveredIndex === index // For keyboard navigation highlighting
+                    const showOptionClickHint: boolean = Boolean(optionKeyPressed && isHovered && !!onOptionClick)
+                    const optionClickIcon = optionClickIconProp || 'plus'
+                    const finalTitle = optionShortDesc ? `${optionTitle}${optionShortDesc ? ` - ${optionShortDesc}` : ''}` : optionTitle
+
+                    // If custom renderOption is provided, use it
+                    if (renderOption) {
+                      return (
+                        <div key={`${fieldType}-${index}`} onMouseEnter={() => setHoveredIndex(index)} onMouseLeave={() => setHoveredIndex(null)}>
+                          {renderOption(item, {
+                            index,
+                            isHovered,
+                            isSelected,
+                            showOptionClickHint: showOptionClickHint,
+                            optionClickIcon,
+                            optionClickHint: optionClickHint || undefined,
+                            classNamePrefix,
+                            fieldType,
+                            handleItemSelect,
+                            setHoveredIndex,
+                            getOptionTitle,
+                            getOptionIcon: getOptionIcon || (() => null),
+                            getOptionColor: getOptionColor || (() => null),
+                            getOptionShortDescription: getOptionShortDescription || (() => null),
+                          })}
+                        </div>
+                      )
+                    }
+
+                    // Default rendering
+                    if (shortDescriptionOnLine2 && optionShortDesc) {
+                      // Two-line layout: icon + label on first line, description on second line
+                      return (
+                        <div
+                          key={`${fieldType}-${index}`}
+                          className={`searchable-chooser-option searchable-chooser-option-two-line ${classNamePrefix}-option ${classNamePrefix}-option-two-line ${
+                            showOptionClickHint ? 'option-click-hint' : ''
+                          } ${isSelected ? 'option-selected' : ''}`}
+                          onClick={(e) => handleItemSelect(item, e)}
+                          onMouseEnter={() => setHoveredIndex(index)}
+                          onMouseLeave={() => setHoveredIndex(null)}
+                          title={finalTitle}
+                          style={{
+                            cursor: showOptionClickHint ? 'pointer' : 'default',
+                          }}
+                        >
+                          <div className={`searchable-chooser-option-first-line ${classNamePrefix}-option-first-line`}>
+                            {optionIcon && (
+                              <i
+                                className={typeof optionIcon === 'string' && optionIcon.startsWith('fa-') ? optionIcon : `fa-solid fa-${optionIcon || ''}`}
+                                style={{
+                                  marginRight: '0.5rem',
+                                  opacity: 0.7,
+                                  color: getColorStyle(optionColor),
+                                }}
+                              />
+                            )}
+                            {showOptionClickHint && optionClickIcon && (
+                              <i
+                                className={`fa-solid fa-${optionClickIcon}`}
+                                style={{
+                                  marginRight: '0.5rem',
+                                  color: 'var(--tint-color, #0066cc)',
+                                }}
+                                title={optionClickHint || 'Option-click for action'}
+                              />
+                            )}
+                            <span
+                              className={`searchable-chooser-option-text ${classNamePrefix}-option-text`}
+                              style={{
+                                color: getColorStyle(optionColor),
+                              }}
+                            >
+                              {truncatedText}
+                            </span>
+                          </div>
+                          <div
+                            className={`searchable-chooser-option-second-line ${classNamePrefix}-option-second-line`}
+                            style={{
+                              color: optionColor ? getColorStyle(optionColor) || 'var(--fg-placeholder-color, rgba(76, 79, 105, 0.7))' : undefined,
+                            }}
+                          >
+                            {optionShortDesc}
+                          </div>
+                          {/* Placeholder div to reserve space for validation message - outside input wrapper so it doesn't constrain dropdown */}
+                          <div className="validation-message validation-message-placeholder" aria-hidden="true"></div>
+                        </div>
+                      )
+                    }
+
+                    // Single-line layout (default): icon + label + description on one line
+                    // Check if this is a simple list (no icons or descriptions)
+                    const isSimpleItem = !optionIcon && !optionShortDesc && !hasIconsOrDescriptions
                     return (
                       <div
                         key={`${fieldType}-${index}`}
-                        className={`searchable-chooser-option searchable-chooser-option-two-line ${classNamePrefix}-option ${classNamePrefix}-option-two-line ${
-                          showOptionClickHint ? 'option-click-hint' : ''
-                        } ${isSelected ? 'option-selected' : ''}`}
+                        className={`searchable-chooser-option ${classNamePrefix}-option ${showOptionClickHint ? 'option-click-hint' : ''} ${isSelected ? 'option-selected' : ''} ${
+                          isSimpleItem ? 'simple-item' : ''
+                        }`}
                         onClick={(e) => handleItemSelect(item, e)}
                         onMouseEnter={() => setHoveredIndex(index)}
                         onMouseLeave={() => setHoveredIndex(null)}
@@ -723,14 +885,14 @@ export function SearchableChooser({
                           cursor: showOptionClickHint ? 'pointer' : 'default',
                         }}
                       >
-                        <div className={`searchable-chooser-option-first-line ${classNamePrefix}-option-first-line`}>
+                        <span className={`searchable-chooser-option-left ${classNamePrefix}-option-left`}>
                           {optionIcon && (
                             <i
-                              className={`fa-solid fa-${optionIcon}`}
+                              className={typeof optionIcon === 'string' && optionIcon.startsWith('fa-') ? optionIcon : `fa-solid fa-${optionIcon || ''}`}
                               style={{
                                 marginRight: '0.5rem',
                                 opacity: 0.7,
-                                color: optionColor ? `var(--${optionColor}, inherit)` : undefined,
+                                color: getColorStyle(optionColor),
                               }}
                             />
                           )}
@@ -747,86 +909,32 @@ export function SearchableChooser({
                           <span
                             className={`searchable-chooser-option-text ${classNamePrefix}-option-text`}
                             style={{
-                              color: optionColor ? `var(--${optionColor}, inherit)` : undefined,
+                              color: getColorStyle(optionColor),
                             }}
                           >
                             {truncatedText}
                           </span>
-                        </div>
-                        <div
-                          className={`searchable-chooser-option-second-line ${classNamePrefix}-option-second-line`}
-                          style={{
-                            color: optionColor ? `var(--${optionColor}, var(--fg-placeholder-color, rgba(76, 79, 105, 0.7)))` : undefined,
-                          }}
-                        >
-                          {optionShortDesc}
-                        </div>
-                        {/* Placeholder div to reserve space for validation message - outside input wrapper so it doesn't constrain dropdown */}
-                        <div className="validation-message validation-message-placeholder" aria-hidden="true"></div>
-                      </div>
-                    )
-                  }
-
-                  // Single-line layout (default): icon + label + description on one line
-                  return (
-                    <div
-                      key={`${fieldType}-${index}`}
-                      className={`searchable-chooser-option ${classNamePrefix}-option ${showOptionClickHint ? 'option-click-hint' : ''} ${isSelected ? 'option-selected' : ''}`}
-                      onClick={(e) => handleItemSelect(item, e)}
-                      onMouseEnter={() => setHoveredIndex(index)}
-                      onMouseLeave={() => setHoveredIndex(null)}
-                      title={finalTitle}
-                      style={{
-                        cursor: showOptionClickHint ? 'pointer' : 'default',
-                      }}
-                    >
-                      <span className={`searchable-chooser-option-left ${classNamePrefix}-option-left`}>
-                        {optionIcon && (
-                          <i
-                            className={`fa-solid fa-${optionIcon}`}
-                            style={{
-                              marginRight: '0.5rem',
-                              opacity: 0.7,
-                              color: optionColor ? `var(--${optionColor}, inherit)` : undefined,
-                            }}
-                          />
-                        )}
-                        {showOptionClickHint && optionClickIcon && (
-                          <i
-                            className={`fa-solid fa-${optionClickIcon}`}
+                        </span>
+                        {/* Always render right side to reserve space, even if empty */}
+                        {/* In single-line mode (not shortDescriptionOnLine2), reserve space even when empty */}
+                        {/* But hide it completely for simple lists */}
+                        {!isSimpleItem && (
+                          <span
+                            className={`searchable-chooser-option-right ${classNamePrefix}-option-right`}
                             style={{
-                              marginRight: '0.5rem',
-                              color: 'var(--tint-color, #0066cc)',
+                              color: optionColor ? getColorStyle(optionColor) || 'var(--gray-500, #666)' : undefined,
+                              // Reserve minimum space when in single-line mode and no shortDescription
+                              minWidth: !shortDescriptionOnLine2 && !optionShortDesc ? '8rem' : undefined,
                             }}
-                            title={optionClickHint || 'Option-click for action'}
-                          />
+                          >
+                            {optionShortDesc || ''}
+                          </span>
                         )}
-                        <span
-                          className={`searchable-chooser-option-text ${classNamePrefix}-option-text`}
-                          style={{
-                            color: optionColor ? `var(--${optionColor}, inherit)` : undefined,
-                          }}
-                        >
-                          {truncatedText}
-                        </span>
-                      </span>
-                      {/* Always render right side to reserve space, even if empty */}
-                      {/* In single-line mode (not shortDescriptionOnLine2), reserve space even when empty */}
-                      <span
-                        className={`searchable-chooser-option-right ${classNamePrefix}-option-right`}
-                        style={{
-                          color: optionColor ? `var(--${optionColor}, var(--gray-500, #666))` : undefined,
-                          // Reserve minimum space when in single-line mode and no shortDescription
-                          minWidth: !shortDescriptionOnLine2 && !optionShortDesc ? '8rem' : undefined,
-                        }}
-                      >
-                        {optionShortDesc || ''}
-                      </span>
-                    </div>
-                  )
-                })
-              })()
-            )}
+                      </div>
+                    )
+                  })
+                })()
+              )}
             </div>,
             portalContainer,
           )
diff --git a/helpers/react/DynamicDialog/SpaceChooser.jsx b/helpers/react/DynamicDialog/SpaceChooser.jsx
index 4456979af..2ba415bee 100644
--- a/helpers/react/DynamicDialog/SpaceChooser.jsx
+++ b/helpers/react/DynamicDialog/SpaceChooser.jsx
@@ -8,6 +8,7 @@ import React, { useState, useEffect, useRef } from 'react'
 import SearchableChooser, { type ChooserConfig } from './SearchableChooser'
 import { logDebug, logError } from '@helpers/react/reactDev.js'
 import { TEAMSPACE_ICON_COLOR } from '@helpers/NPnote.js'
+import { TEAMSPACE_FA_ICON, PRIVATE_FA_ICON } from '@helpers/teamspace'
 import { truncateText } from '@helpers/react/reactUtils.js'
 import './SpaceChooser.css'
 
@@ -202,7 +203,7 @@ export function SpaceChooser({
     },
     getOptionTitle: (space: SpaceOption) => {
       if (space.id === '__all__') {
-        return 'All Private notes and all Teamspaces'
+        return ''
       }
       return space.isPrivate ? 'Private notes (default)' : `Teamspace: ${space.title}`
     },
@@ -217,28 +218,30 @@ export function SpaceChooser({
     emptyMessageNoItems: 'No spaces available',
     emptyMessageNoMatch: 'No spaces match',
     classNamePrefix: 'space-chooser',
-    iconClass: 'fa-cube', // Icon for the input field (will be prefixed with fa-solid by SearchableChooser)
+    iconClass: TEAMSPACE_FA_ICON, // Use full icon class: 'fa-regular fa-cube' (SearchableChooser will handle it)
     fieldType: 'space-chooser',
     debugLogging: true,
     maxResults: 25,
     inputMaxLength: 100,
     dropdownMaxLength: 80,
     getOptionIcon: (space: SpaceOption) => {
-      // TEAMSPACE_FA_ICON is 'fa-regular fa-cube', we need just 'cube' for fa-solid
+      // Return full Font Awesome class names to match Dashboard, Filer, and NoteHelpers
       if (space.id === '__all__') {
-        return 'layer-group' // Icon representing "all" or multiple layers
+        return 'fa-solid fa-layer-group' // Icon representing "all" or multiple layers
       }
-      return space.isPrivate ? 'user' : 'cube'
+      return space.isPrivate ? PRIVATE_FA_ICON : TEAMSPACE_FA_ICON
     },
     getOptionColor: (space: SpaceOption) => {
       if (space.id === '__all__') {
-        return undefined // Use default color for "All" option
+        // Use tint-color for "All Private + Spaces" option
+        return 'tint-color'
       }
+      // Use TEAMSPACE_ICON_COLOR (green-800) for teamspace cube icon and shortDescription (matches Dashboard, Filer, NoteHelpers)
       return space.isPrivate ? undefined : TEAMSPACE_ICON_COLOR
     },
     getOptionShortDescription: (space: SpaceOption) => {
       if (space.id === '__all__') {
-        return 'All Private notes and Teamspaces'
+        return ''
       }
       return space.isPrivate ? 'Your private notes' : 'Teamspace'
     },
diff --git a/helpers/react/DynamicDialog/TagChooser.jsx b/helpers/react/DynamicDialog/TagChooser.jsx
index acfe10bb8..70f18db86 100644
--- a/helpers/react/DynamicDialog/TagChooser.jsx
+++ b/helpers/react/DynamicDialog/TagChooser.jsx
@@ -29,6 +29,7 @@ export type TagChooserProps = {
   singleValue?: boolean, // If true, allow selecting only one value (no checkboxes, returns single value) (default: false)
   renderAsDropdown?: boolean, // If true and singleValue is true, render as dropdown-select instead of filterable chooser (default: false)
   requestFromPlugin?: (command: string, dataToSend?: any, timeout?: number) => Promise<any>, // Function to request data from plugin
+  fieldKey?: string, // Unique key for this field instance (used to generate unique input id)
 }
 
 /**
@@ -56,6 +57,7 @@ export function TagChooser({
   singleValue = false,
   renderAsDropdown = false,
   requestFromPlugin,
+  fieldKey,
 }: TagChooserProps): React$Node {
   const [hashtags, setHashtags] = useState<Array<string>>([])
   const [loaded, setLoaded] = useState<boolean>(false)
@@ -184,6 +186,7 @@ export function TagChooser({
         allowCreate={allowCreate}
         singleValue={singleValue}
         onCreate={handleCreateTag}
+        fieldKey={fieldKey}
       />
     </div>
   )
diff --git a/helpers/react/DynamicDialog/dialogElementRenderer.js b/helpers/react/DynamicDialog/dialogElementRenderer.js
index ef595bd08..67e2dfb73 100644
--- a/helpers/react/DynamicDialog/dialogElementRenderer.js
+++ b/helpers/react/DynamicDialog/dialogElementRenderer.js
@@ -149,6 +149,8 @@ export function renderItem({
             validationType={item.validationType || undefined}
             debounceOnChange={(item: any).debounceOnChange !== false} // Default to true, allow opt-out
             debounceMs={(item: any).debounceMs || 500}
+            id={item.key ? `input-${item.key}` : undefined}
+            name={item.key || undefined}
           />
         )
       case 'input-readonly':
@@ -211,6 +213,8 @@ export function renderItem({
             step={item.step} // Pass the step prop
             debounceOnChange={(item: any).debounceOnChange !== false} // Default to true, allow opt-out
             debounceMs={(item: any).debounceMs || 500}
+            id={item.key ? `input-${item.key}` : undefined}
+            name={item.key || undefined}
           />
         )
       case 'combo': {
@@ -280,7 +284,7 @@ export function renderItem({
         )
       }
       case 'text':
-        return <TextComponent disabled={disabled} key={`text${index}`} textType={item.textType || 'description'} label={thisLabel} />
+        return <TextComponent disabled={disabled} key={`text${index}`} textType={item.textType || 'description'} label={item.label || ''} />
       case 'separator':
         return <hr key={`sep${index}`} className={`ui-separator ${item.key || ''}`} />
       case 'heading': {
@@ -424,23 +428,33 @@ export function renderItem({
           : []
         // Get current value from item.value or item.default
         const currentValue = item.value || item.default || ''
+        const label = item.label || ''
+        const compactDisplay = item.compactDisplay || false
+
+        // Render similar to InputBox/calendarpicker - label and button group in a container
+        // Use div instead of label since button-group has no form input to associate with
         return (
-          <ButtonGroup
+          <div
             key={`btn-group${index}`}
-            options={normalizedButtonOptions}
-            selectedValue={currentValue}
-            disabled={disabled}
-            onClick={(value) => {
-              if (item.key) {
-                const key = item.key
-                handleButtonClick(key, value)
-                handleFieldChange(key, value)
-              } else {
-                console.error('Button group item is missing a key')
-              }
-            }}
-            vertical={item.vertical}
-          />
+            className={`${disabled ? 'disabled' : ''} ${compactDisplay ? 'input-box-container-compact' : 'input-box-container'} ${indent ? 'indent' : ''}`}
+          >
+            {label && <div className="input-box-label">{label}</div>}
+            <ButtonGroup
+              options={normalizedButtonOptions}
+              selectedValue={currentValue}
+              disabled={disabled}
+              onClick={(value) => {
+                if (item.key) {
+                  const key = item.key
+                  handleButtonClick(key, value)
+                  handleFieldChange(key, value)
+                } else {
+                  console.error('Button group item is missing a key')
+                }
+              }}
+              vertical={item.vertical}
+            />
+          </div>
         )
       }
       case 'calendarpicker': {
@@ -888,6 +902,10 @@ export function renderItem({
           </div>
         )
       }
+      case 'comment': {
+        // Comment fields are Form Builder only - they don't render in form output
+        return null
+      }
       case 'space-chooser': {
         const label = item.label || ''
         const compactDisplay = item.compactDisplay || false
@@ -962,6 +980,7 @@ export function renderItem({
               singleValue={singleValue}
               renderAsDropdown={renderAsDropdown}
               requestFromPlugin={requestFromPlugin}
+              fieldKey={item.key}
             />
           </div>
         )
@@ -1010,6 +1029,7 @@ export function renderItem({
               singleValue={singleValue}
               renderAsDropdown={renderAsDropdown}
               requestFromPlugin={requestFromPlugin}
+              fieldKey={item.key}
             />
           </div>
         )
@@ -1079,6 +1099,7 @@ export function renderItem({
               folderString={folderString}
               fullPathMatch={fullPathMatch}
               requestFromPlugin={requestFromPlugin}
+              fieldKey={item.key}
             />
           </div>
         )
@@ -1120,6 +1141,8 @@ export function renderItem({
   let classNameToUse = className
   if (indent) classNameToUse += ' indent'
   if (disabled) classNameToUse += ' disabled'
+  // Add itemkey-XXX class for easy CSS targeting
+  if (item.key) classNameToUse += ` itemkey-${item.key}`
 
   // TODO: data-settings-key can be used by the Dynamic Dialog to scroll to the element when the gear icon is clicked (see Dashboard/SettingsDialog)
   return (
diff --git a/np.Shared/src/react/Root.jsx b/np.Shared/src/react/Root.jsx
index 7c28e03b4..99ef05676 100644
--- a/np.Shared/src/react/Root.jsx
+++ b/np.Shared/src/react/Root.jsx
@@ -648,8 +648,6 @@ export function Root(/* props: Props */): Node {
           }
         })
       }
-    } else {
-      logDebug(`Root`, ` logBufferBuster is DISABLED or missing in pluginData`)
     }
   }, [npData])
 
diff --git a/np.Templating/CHANGELOG.md b/np.Templating/CHANGELOG.md
index 734f13cda..838bdd289 100644
--- a/np.Templating/CHANGELOG.md
+++ b/np.Templating/CHANGELOG.md
@@ -6,6 +6,56 @@ See Plugin [Documentation](https://noteplan.co/templates/docs) for details on av
 
 DBW: REMEMBER THAT IF YOU ADDED ANY HELPERS IMPORTS, ADD THEM TO THE HELPER MODULE TO GIVE SCRIPTS ACCESS TO THEM ALSO
 
+## [2.2.9] 2026-01-XX @dwertheimer
+- Add new hidden command `getRenderContext` for use by other plugins (e.g., Forms plugin)
+  - Returns the full templating render context object with all globals, modules, and helpers (date, time, note, tasks, moment, etc.)
+  - Includes timing logs for performance monitoring (setup, config, engine creation, context building, total time)
+  - Allows other plugins to reuse templating context without duplicating code
+  - Accessible via `DataStore.invokePluginCommandByName('getRenderContext', 'np.Templating', [userData])`
+- **Comprehensive template search refactoring** - Expand template search functions to search in both @Templates and @Forms directories across all spaces
+  - **New shared utility**: Created `getTemplateFolderPrefixes()` function that builds complete list of folder prefixes including:
+    - Private root folders: `@Templates` and `@Forms` (or localized equivalents)
+    - All teamspace root folders: `%%NotePlanCloud%%/<teamspaceID>/@Templates` and `%%NotePlanCloud%%/<teamspaceID>/@Forms`
+  - **Core template search functions updated**:
+    - `getFilteredTemplateList` - Now searches in both private root and all teamspace root folders
+    - `getTemplateNote` - Now searches all teamspaces, not just private root
+    - `getFilenameFromTemplate` - Filters notes from all template folders in all spaces
+    - `getTemplateContent` - Searches in all template folders when finding templates
+    - `templateExists` - Searches in all template folders (Templates, Forms, all spaces)
+  - **User-facing commands updated**:
+    - `templateInsert` and `templateAppend` - Now use `getTemplateNote` (searches all folders/spaces)
+    - `<current>` prompt validation - Now checks if note is in any template folder (not just @Templates)
+    - `addFrontmatterToTemplate` (NPTemplateRunner) - Now uses `getTemplateNote`
+    - `chooseTemplate` - Now uses `chooseNoteV2` for decorated note selection UI (shows icons, colors, folder paths)
+      - Automatically displays templates from both @Templates and @Forms directories across all spaces
+      - No longer limited to just @Templates folder in display logic
+      - Improved user experience with visual decorations and better folder path display
+  - **Localization support**:
+    - All functions now use `DataStore.preference('templateFolder')` for localized template folder names instead of hardcoded '@Templates'
+    - All functions now use `DataStore.preference('formsFolder')` for localized forms folder names (with '@Forms' fallback)
+  - **Bug fixes**:
+    - Fixes issue where form processing templates stored in @Forms weren't found by `templateRunner` and `getTemplateNote` when processing form submissions
+    - Fixes issue where templates in teamspaces weren't found by template search functions
+  - **Impact**: Templates can now be stored in @Forms directory (for form processing) or @Templates directory (for regular templates), in both private root and teamspace root folders, and all search functions will find them correctly
+- **Replace `chooseNote`/`chooseOption` with `chooseNoteV2` throughout np.Templating** - Modernize all note selection UI
+  - **All functions updated to use `chooseNoteV2`**:
+    - `handleNoteSelection` in `NPTemplateRunner.js` - Replaced deprecated `chooseNote` with `chooseNoteV2`
+      - Uses `DataStore.projectNotes` which automatically includes notes from all spaces (private and teamspaces)
+      - When templates use `<choose>` or `<select>` placeholders, users now see decorated note selection UI
+    - `chooseTemplate` in `templateManager.js` - Replaced `chooseOption` with `chooseNoteV2`
+      - Templates from both @Templates and @Forms directories (across all spaces) are properly displayed with full paths
+      - Removed complex label manipulation code that only handled @Templates folder
+    - `getTemplateContent` in `templateManager.js` - Replaced `chooseOption` with `chooseNoteV2`
+      - When multiple templates match the same name, user selection now shows decorated UI with folder paths
+      - Templates from all template folders (Templates, Forms, all teamspaces) are included in selection
+  - **Benefits**:
+    - Better UI with decorated options showing icons, colors, and folder paths
+    - All note selection now searches across all spaces (private root and all teamspace root folders)
+    - Consistent user experience across all template selection functions
+    - Visual distinction between templates in different folders and spaces
+  - **Backward compatibility**: `chooseNote` is still available in templates via `helpers.chooseNote` for backward compatibility, but `helpers.chooseNoteV2` is recommended for new templates
+  - **Testing**: Updated all test mocks to use `chooseNoteV2` and added `DataStore.preference` mocks for template folder localization
+
 ## [2.2.8] 2026-01-XX @dwertheimer
 - Add triggerTemplateRunner command to automatically run templates when notes are opened
 - New hidden command `triggerTemplateRunner` checks for `runTemplateOnOpen` frontmatter attribute
diff --git a/np.Templating/__tests__/NPTemplateNoteHelpers.test.js b/np.Templating/__tests__/NPTemplateNoteHelpers.test.js
index e349193cc..e596f0092 100644
--- a/np.Templating/__tests__/NPTemplateNoteHelpers.test.js
+++ b/np.Templating/__tests__/NPTemplateNoteHelpers.test.js
@@ -48,6 +48,12 @@ describe('NPTemplateNoteHelpers', () => {
   beforeEach(() => {
     global.DataStore = {
       settings: { _logLevel: 'none' },
+      preference: jest.fn((key: string) => {
+        // Return default values for common preferences
+        if (key === 'templateFolder') return '@Templates'
+        if (key === 'formsFolder') return '@Forms'
+        return null
+      }),
     }
   })
   describe('getTemplateNote', () => {
@@ -130,7 +136,11 @@ describe('NPTemplateNoteHelpers', () => {
       // Verify correct parameters were passed to getNote
       expect(note.getNote).toHaveBeenCalledWith('Non-existent Template', false, '@Templates')
       expect(result).toBeNull()
-      expect(CommandBar.prompt).toHaveBeenCalledWith('Unable to locate template "Non-existent Template"', 'Unable to locate template "Non-existent Template" in @Templates')
+      // Updated message to reflect that we now search in multiple folders
+      expect(CommandBar.prompt).toHaveBeenCalledWith(
+        'Unable to locate template "Non-existent Template"',
+        expect.stringContaining('Unable to locate template "Non-existent Template"'),
+      )
     })
 
     test('should not show prompt when template is not found and runSilently is true', async () => {
@@ -152,6 +162,12 @@ describe('NPTemplateNoteHelpers', () => {
     test('should use custom template folder from NotePlan.environment', async () => {
       // Change the template folder
       NotePlan.environment.templateFolder = '@Custom Templates'
+      // Also update the preference mock to return the custom folder
+      global.DataStore.preference.mockImplementation((key: string) => {
+        if (key === 'templateFolder') return '@Custom Templates'
+        if (key === 'formsFolder') return '@Forms'
+        return null
+      })
 
       // Mock successful note retrieval
       const mockNote = { filename: '@Custom Templates/Template.md', title: 'Template' }
@@ -163,6 +179,13 @@ describe('NPTemplateNoteHelpers', () => {
       // Verify correct parameters were passed to getNote with the custom folder
       expect(note.getNote).toHaveBeenCalledWith('Template', false, '@Custom Templates')
       expect(result).toEqual(mockNote)
+      
+      // Reset preference mock for other tests
+      global.DataStore.preference.mockImplementation((key: string) => {
+        if (key === 'templateFolder') return '@Templates'
+        if (key === 'formsFolder') return '@Forms'
+        return null
+      })
     })
 
     test('should handle empty template name', async () => {
diff --git a/np.Templating/__tests__/NPTemplateRunner.test.js b/np.Templating/__tests__/NPTemplateRunner.test.js
index d29d719b4..58831bc0b 100644
--- a/np.Templating/__tests__/NPTemplateRunner.test.js
+++ b/np.Templating/__tests__/NPTemplateRunner.test.js
@@ -36,6 +36,12 @@ DataStore.calendarNoteByDateString = jest.fn()
 DataStore.newNote = jest.fn()
 DataStore.invokePluginCommandByName = jest.fn()
 DataStore.updateCache = jest.fn()
+DataStore.preference = jest.fn((key: string) => {
+  // Return default values for common preferences
+  if (key === 'templateFolder') return '@Templates'
+  if (key === 'formsFolder') return '@Forms'
+  return null
+})
 
 Editor.type = 'Notes'
 Editor.openNoteByDate = jest.fn()
@@ -84,12 +90,12 @@ jest.mock('@helpers/paragraph', () => ({
 }))
 
 jest.mock('@helpers/userInput', () => ({
-  chooseNote: jest.fn(),
   chooseHeading: jest.fn(),
   showMessage: jest.fn().mockResolvedValue('OK'),
 }))
 
 jest.mock('@helpers/NPnote', () => ({
+  chooseNoteV2: jest.fn(),
   getNoteFromIdentifier: jest.fn(),
   getOrMakeRegularNoteInFolder: jest.fn(),
   getOrMakeCalendarNote: jest.fn(),
@@ -205,12 +211,12 @@ describe('NPTemplateRunner', () => {
     NPnote.getOrMakeRegularNoteInFolder.mockResolvedValue(mockNote)
     // $FlowFixMe - Mock functions
     NPnote.getOrMakeCalendarNote.mockResolvedValue(mockNote)
-
-    const userInput = require('@helpers/userInput')
     // $FlowFixMe - Mock functions
-    userInput.chooseNote.mockResolvedValue({ title: 'Chosen Note' })
+    NPnote.chooseNoteV2.mockResolvedValue({ title: 'Chosen Note' })
     // $FlowFixMe - Mock functions
-    userInput.chooseHeading.mockResolvedValue('Test Heading')
+    const userInput = require('@helpers/userInput')
+    // $FlowFixMe[prop-missing] - Mock function
+    ;(userInput.chooseHeading: any).mockResolvedValue('Test Heading')
 
     const NPdateTime = require('@helpers/NPdateTime')
     // $FlowFixMe - Mock functions
@@ -372,7 +378,7 @@ describe('NPTemplateRunner', () => {
     test('should handle choose placeholder', async () => {
       const mockChosenNote = { title: 'Chosen Note' }
       // $FlowFixMe - Mock functions
-      require('@helpers/userInput').chooseNote.mockResolvedValue(mockChosenNote)
+      require('@helpers/NPnote').chooseNoteV2.mockResolvedValue(mockChosenNote)
 
       const result = await NPTemplateRunner.handleNoteSelection('<choose>')
 
@@ -382,7 +388,7 @@ describe('NPTemplateRunner', () => {
     test('should handle select placeholder', async () => {
       const mockChosenNote = { title: 'Selected Note' }
       // $FlowFixMe - Mock functions
-      require('@helpers/userInput').chooseNote.mockResolvedValue(mockChosenNote)
+      require('@helpers/NPnote').chooseNoteV2.mockResolvedValue(mockChosenNote)
 
       const result = await NPTemplateRunner.handleNoteSelection('<select>')
 
@@ -391,7 +397,7 @@ describe('NPTemplateRunner', () => {
 
     test('should throw error when chosen note has no title', async () => {
       // $FlowFixMe - Mock functions
-      require('@helpers/userInput').chooseNote.mockResolvedValue({ title: '' })
+      require('@helpers/NPnote').chooseNoteV2.mockResolvedValue({ title: '' })
 
       await expect(NPTemplateRunner.handleNoteSelection('<choose>')).rejects.toThrow("Selected note has no title and can't be used")
     })
diff --git a/np.Templating/__tests__/getRenderContext.test.js b/np.Templating/__tests__/getRenderContext.test.js
new file mode 100644
index 000000000..dcf188652
--- /dev/null
+++ b/np.Templating/__tests__/getRenderContext.test.js
@@ -0,0 +1,442 @@
+/**
+ * @jest-environment jsdom
+ */
+/* eslint-disable */
+
+/**
+ * Tests for getRenderContext function
+ * Tests that the function returns the expected templating context structure
+ */
+
+// @flow
+import { CustomConsole } from '@jest/console'
+import { simpleFormatter, DataStore, NotePlan, Editor, CommandBar } from '@mocks/index'
+
+global.NotePlan = new NotePlan()
+// $FlowIgnore[prop-missing]
+globalThis.NotePlan = global.NotePlan
+global.DataStore = DataStore
+global.Editor = Editor
+global.CommandBar = CommandBar
+
+// Mock helpers before importing
+jest.mock('@helpers/dev', () => ({
+  logDebug: jest.fn(),
+  logError: jest.fn(),
+  clo: jest.fn(),
+  log: jest.fn(),
+  logInfo: jest.fn(),
+  logWarn: jest.fn(),
+  timer: jest.fn(),
+  JSP: jest.fn(),
+}))
+
+jest.mock('@helpers/codeBlocks', () => ({
+  getCodeBlocksOfType: jest.fn(),
+}))
+
+jest.mock('@helpers/stringTransforms', () => ({
+  parseObjectString: jest.fn(),
+  validateObjectString: jest.fn(),
+}))
+
+jest.mock('@helpers/note', () => ({
+  getNote: jest.fn(),
+}))
+
+jest.mock('@helpers/userInput', () => ({
+  showMessage: jest.fn(),
+}))
+
+jest.mock('@helpers/paragraph', () => ({
+  smartPrependPara: jest.fn(),
+  smartAppendPara: jest.fn(),
+}))
+
+jest.mock('@helpers/content', () => ({
+  getContentWithLinks: jest.fn(),
+}))
+
+jest.mock('@helpers/NPConfiguration', () => ({
+  initConfiguration: jest.fn(),
+  updateSettingData: jest.fn(),
+  pluginUpdated: jest.fn(),
+  getSetting: jest.fn(),
+}))
+
+jest.mock('@helpers/NPnote', () => ({
+  selectFirstNonTitleLineInEditor: jest.fn(),
+}))
+
+jest.mock('@helpers/NPFrontMatter', () => ({
+  hasFrontMatter: jest.fn(),
+  updateFrontMatterVars: jest.fn(),
+  getNoteTitleFromTemplate: jest.fn(),
+  getNoteTitleFromRenderedContent: jest.fn(),
+  analyzeTemplateStructure: jest.fn(),
+}))
+
+jest.mock('@helpers/NPEditor', () => ({
+  checkAndProcessFolderAndNewNoteTitle: jest.fn(),
+}))
+
+// Mock NPTemplating as a global module alias
+// $FlowIgnore[underconstrained-implicit-instantiation]
+jest.mock(
+  'NPTemplating',
+  () => {
+    // $FlowIgnore[underconstrained-implicit-instantiation]
+    return jest.requireActual('../lib/NPTemplating').default
+  },
+  { virtual: true },
+)
+
+import { getRenderContext } from '../src/Templating'
+import NPTemplating from '../lib/NPTemplating'
+
+const DEFAULT_TEMPLATE_CONFIG = {
+  locale: 'en-US',
+  dateFormat: 'YYYY-MM-DD',
+  timeFormat: 'h:mm A',
+  timestampFormat: 'YYYY-MM-DD h:mm:ss A',
+  userFirstName: 'Test',
+  userLastName: 'User',
+  userEmail: 'test@example.com',
+  userPhone: '555-1234',
+  services: {},
+  clipboard: '',
+}
+
+beforeAll(() => {
+  global.console = new CustomConsole(process.stdout, process.stderr, simpleFormatter)
+  global.NotePlan = new NotePlan()
+  global.DataStore = DataStore
+  global.Editor = Editor
+  global.CommandBar = CommandBar
+  DataStore.settings['_logLevel'] = 'none'
+})
+
+describe('getRenderContext', () => {
+  beforeEach(() => {
+    // Reset NPTemplating setup state
+    // $FlowIgnore[prop-missing]
+    NPTemplating.templateConfig = null
+    DataStore.settings['_logLevel'] = 'none'
+  })
+
+  describe('Basic functionality', () => {
+    it('should return an object with templating modules', async () => {
+      const context = await getRenderContext()
+
+      expect(context).toBeDefined()
+      expect(typeof context).toBe('object')
+      expect(context).not.toBeNull()
+
+      // Check for templating modules
+      expect(context.date).toBeDefined()
+      expect(context.time).toBeDefined()
+      expect(context.note).toBeDefined()
+      expect(context.tasks).toBeDefined()
+      expect(context.frontmatter).toBeDefined()
+      expect(context.helpers).toBeDefined()
+      expect(context.utility).toBeDefined()
+      expect(context.system).toBeDefined()
+      expect(context.web).toBeDefined()
+      expect(context.user).toBeDefined()
+    })
+
+    it('should return an object with templating globals', async () => {
+      const context = await getRenderContext()
+
+      // Check for key globals
+      expect(context.moment).toBeDefined()
+      expect(typeof context.moment).toBe('function') // moment is a constructor
+
+      // Check for global functions (these are async, so we check they exist)
+      expect(context.affirmation).toBeDefined()
+      expect(context.advice).toBeDefined()
+      expect(context.quote).toBeDefined()
+      expect(context.verse).toBeDefined()
+      expect(context.weather).toBeDefined()
+      expect(context.format).toBeDefined()
+      expect(context.now).toBeDefined()
+      expect(context.timestamp).toBeDefined()
+    })
+
+    it('should include np property with full context', async () => {
+      const context = await getRenderContext()
+
+      expect(context.np).toBeDefined()
+      expect(typeof context.np).toBe('object')
+      // np should be a copy of the context
+      expect(context.np.date).toBeDefined()
+      // np should have the same modules and globals
+      expect(context.np).toHaveProperty('date')
+      expect(context.np).toHaveProperty('time')
+    })
+
+    it('should include user info object', async () => {
+      const context = await getRenderContext()
+
+      expect(context.user).toBeDefined()
+      expect(typeof context.user).toBe('object')
+      expect(context.user).toHaveProperty('first')
+      expect(context.user).toHaveProperty('last')
+      expect(context.user).toHaveProperty('email')
+      expect(context.user).toHaveProperty('phone')
+    })
+  })
+
+  describe('userData parameter', () => {
+    it('should merge flat userData into context', async () => {
+      const userData = {
+        company: 'Acme Corp',
+        topic: 'Meeting Notes',
+        count: 42,
+      }
+
+      const context = await getRenderContext(userData)
+
+      expect(context.company).toBe('Acme Corp')
+      expect(context.topic).toBe('Meeting Notes')
+      expect(context.count).toBe(42)
+
+      // Should still have templating modules
+      expect(context.date).toBeDefined()
+      expect(context.moment).toBeDefined()
+    })
+
+    it('should merge structured userData with data property', async () => {
+      const userData = {
+        data: {
+          projectName: 'My Project',
+          status: 'active',
+        },
+      }
+
+      const context = await getRenderContext(userData)
+
+      expect(context.projectName).toBe('My Project')
+      expect(context.status).toBe('active')
+
+      // Should still have templating modules
+      expect(context.date).toBeDefined()
+    })
+
+    it('should merge structured userData with methods property', async () => {
+      // $FlowIgnore[underconstrained-implicit-instantiation]
+      const customMethod = jest.fn().mockReturnValue('test result')
+      const userData = {
+        methods: {
+          // $FlowIgnore[missing-local-annot]
+          calculateTotal: (a: number, b: number) => a + b,
+          customMethod,
+        },
+      }
+
+      const context = await getRenderContext(userData)
+
+      expect(context.calculateTotal).toBeDefined()
+      expect(typeof context.calculateTotal).toBe('function')
+      expect(context.calculateTotal(5, 3)).toBe(8)
+
+      expect(context.customMethod).toBeDefined()
+      expect(context.customMethod()).toBe('test result')
+    })
+
+    it('should merge both data and methods from structured userData', async () => {
+      const userData = {
+        data: {
+          value: 100,
+        },
+        methods: {
+          // $FlowIgnore[missing-local-annot]
+          double: (x: number) => x * 2,
+        },
+      }
+
+      const context = await getRenderContext(userData)
+
+      expect(context.value).toBe(100)
+      expect(context.double).toBeDefined()
+      expect(context.double(50)).toBe(100)
+    })
+
+    it('should handle empty userData', async () => {
+      const context = await getRenderContext({})
+
+      // Should still have all templating modules and globals
+      expect(context.date).toBeDefined()
+      expect(context.moment).toBeDefined()
+      expect(context.np).toBeDefined()
+    })
+
+    it('should handle userData with conflicting keys (userData overrides modules, globals override userData)', async () => {
+      const userData = {
+        date: 'custom date string',
+        moment: 'custom moment string',
+      }
+
+      const context = await getRenderContext(userData)
+
+      // userData overrides modules (date is a module, so userData.date wins)
+      expect(context.date).toBe('custom date string')
+
+      // But globals are loaded after userData, so they override userData
+      // moment is a global, so it overrides userData.moment
+      expect(context.moment).not.toBe('custom moment string')
+      expect(typeof context.moment).toBe('function') // Should be moment constructor
+    })
+  })
+
+  describe('Context structure validation', () => {
+    it('should have all expected module properties', async () => {
+      const context = await getRenderContext()
+
+      const expectedModules = ['date', 'time', 'note', 'tasks', 'frontmatter', 'helpers', 'utility', 'system', 'web', 'user']
+      expectedModules.forEach((moduleName) => {
+        expect(context).toHaveProperty(moduleName)
+        expect(context[moduleName]).toBeDefined()
+      })
+    })
+
+    it('should have date module with expected methods', async () => {
+      const context = await getRenderContext()
+
+      expect(context.date).toBeDefined()
+      expect(typeof context.date.format).toBe('function')
+      expect(typeof context.date.now).toBe('function')
+      expect(typeof context.date.timestamp).toBe('function')
+    })
+
+    it('should have web module with expected methods', async () => {
+      const context = await getRenderContext()
+
+      expect(context.web).toBeDefined()
+      expect(typeof context.web.advice).toBe('function')
+      expect(typeof context.web.affirmation).toBe('function')
+      expect(typeof context.web.quote).toBe('function')
+      expect(typeof context.web.weather).toBe('function')
+    })
+
+    it('should have note module with expected methods', async () => {
+      const context = await getRenderContext()
+
+      expect(context.note).toBeDefined()
+      // NoteModule has various methods - check that it's an object with methods
+      expect(typeof context.note).toBe('object')
+      expect(context.note).not.toBeNull()
+    })
+  })
+
+  describe('Performance and timing', () => {
+    it('should complete in reasonable time', async () => {
+      const startTime = Date.now()
+      const context = await getRenderContext()
+      const endTime = Date.now()
+
+      const duration = endTime - startTime
+
+      // Should complete in under 1 second (most should be much faster)
+      expect(duration).toBeLessThan(1000)
+      expect(context).toBeDefined()
+    })
+
+    it('should complete subsequent calls successfully', async () => {
+      // First call
+      const context1 = await getRenderContext()
+      expect(context1).toBeDefined()
+
+      // Second call (should also work)
+      const context2 = await getRenderContext()
+      expect(context2).toBeDefined()
+
+      // Both should have the same structure
+      expect(context1.date).toBeDefined()
+      expect(context2.date).toBeDefined()
+      expect(context1.moment).toBeDefined()
+      expect(context2.moment).toBeDefined()
+    })
+  })
+
+  describe('Integration with Forms plugin use case', () => {
+    it('should return context usable for templatejs block execution', async () => {
+      const formValues = {
+        company: 'Test Company',
+        topic: 'Test Topic',
+        mainAttendees: '@John, @Jane',
+      }
+
+      const context = await getRenderContext(formValues)
+
+      // Form values should be available
+      expect(context.company).toBe('Test Company')
+      expect(context.topic).toBe('Test Topic')
+      expect(context.mainAttendees).toBe('@John, @Jane')
+
+      // Templating functions should be available
+      expect(context.moment).toBeDefined()
+      expect(context.date).toBeDefined()
+      expect(context.date.format).toBeDefined()
+
+      // Should be usable in Function constructor
+      // Note: We don't pass moment as a separate parameter since it's already in context
+      const testCode = `
+        const formattedDate = moment().format('YYYY-MM-DD');
+        return { formattedDate, company, topic };
+      `
+      // Only include valid identifiers, and exclude 'moment' from contextVars since we'll access it from params
+      const contextVars = Object.keys(context)
+        .filter((key) => /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key) && key !== 'moment')
+        .map((key) => `const ${key} = params.${key};`)
+        .join('\n')
+      const functionBody = `${contextVars}\nconst moment = params.moment;\n${testCode}`
+
+      // $FlowIgnore[prop-missing]
+      const fn = Function.apply(null, ['params', functionBody])
+      const result = fn(context)
+
+      expect(result).toBeDefined()
+      expect(result.formattedDate).toMatch(/^\d{4}-\d{2}-\d{2}$/) // YYYY-MM-DD format
+      expect(result.company).toBe('Test Company')
+      expect(result.topic).toBe('Test Topic')
+    })
+
+    it('should allow using date module in templatejs blocks', async () => {
+      const context = await getRenderContext({ value: 100 })
+
+      const testCode = `
+        const dateStr = date.format('YYYY-MM-DD');
+        return { dateStr, value };
+      `
+
+      // Simulate how Forms would use this
+      const contextVars = `const date = params.date; const value = params.value;`
+      const functionBody = `${contextVars}\n${testCode}`
+
+      // $FlowIgnore[prop-missing]
+      const fn = Function.apply(null, ['params', functionBody])
+      const result = fn(context)
+
+      expect(result).toBeDefined()
+      expect(result.dateStr).toMatch(/^\d{4}-\d{2}-\d{2}$/)
+      expect(result.value).toBe(100)
+    })
+  })
+
+  describe('Error handling', () => {
+    it('should handle errors gracefully', async () => {
+      // Mock NPTemplating.setup to throw an error
+      // $FlowIgnore[cannot-write]
+      const originalSetup = NPTemplating.setup
+      // $FlowIgnore[cannot-write,underconstrained-implicit-instantiation]
+      NPTemplating.setup = jest.fn().mockRejectedValue(new Error('Setup failed'))
+
+      await expect(getRenderContext()).rejects.toThrow('Setup failed')
+
+      // Restore original
+      // $FlowIgnore[cannot-write]
+      NPTemplating.setup = originalSetup
+    })
+  })
+})
diff --git a/np.Templating/__tests__/renderTemplate.test.js b/np.Templating/__tests__/renderTemplate.test.js
index 65ffa751f..8734327ed 100644
--- a/np.Templating/__tests__/renderTemplate.test.js
+++ b/np.Templating/__tests__/renderTemplate.test.js
@@ -19,6 +19,12 @@ global.DataStore = {
   projectNoteByTitle: jest.fn(),
   projectNoteByFilename: jest.fn(),
   settings: { _logLevel: 'none' },
+  preference: jest.fn((key: string) => {
+    // Return default values for common preferences
+    if (key === 'templateFolder') return '@Templates'
+    if (key === 'formsFolder') return '@Forms'
+    return null
+  }),
 }
 
 global.Editor = {
diff --git a/np.Templating/lib/NPTemplateNoteHelpers.js b/np.Templating/lib/NPTemplateNoteHelpers.js
index a4b9ad0cd..e156a4089 100644
--- a/np.Templating/lib/NPTemplateNoteHelpers.js
+++ b/np.Templating/lib/NPTemplateNoteHelpers.js
@@ -1,34 +1,51 @@
 // @flow
 
 import pluginJson from '../plugin.json'
+import { getTemplateFolderPrefixes } from './core/templateManager'
 import { log, logError, logDebug, timer, clo, clof, JSP } from '@helpers/dev'
 import { getNote } from '@helpers/note'
 
 /**
  * Get a template note and return the note object or null if not found
+ * Searches in both @Templates and @Forms directories (and teamspace equivalents)
  * @param {string} _templateName - title or filename of the template note
  * @param {boolean} runSilently
  * @returns {Promise<TNote | null>}
  */
 export async function getTemplateNote(_templateName: string = '', runSilently: boolean = false): Promise<TNote | null> {
-  const templateFolder = NotePlan.environment.templateFolder || '@Templates'
+  // Get all template folder prefixes (includes private root and all teamspace root folders)
+  const searchFolders = await getTemplateFolderPrefixes()
+
   const isFilename = _templateName.endsWith('.md') || _templateName.endsWith('.txt')
   const containsFolder = _templateName.includes('/')
-  const startsWithTemplateFolder = _templateName.startsWith(`${templateFolder}/`)
+
+  // Check if template name starts with any of the search folder prefixes
+  const startsWithTemplateFolder = searchFolders.some((folder) => _templateName.startsWith(`${folder}/`))
+
   logDebug(
     pluginJson,
     `getTemplateNote: _templateName="${_templateName}" isFilename=${String(isFilename)} containsFolder=${String(containsFolder)} startsWithTemplateFolder=${String(
       startsWithTemplateFolder,
-    )}`,
+    )} searching in ${searchFolders.length} folders`,
   )
   let theNote: TNote | null = null
   if (_templateName) {
-    theNote = (await getNote(_templateName, false, templateFolder)) || null
-    if (theNote) return theNote
+    // Try searching in each folder
+    for (const folder of searchFolders) {
+      theNote = (await getNote(_templateName, false, folder)) || null
+      if (theNote) {
+        logDebug(pluginJson, `getTemplateNote: Found template "${_templateName}" in ${folder}`)
+        return theNote
+      }
+    }
   }
   if (!runSilently) {
-    await CommandBar.prompt(`Unable to locate template "${_templateName}"`, `Unable to locate template "${_templateName}" in ${templateFolder}`)
+    logError(pluginJson, `Unable to locate template "${_templateName}" in any of ${searchFolders.length} template folders`)
+    await CommandBar.prompt(
+      `Unable to locate template "${_templateName}"`,
+      `Unable to locate template "${_templateName}" in any template folder (searched ${searchFolders.length} folders)`,
+    )
   }
-  logDebug(pluginJson, `getTemplateNote: Unable to locate template "${_templateName}" in ${templateFolder}`)
+  logDebug(pluginJson, `getTemplateNote: Unable to locate template "${_templateName}" in any of ${searchFolders.length} template folders`)
   return null
 }
diff --git a/np.Templating/lib/REFACTORING_SUMMARY.md b/np.Templating/lib/REFACTORING_SUMMARY.md
index 6dd485e74..61a19de9a 100644
--- a/np.Templating/lib/REFACTORING_SUMMARY.md
+++ b/np.Templating/lib/REFACTORING_SUMMARY.md
@@ -195,8 +195,8 @@ The new `TemplatingEngine.render()` method is now clean and focused:
 
 ```javascript
 async render(templateData, userData, ejsOptions) {
-  // Import the render orchestrator
-  const { orchestrateRender } = await import('./engine/renderOrchestrator')
+  // Import the render orchestrator (static import at top of file)
+  // import { orchestrateRender } from './engine/renderOrchestrator'
   
   // Prepare rendering options
   const options = { ...{ async: true, rmWhitespace: false }, ...ejsOptions }
diff --git a/np.Templating/lib/core/templateManager.js b/np.Templating/lib/core/templateManager.js
index d0c6824f9..f56785132 100644
--- a/np.Templating/lib/core/templateManager.js
+++ b/np.Templating/lib/core/templateManager.js
@@ -8,12 +8,50 @@
 
 import { log, logError, logDebug, logWarn, timer } from '@helpers/dev'
 import { chooseOption, chooseFolder, showMessageYesNo } from '@helpers/userInput'
+import { chooseNoteV2 } from '@helpers/NPnote'
 import pluginJson from '../../plugin.json'
 import FrontmatterModule from '../support/modules/FrontmatterModule'
 import { normalizeToNotePlanFilename } from '../utils'
 import { getTemplateFolder } from '../config'
 import { clo } from '@helpers/dev'
 import { getContentWithLinks } from '@helpers/content'
+import { getAllTeamspaceIDsAndTitles, getTeamspaceRootIdentifier } from '@helpers/NPTeamspace'
+
+/**
+ * Builds a list of all possible template folder prefixes including private root and all teamspace root folders.
+ * This includes both @Templates and @Forms directories in all spaces.
+ * @async
+ * @returns {Promise<Array<string>>} Array of folder prefixes to search for templates
+ */
+export async function getTemplateFolderPrefixes(): Promise<Array<string>> {
+  const templateFolder = await getTemplateFolder()
+
+  // Get template folder name from DataStore.preference (localized) or fall back to environment variable
+  const templateFolderPreference = DataStore.preference('templateFolder')
+  const templateFolderName: string = (typeof templateFolderPreference === 'string' && templateFolderPreference) || templateFolder || '@Templates'
+
+  // Get Forms folder name - check if there's a preference, otherwise use default
+  const formsFolderPreference = DataStore.preference('formsFolder')
+  const formsFolderName: string = (typeof formsFolderPreference === 'string' && formsFolderPreference) || '@Forms'
+
+  // Build list of all possible template folder prefixes
+  // Include Templates and Forms folders in both private root and all teamspace root folders
+  const templateFolderPrefixes: Array<string> = []
+
+  // Private root folders
+  templateFolderPrefixes.push(templateFolderName)
+  templateFolderPrefixes.push(formsFolderName)
+
+  // Teamspace root folders
+  const teamspaces = getAllTeamspaceIDsAndTitles()
+  const teamspacePrefix = getTeamspaceRootIdentifier()
+  for (const teamspace of teamspaces) {
+    templateFolderPrefixes.push(`${teamspacePrefix}/${teamspace.id}/${templateFolderName}`)
+    templateFolderPrefixes.push(`${teamspacePrefix}/${teamspace.id}/${formsFolderName}`)
+  }
+
+  return templateFolderPrefixes
+}
 
 /**
  * Helper function to get filtered template list by attribute (type or tags).
@@ -53,9 +91,23 @@ export async function getFilteredTemplateList(
     const filterValues = Array.isArray(filters) ? filters : filters.split(',').map((filter: string) => filter.trim())
     logDebug(`getFilteredTemplateList: ${debugPrefix} 1: filterValues: ${filterValues}`)
 
+    // Get all template folder prefixes (includes private root and all teamspace root folders)
+    const templateFolderPrefixes = await getTemplateFolderPrefixes()
+
+    logDebug(
+      pluginJson,
+      `getFilteredTemplateList: ${debugPrefix} Searching in ${templateFolderPrefixes.length} template folder prefixes: ${templateFolderPrefixes.slice(0, 4).join(', ')}${
+        templateFolderPrefixes.length > 4 ? '...' : ''
+      }`,
+    )
+
     // Get all templates with basic filtering
+    // Check if filename starts with any of the template folder prefixes
     const allTemplates = DataStore.projectNotes
-      .filter((n) => n.filename?.startsWith(templateFolder))
+      .filter((n) => {
+        if (!n.filename) return false
+        return templateFolderPrefixes.some((prefix) => n.filename.startsWith(prefix))
+      })
       .filter((n) => !filterFrontmatterTypes || !n.frontmatterTypes.includes('ignore'))
       .filter((n) => !filterFrontmatterTypes || !n.frontmatterTypes.includes('template-helper'))
       .filter((n) => !n.title?.startsWith('_configuration'))
@@ -66,9 +118,9 @@ export async function getFilteredTemplateList(
     const { matches, exclude } = buildFilterMatches(filterValues)
 
     // Filter templates in a single pass
-    const templateList = []
+    const templateList: Array<{ label: string, value: string, note?: TNote }> = []
     for (const note of allTemplates) {
-      if (note.title == null) continue
+      if (note.title == null || !note.filename) continue
 
       // Get attributes efficiently
       const attrs =
@@ -79,11 +131,12 @@ export async function getFilteredTemplateList(
 
       // Check if template matches filters
       if (templateMatchesFilters(attributeValues, matches, exclude, filterValues)) {
-        const result = { label: note.title, value: note.filename }
-        if (includeNoteObject) {
-          // $FlowIgnore
-          result.note = note
-        }
+        // We already checked note.title != null and note.filename above, so it's safe to use here
+        // $FlowFixMe - Flow doesn't understand that we've already filtered out null titles/filenames
+        const title: string = (note.title: any) || ''
+        const filename: string = (note.filename: any) || ''
+        // $FlowFixMe - Flow has issues with optional properties in object literals
+        const result: { label: string, value: string, note?: TNote } = includeNoteObject ? { label: title, value: filename, note } : { label: title, value: filename }
         templateList.push(result)
       }
     }
@@ -184,25 +237,37 @@ export async function chooseTemplate(tags?: any = '*', promptMessage: string = '
       templateGroupTemplatesByFolder = userOptions.templateGroupTemplatesByFolder
     }
 
-    const templateList = await getTemplateList(tags) // an array of {label: the title, value: the filename}
+    const templateList = await getTemplateList(tags) // an array of {label: the title, value: the filename, note?: TNote}
 
-    let options = []
-    for (const template of templateList) {
-      const parts = template.value.split('/')
-      const filename = parts.pop()
-      let label = template.value.replace(`${NotePlan.environment.templateFolder}/`, '').replace(filename, template.label.replace('/', '-'))
-      if (!templateGroupTemplatesByFolder) {
-        const parts = label.split('/')
-        label = parts[parts.length - 1]
-      }
-      options.push({ label, value: template.value })
+    // Filter out any templates that don't have note objects (shouldn't happen with includeNoteObject: true, but safety check)
+    const templateNotes = templateList.filter((template) => template.note != null).map((template) => template.note)
+
+    if (templateNotes.length === 0) {
+      logWarn(pluginJson, `chooseTemplate: No templates found with tags "${tags}"`)
+      return null
     }
 
     // $FlowIgnore
-    logDebug(pluginJson, `getTemplateContent: pulled together ${options.length} templates in ${timer(start)}`)
-    clo(options[0], 'chooseTemplate options[0]:')
-    // TODO: use chooseNoteV2 instead of chooseOption
-    return await chooseOption<TNote, void>(promptMessage, options)
+    logDebug(pluginJson, `chooseTemplate: Found ${templateNotes.length} templates in ${timer(start)}`)
+
+    // Use chooseNoteV2 to show decorated note selection (includes icons, colors, folder paths, etc.)
+    // This will show templates from both @Templates and @Forms directories across all spaces
+    const selectedNote = await chooseNoteV2(
+      promptMessage,
+      templateNotes,
+      false, // includeCalendarNotes - templates are always regular notes
+      false, // includeFutureCalendarNotes
+      false, // currentNoteFirst
+      false, // allowNewRegularNoteCreation - don't allow creating new notes from template chooser
+    )
+
+    if (!selectedNote) {
+      logDebug(pluginJson, `chooseTemplate: User cancelled template selection`)
+      return null
+    }
+
+    // Return the filename (to maintain backward compatibility with code that expects a filename string)
+    return selectedNote.filename || null
   } catch (error) {
     logError(pluginJson, error)
     return null
@@ -228,11 +293,18 @@ export async function getFilenameFromTemplate(note: string = ''): Promise<string
   if (notes == null) {
     return 'INCOMPLETE'
   }
-  const finalNotes = notes.filter((note) => note.filename.startsWith(NotePlan.environment.templateFolder))
+
+  // Get all template folder prefixes (includes private root and all teamspace root folders)
+  const templateFolderPrefixes = await getTemplateFolderPrefixes()
+
+  // Filter notes to only include those in Templates or Forms folders (in any space)
+  const finalNotes = notes.filter((note) => templateFolderPrefixes.some((prefix) => note.filename.startsWith(prefix)))
   if (finalNotes.length > 1) {
     return 'MULTIPLE NOTES FOUND'
+  } else if (finalNotes.length === 1) {
+    return finalNotes[0].filename
   } else {
-    return notes[0].filename
+    return 'INCOMPLETE'
   }
 }
 
@@ -289,19 +361,37 @@ export async function getTemplateContent(templateName: string = '', options: any
   const parts = templateName.split('/')
   const filename = parts.pop()
 
-  let templateFolderName = await getTemplateFolder()
+  // Get all template folder prefixes (includes private root and all teamspace root folders)
+  const searchFolders = await getTemplateFolderPrefixes()
+
+  // Get template folder name for backward compatibility (first folder in list is typically the main template folder)
+  const templateFolderName = searchFolders[0] || '@Templates'
+
   let originalFilename = templateName
   let templateFilename = templateName
-  if (!templateName.includes(templateFolderName)) {
+
+  // Check if templateName already includes a folder path
+  const hasFolderPath = searchFolders.some((folder) => templateName.startsWith(`${folder}/`))
+  if (!hasFolderPath) {
+    // Try template folder first (for backward compatibility)
     templateFilename = `${templateFolderName}/${templateName}`
   }
   let selectedTemplate: TNote | null = null
 
   try {
     if (isFilename) {
+      // First try the constructed filename
       const fullFilename = templateFilename
       selectedTemplate = (await DataStore.projectNoteByFilename(fullFilename)) || null
 
+      // If not found, try searching in all template folders
+      if (!selectedTemplate && !hasFolderPath) {
+        for (const folder of searchFolders) {
+          selectedTemplate = (await DataStore.projectNoteByFilename(`${folder}/${templateName}`)) || null
+          if (selectedTemplate) break
+        }
+      }
+
       // if the template can't be found using actual filename (as it is on disk)
       // this will occur due to an issue in NotePlan where name on disk does not match note (or template) name
       if (!selectedTemplate) {
@@ -326,39 +416,42 @@ export async function getTemplateContent(templateName: string = '', options: any
         templates = foundTemplates ? Array.from(foundTemplates) : []
         logDebug(pluginJson, `getTemplateContent: Found ${templates.length} notes in DataStore matching title: ${filename || ''}`)
         if (parts.length > 0 && templates && templates.length > 0) {
-          // ensure the path part matched
+          // ensure the path part matched - check against all template folders
           let path = parts.join('/')
-          if (!path.startsWith(templateFolderName)) {
+          const pathMatchesFolder = searchFolders.some((folder) => path.startsWith(`${folder}/`))
+          if (!pathMatchesFolder) {
+            // Try template folder first (for backward compatibility)
             path = templateFolderName + (path.startsWith('/') ? path : `/${path}`)
           }
-          templates = templates.filter((template) => template.filename.startsWith(path)) || []
+          templates = templates.filter((template) => searchFolders.some((folder) => template.filename.startsWith(folder)) && template.filename.startsWith(path)) || []
           logDebug(pluginJson, `getTemplateContent: Found ${templates.length} notes matching title: ${filename || ''} and path: ${path}`)
+        } else {
+          // Filter to only templates in Templates or Forms folders (in any space)
+          templates = templates.filter((template) => searchFolders.some((folder) => template.filename.startsWith(folder))) || []
         }
       }
       if (templates && templates.length > 1) {
         logWarn(pluginJson, `getTemplateContent: Multiple templates found for "${templateFilename || ''}"`)
-        let templatesSecondary = []
-        for (const template of templates) {
-          if (template && template.filename.startsWith(templateFolderName)) {
-            const parts = template.filename.split('/')
-            parts.pop()
-            // $FlowIgnore
-            templatesSecondary.push({ value: template.filename, label: `${parts.join('/')}/${template.title}`, title: template.title })
+        // Filter templates to only include those in template folders (Templates and Forms in all spaces)
+        const filteredTemplates = templates.filter((template) => template && searchFolders.some((folder) => template.filename.startsWith(folder)))
+
+        if (filteredTemplates.length > 1) {
+          logDebug(pluginJson, `getTemplateContent: pulled together ${filteredTemplates.length} templates in ${timer(startTime)}`)
+          // Use chooseNoteV2 to show decorated note selection (includes icons, colors, folder paths, etc.)
+          // This will show templates from both @Templates and @Forms directories across all spaces
+          const selectedNote = await chooseNoteV2(
+            'Choose Template',
+            filteredTemplates,
+            false, // includeCalendarNotes - templates are always regular notes
+            false, // includeFutureCalendarNotes
+            false, // currentNoteFirst
+            false, // allowNewRegularNoteCreation - don't allow creating new notes from template chooser
+          )
+          if (selectedNote) {
+            selectedTemplate = selectedNote
           }
-        }
-
-        if (templatesSecondary.length > 1) {
-          logDebug(pluginJson, `getTemplateContent: pulled together ${templatesSecondary.length} templates in ${timer(startTime)}`)
-          // TODO: use chooseNoteV2 instead of chooseOption
-          // $FlowIgnore
-          let selectedItem = (await chooseOption<TNote, void>('Choose Template', templatesSecondary)) || null
-          if (selectedItem) {
-            // $FlowIgnore
-            selectedTemplate = await DataStore.projectNoteByFilename(selectedItem)
-          }
-        } else if (templatesSecondary.length === 1) {
-          // $FlowIgnore
-          selectedTemplate = await DataStore.projectNoteByFilename(templatesSecondary[0].value)
+        } else if (filteredTemplates.length === 1) {
+          selectedTemplate = filteredTemplates[0]
         } else {
           logError(pluginJson, `getTemplateContent: No templates found for ${templateFilename}`)
         }
@@ -459,11 +552,16 @@ export async function createTemplate(title: string = '', metaData: any, content:
  * @returns {Promise<boolean>} True if the template exists, false otherwise
  */
 export async function templateExists(title: string = ''): Promise<boolean> {
-  const templateFolder = await getTemplateFolder()
+  // Get all template folder prefixes (includes private root and all teamspace root folders)
+  const templateFolderPrefixes = await getTemplateFolderPrefixes()
+
+  // Get template folder name for constructing filename (use first folder for backward compatibility)
+  const templateFolder = templateFolderPrefixes[0] || '@Templates'
 
-  let templateFilename = (await getTemplateFolder()) + title.replace(/@Templates/gi, '').replace(/\/\//, '/')
+  let templateFilename = templateFolder + title.replace(/@Templates/gi, '').replace(/\/\//, '/')
   templateFilename = await normalizeToNotePlanFilename(templateFilename)
   try {
+    // First try the constructed filename
     let note: TNote | null | void = undefined
     note = await DataStore.projectNoteByFilename(`${templateFilename}.md`)
 
@@ -471,6 +569,18 @@ export async function templateExists(title: string = ''): Promise<boolean> {
       note = await DataStore.projectNoteByFilename(`${templateFilename}.txt`)
     }
 
+    // If not found, try searching in all template folders
+    if (typeof note === 'undefined') {
+      for (const folderPrefix of templateFolderPrefixes) {
+        const testFilename = `${folderPrefix}/${title.replace(/@Templates/gi, '').replace(/\/\//, '/')}`
+        const normalizedTestFilename = await normalizeToNotePlanFilename(testFilename)
+        note = await DataStore.projectNoteByFilename(`${normalizedTestFilename}.md`)
+        if (typeof note !== 'undefined') break
+        note = await DataStore.projectNoteByFilename(`${normalizedTestFilename}.txt`)
+        if (typeof note !== 'undefined') break
+      }
+    }
+
     return typeof note !== 'undefined'
   } catch (error) {
     logError(pluginJson, `templateExists :: ${error}`)
diff --git a/np.Templating/lib/engine/templateRenderer.js b/np.Templating/lib/engine/templateRenderer.js
index 1f3ae3faa..a952e190f 100644
--- a/np.Templating/lib/engine/templateRenderer.js
+++ b/np.Templating/lib/engine/templateRenderer.js
@@ -22,21 +22,36 @@ export async function renderTemplateWithEJS(processedTemplateData: string, rende
   logDebug(pluginJson, `EJS render: ${Object.keys(renderData).length} data keys available`)
 
   // Convert EJS closing tags to prevent unwanted whitespace
-  processedTemplateData = convertEJSClosingTags(processedTemplateData)
+  const convertedTemplateData = convertEJSClosingTags(processedTemplateData)
 
-  const result = await ejs.render(processedTemplateData, renderData, options)
+  const result = await ejs.render(convertedTemplateData, renderData, options)
 
   return result
 }
 
 /**
  * Post-processes the rendered result to clean up common issues.
- * @param {string} result - The raw rendered result
- * @returns {string} The cleaned up result
+ * @param {string|any} result - The raw rendered result (may be string, object, or other type)
+ * @returns {string} The cleaned up result (always returns a string)
  */
-export function postProcessResult(result: string): string {
+export function postProcessResult(result: string | any): string {
+  // Ensure result is a string before processing
+  // If result is not a string (e.g., object, undefined, null), convert it to string
+  let resultString: string
+  if (typeof result === 'string') {
+    resultString = result
+  } else if (result === null || result === undefined) {
+    resultString = ''
+  } else if (typeof result === 'object') {
+    // If result is an object, stringify it (but this shouldn't normally happen in EJS rendering)
+    logDebug(pluginJson, `postProcessResult: result is an object, stringifying it: ${JSON.stringify(result)}`)
+    resultString = JSON.stringify(result)
+  } else {
+    resultString = String(result)
+  }
+
   // Clean up undefined values and promise objects
-  let cleanedResult = (result && result?.replace(/undefined/g, '')) || ''
+  let cleanedResult = resultString.replace(/undefined/g, '')
   cleanedResult = cleanedResult.replace(
     /\[object Promise\]/g,
     `[object Promise] (**Templating was not able to get the result of this tag. Try adding an 'await' before the function call. See documentation for more information.**)`,
diff --git a/np.Templating/plugin.json b/np.Templating/plugin.json
index 08bd11b68..015988669 100644
--- a/np.Templating/plugin.json
+++ b/np.Templating/plugin.json
@@ -3,7 +3,7 @@
   "noteplan.minAppVersion": "3.20",
   "plugin.id": "np.Templating",
   "plugin.name": "📒 Templating",
-  "plugin.version": "2.2.8",
+  "plugin.version": "2.2.9",
   "plugin.releaseStatus": "beta",
   "plugin.lastUpdateInfo": "2.2.8: Add triggerTemplateRunner command to automatically run templates when notes are opened\n- New hidden command triggerTemplateRunner checks for runTemplateOnOpen frontmatter attribute\n- When a note with runTemplateOnOpen is opened, the specified template is automatically executed\n- Use triggers: onOpen => np.Templating.triggerTemplateRunner in note frontmatter to enable\n2.2.7: templateRunnerExecute now returns AI analysis errors from all code paths\n- Modified templateRunnerExecute to return Promise<string | void> instead of Promise<void>\n- Added hasAiAnalysisError helper function to detect AI analysis error marker\n- Updated all handler functions (handleCurrentNote, handleRegularNote, handleTodayNote, handleWeeklyNote) to return errors\n- Updated handleNewNoteCreation to return rendered content if it contains AI analysis error\n- All early return paths in templateRunnerExecute now check for and return AI analysis errors\n- This allows Forms plugin to capture and display template rendering errors to users\n2.2.6: (previous version)\n2.2.5: fix messaging in templateNew when templates not found\n- Support template:ignore code blocks in templates\n2.2.4: fix <default> templateLocale setting to allow for locale-specific date/time formatting\n2.2.3: add new weather formatting fields (location.*, :formatted: etc.",
   "plugin.description": "Templating Plugin for NotePlan",
@@ -177,6 +177,12 @@
       "jsFunction": "renderTemplate",
       "hidden": true
     },
+    {
+      "name": "getRenderContext",
+      "description": "Get templating render context with all globals and modules",
+      "jsFunction": "getRenderContext",
+      "hidden": true
+    },
     {
       "name": "np:tft",
       "alias": [
diff --git a/np.Templating/src/NPTemplateRunner.js b/np.Templating/src/NPTemplateRunner.js
index cf51ef95a..4ee2874d2 100644
--- a/np.Templating/src/NPTemplateRunner.js
+++ b/np.Templating/src/NPTemplateRunner.js
@@ -13,7 +13,8 @@ import { logError, logDebug, JSP, clo, overrideSettingsWithStringArgs, timer, lo
 import { getISOWeekAndYear, getISOWeekString, isValidCalendarNoteTitleStr } from '@helpers/dateTime'
 import { getNPWeekData } from '@helpers/NPdateTime'
 import { getNote } from '@helpers/note'
-import { chooseNote } from '@helpers/userInput'
+import { getTemplateNote } from '../lib/NPTemplateNoteHelpers'
+import { chooseNoteV2 } from '@helpers/NPnote'
 import { getNoteTitleFromTemplate } from '@helpers/NPFrontMatter'
 import { replaceDoubleDashes } from '../lib/engine/templateRenderer'
 import { getContentWithLinks } from '@helpers/content'
@@ -580,7 +581,11 @@ export function extractTitleAndShouldOpenSettings(frontmatterAttributes: Object,
 export async function handleNoteSelection(noteTitle: string): Promise<string> {
   if (/<choose>/i.test(noteTitle) || /<select>/i.test(noteTitle)) {
     logDebug(pluginJson, `templateRunnerExecute Inside choose code`)
-    const chosenNote = await chooseNote()
+    const chosenNote = await chooseNoteV2('Choose a note', DataStore.projectNotes, true, false, false, false)
+    if (!chosenNote) {
+      await showMessage('No note selected')
+      throw new Error('No note selected')
+    }
     const selectedTitle = chosenNote?.title || ''
     if (!selectedTitle?.length) {
       await showMessage("Selected note has no title and can't be used")
@@ -1029,7 +1034,7 @@ export async function addFrontmatterToTemplate(_templateToGet?: string = '', ope
     const templateToGet = _templateToGet || Editor.filename || ''
     let theNote = null
     if (templateToGet) {
-      theNote = await getNote(templateToGet, null, NotePlan.environment.templateFolder || '@Templates')
+      theNote = await getTemplateNote(templateToGet, true)
     } else {
       theNote = Editor.note || null
     }
diff --git a/np.Templating/src/Templating.js b/np.Templating/src/Templating.js
index 9221ce664..44e78c504 100644
--- a/np.Templating/src/Templating.js
+++ b/np.Templating/src/Templating.js
@@ -13,6 +13,8 @@ import FrontmatterModule from '@templatingModules/FrontmatterModule'
 import { parseObjectString, validateObjectString } from '@helpers/stringTransforms'
 import { getNote } from '@helpers/note'
 import { getTemplateFolder } from '../lib/config/configManager'
+import { getTemplateNote } from '../lib/NPTemplateNoteHelpers'
+import { getTemplateFolderPrefixes } from '../lib/core/templateManager'
 import { helpInfo } from '../lib/helpers'
 import { getSetting } from '@helpers/NPConfiguration'
 import { smartPrependPara, smartAppendPara } from '@helpers/paragraph'
@@ -25,6 +27,8 @@ import { getAffirmation } from '../lib/support/modules/affirmation'
 import { getAdvice } from '../lib/support/modules/advice'
 import { getDailyQuote } from '../lib/support/modules/quote'
 import { getVerse, getVersePlain } from '../lib/support/modules/verse'
+import globals from '../lib/globals'
+import { getProperyValue } from '../lib/utils'
 
 import { initConfiguration, updateSettingData, pluginUpdated } from '@helpers/NPConfiguration'
 import { selectFirstNonTitleLineInEditor } from '@helpers/NPnote'
@@ -34,6 +38,7 @@ import { getNoteTitleFromTemplate, getNoteTitleFromRenderedContent, analyzeTempl
 
 import pluginJson from '../plugin.json'
 import DateModule from '../lib/support/modules/DateModule'
+import TemplatingEngine from '../lib/TemplatingEngine'
 
 // Editor
 import { templateRunnerExecute } from './NPTemplateRunner'
@@ -111,15 +116,23 @@ export async function templateInsert(templateName: string = ''): Promise<void> {
       const selectedTemplate = templateName.length > 0 ? templateName : await NPTemplating.chooseTemplate()
       let templateData, templateNote
       if (/<current>/i.test(selectedTemplate)) {
-        if (!Editor.filename.startsWith(`@Templates`)) {
-          logError(pluginJson, `You cannot use the <current> prompt in a template that is not located in the @Templates folder; Editor.filename=${Editor.filename}`)
-          await showMessage(pluginJson, `OK`, `You cannot use the <current> prompt in a template that is not located in the @Templates folder`)
+        // Check if current note is in any template folder (Templates or Forms, in any space)
+        const templateFolderPrefixes = await getTemplateFolderPrefixes()
+        const isInTemplateFolder = templateFolderPrefixes.some((prefix) => Editor.filename.startsWith(prefix))
+        if (!isInTemplateFolder) {
+          const templateFolderName = templateFolderPrefixes[0] || '@Templates'
+          logError(pluginJson, `You cannot use the <current> prompt in a template that is not located in a template folder; Editor.filename=${Editor.filename}`)
+          await showMessage(pluginJson, `OK`, `You cannot use the <current> prompt in a template that is not located in a template folder (e.g., ${templateFolderName})`)
           return
         }
         templateNote = Editor.note
         templateData = getContentWithLinks(Editor.note)
       } else {
-        templateNote = await getNote(selectedTemplate, true, `@Templates`)
+        templateNote = await getTemplateNote(selectedTemplate, true)
+        if (!templateNote) {
+          logError(pluginJson, `Unable to locate template "${selectedTemplate}"`)
+          return
+        }
         templateData = getContentWithLinks(templateNote)
       }
       const { frontmatterBody, frontmatterAttributes } = await NPTemplating.renderFrontmatter(templateData)
@@ -161,15 +174,23 @@ export async function templateAppend(templateName: string = ''): Promise<void> {
       const selectedTemplate = templateName.length > 0 ? templateName : await NPTemplating.chooseTemplate()
       let templateData, templateNote
       if (/<current>/i.test(selectedTemplate)) {
-        if (!Editor.filename.startsWith(`@Templates`)) {
-          logError(pluginJson, `You cannot use the <current> prompt in a template that is not located in the @Templates folder; Editor.filename=${Editor.filename}`)
-          await showMessage(pluginJson, `OK`, `You cannot use the <current> prompt in a template that is not located in the @Templates folder`)
+        // Check if current note is in any template folder (Templates or Forms, in any space)
+        const templateFolderPrefixes = await getTemplateFolderPrefixes()
+        const isInTemplateFolder = templateFolderPrefixes.some((prefix) => Editor.filename.startsWith(prefix))
+        if (!isInTemplateFolder) {
+          const templateFolderName = templateFolderPrefixes[0] || '@Templates'
+          logError(pluginJson, `You cannot use the <current> prompt in a template that is not located in a template folder; Editor.filename=${Editor.filename}`)
+          await showMessage(pluginJson, `OK`, `You cannot use the <current> prompt in a template that is not located in a template folder (e.g., ${templateFolderName})`)
           return
         }
         templateNote = Editor.note
         templateData = getContentWithLinks(Editor.note)
       } else {
-        templateNote = await getNote(selectedTemplate, true, `@Templates`)
+        templateNote = await getTemplateNote(selectedTemplate, true)
+        if (!templateNote) {
+          logError(pluginJson, `Unable to locate template "${selectedTemplate}"`)
+          return
+        }
         templateData = getContentWithLinks(templateNote)
       }
 
@@ -968,6 +989,130 @@ export async function renderTemplate(templateName: string = '', userData: any =
   return await NPTemplating.renderTemplate(templateName, userData, userOptions)
 }
 
+/**
+ * Get templating render context with all globals and modules
+ * This is a hidden command for use by other plugins (e.g., Forms plugin)
+ *
+ * The `userData` parameter allows you to add custom variables/properties to the context.
+ * These will be merged with all templating globals and modules, making them available
+ * alongside templating functions. You can structure userData as:
+ * - Flat object: `{ myVar: 'value', anotherVar: 123 }` - properties are merged directly
+ * - Structured: `{ data: { myVar: 'value' }, methods: { myFunc: () => {} } }` - data and methods are merged separately
+ *
+ * @param {any} [userData={}] - User data to merge into the context. Can be a flat object or structured with `data` and `methods` properties.
+ * @returns {Promise<Object>} The full render context object containing:
+ *
+ * **Templating Modules:**
+ * - `date` - DateModule instance (date.format(), date.now(), etc.)
+ * - `time` - TimeModule instance (time formatting functions)
+ * - `note` - NoteModule instance (note operations)
+ * - `tasks` - TasksModule instance (task operations)
+ * - `frontmatter` - FrontmatterModule instance (frontmatter operations)
+ * - `helpers` - HelpersModule instance (utility helpers)
+ * - `utility` - UtilityModule instance (utility functions)
+ * - `system` - SystemModule instance (system operations)
+ * - `web` - WebModule instance (web services: advice, quote, weather, etc.)
+ * - `user` - User info object ({ first, last, email, phone })
+ *
+ * **Templating Globals:**
+ * - `moment` - Moment.js instance for date manipulation
+ * - `affirmation`, `advice`, `quote`, `verse`, `stoicQuote`, `wotd` - Web service functions
+ * - `weather`, `datePicker`, `format`, `now`, `timestamp`, `currentDate`, `currentTime` - Date/time functions
+ * - `events`, `listTodaysEvents`, `matchingEvents` - Event functions
+ * - `getNote`, `getFrontmatterAttributes`, `updateFrontmatterVars` - Note operations
+ * - Plus all other globals from globals.js
+ *
+ * **Special Properties:**
+ * - `np` - Copy of the entire render context (for namespaced access)
+ * - Any properties from `userData` parameter
+ *
+ * **NotePlan Globals:**
+ * - `DataStore`, `Editor`, `CommandBar`, `Calendar`, `NotePlan`, `HTMLView`, `Clipboard` - Available in execution context
+ *
+ * @example
+ * // Basic usage - get context with custom form values
+ * const formValues = { company: 'Acme', topic: 'Meeting' }
+ * const context = await DataStore.invokePluginCommandByName('getRenderContext', 'np.Templating', [formValues])
+ *
+ * // Now context contains:
+ * // - All templating modules: context.date, context.time, context.note, etc.
+ * // - All templating globals: context.moment, context.affirmation, etc.
+ * // - Your form values: context.company, context.topic
+ *
+ * // Use in templatejs block execution:
+ * const fn = Function.apply(null, ['params', 'moment', 'date', 'DataStore', functionBody])
+ * const result = fn(context, context.moment, context.date, DataStore)
+ *
+ * @example
+ * // Structured userData with data and methods
+ * const userData = {
+ *   data: { projectName: 'My Project', status: 'active' },
+ *   methods: { calculateTotal: (a, b) => a + b }
+ * }
+ * const context = await DataStore.invokePluginCommandByName('getRenderContext', 'np.Templating', [userData])
+ * // context.projectName, context.status, and context.calculateTotal are all available
+ *
+ * @example
+ * // Using templating functions in your code
+ * // After getting context, you can use:
+ * // - context.moment().format('YYYY-MM-DD') for date formatting
+ * // - context.date.format('MM/DD/YYYY', '2024-01-15') for formatted dates
+ * // - context.note.getRandomLine('Note Title') for note operations
+ * // - All other templating functions are available
+ */
+export async function getRenderContext(userData: any = {}): Promise<Object> {
+  const startTime = Date.now()
+  logDebug(pluginJson, `getRenderContext: ENTRY - userData keys: ${Object.keys(userData || {}).join(', ')}`)
+
+  try {
+    // Ensure templating is set up (loads config)
+    // Create a temporary instance to get templateConfig
+    const tempInstance = new NPTemplating()
+    await NPTemplating.setup.call(tempInstance)
+    const setupTime = Date.now()
+    logDebug(pluginJson, `getRenderContext: Setup completed in ${setupTime - startTime}ms`)
+
+    // Get templateConfig from the instance
+    const templateConfig = tempInstance.templateConfig || {}
+    const configTime = Date.now()
+    logDebug(pluginJson, `getRenderContext: Config retrieved in ${configTime - setupTime}ms`)
+
+    // Create TemplatingEngine instance with config
+    const templatingEngine = new TemplatingEngine(templateConfig, '', [])
+    const engineTime = Date.now()
+    logDebug(pluginJson, `getRenderContext: Engine created in ${engineTime - configTime}ms`)
+
+    // Get render data with all methods and modules
+    // Pass empty template string since we just want the context, not to render anything
+    let renderContext = await templatingEngine.getRenderDataWithMethods('', userData)
+
+    // Load globals (moment, affirmation, etc.) - they're not included in getRenderDataWithMethods
+    // but are loaded via loadGlobalHelpers in the render pipeline
+    // Since loadGlobalHelpers is not exported, we'll manually load globals the same way it does
+    Object.getOwnPropertyNames(globals).forEach((key) => {
+      renderContext[key] = getProperyValue(globals, key)
+    })
+
+    const contextTime = Date.now()
+    logDebug(pluginJson, `getRenderContext: Context built in ${contextTime - engineTime}ms`)
+    logDebug(
+      pluginJson,
+      `getRenderContext: Context has ${Object.keys(renderContext).length} keys: ${Object.keys(renderContext).slice(0, 20).join(', ')}${
+        Object.keys(renderContext).length > 20 ? '...' : ''
+      }`,
+    )
+
+    const totalTime = Date.now() - startTime
+    logDebug(pluginJson, `getRenderContext: EXIT - Total time: ${totalTime}ms`)
+
+    return renderContext
+  } catch (error) {
+    const totalTime = Date.now() - startTime
+    logError(pluginJson, `getRenderContext: ERROR after ${totalTime}ms - ${error.message}`)
+    throw error
+  }
+}
+
 export async function templateFileByTitle(selectedTemplate?: string = '', openInEditor?: boolean = false, args?: string = ''): Promise<string | void> {
   return await templateRunnerExecute(selectedTemplate, openInEditor, args)
 }
diff --git a/np.Templating/src/index.js b/np.Templating/src/index.js
index 6f43e9ee6..cfe884d68 100644
--- a/np.Templating/src/index.js
+++ b/np.Templating/src/index.js
@@ -37,6 +37,7 @@ export { getTemplateContent } from './Templating'
 export { renderFrontmatter } from './Templating'
 export { render } from './Templating'
 export { renderTemplate } from './Templating'
+export { getRenderContext } from './Templating'
 
 export { templateFileByTitle } from './Templating'