mount-observer 0.1.30 → 0.1.31

package/README.md

@@ -682,7 +682,7 @@ The `Synthesizer` abstract base class enables automatic propagation of mount obs
 
 1. **Syndicator** (in document root): Watches for `script[type="mountobserver"]` and `script[type="emc"]` elements and broadcasts them to subscribers
 2. **Subscriber** (in shadow roots): Receives and clones script elements from the syndicator
-3. **Automatic activation**: Both syndicator and subscriber activate 5 built-in handlers in their respective root nodes
+3. **Automatic activation**: Both syndicator and subscriber activate 7 built-in handlers in their respective root nodes
 
 **Basic usage:**
 
@@ -730,12 +730,31 @@ The `Synthesizer` abstract base class enables automatic propagation of mount obs
 
 **What happens:**
 
-1. The syndicator (`<app-synthesizer>` in document root) activates 5 built-in handlers:
-   - `builtIns.mountObserverScript`
-   - `builtIns.scriptExport`
-   - `builtIns.HTMLInclude`
-   - `builtIns.hoistTemplate`
-   - `builtIns.emcScript`
+1. The syndicator (`<app-synthesizer>` in document root) activates 7 built-in handlers:
+   - `builtIns.mountObserverScript` - Process MOSE scripts
+   - `builtIns.scriptExport` - Expose module exports from script elements
+   - `builtIns.HTMLInclude` - Enable intra-document HTML includes
+   - `builtIns.hoistTemplate` - Optimize template usage
+   - `builtIns.generateIds` - Auto-generate unique IDs
+   - `builtIns.emcParserScript` - Load parsers for EMC scripts
+   - `builtIns.emcScript` - Process EMC scripts
+
+<details>
+<summary>Why these handlers?</summary>
+
+These handlers form the core infrastructure for declarative progressive enhancement:
+
+- **mountObserverScript**: Enables fully declarative mount observer configuration via `<script type="mountobserver">` elements
+- **scriptExport**: Makes ES module exports accessible from script elements, enabling configuration sharing
+- **HTMLInclude**: Allows template reuse and inheritance patterns with `<template src="#id">`
+- **hoistTemplate**: Optimizes memory usage by centralizing template content
+- **generateIds**: Automates ID generation for forms and accessibility features
+- **emcParserScript**: Enables lazy-loading of complex parsers for enhancement attributes
+- **emcScript**: Processes enhancement configurations for progressive enhancement
+
+Together, these handlers enable a complete HTML-first development workflow where behaviors, enhancements, and configurations can be declared in HTML and automatically propagated across shadow DOM boundaries.
+
+</details>
 
 2. The syndicator watches for script elements being added to its light children
 
@@ -749,7 +768,7 @@ The `Synthesizer` abstract base class enables automatic propagation of mount obs
    - Subscribe to `addedscriptelement` events for new scripts
    - Clone each script element and copy its `export` property
    - Append cloned scripts to their own light children
-   - Activate the same 5 built-in handlers in their shadow root
+   - Activate the same 7 built-in handlers in their shadow root
 
 **Syndicator vs Subscriber:**
 
@@ -775,6 +794,12 @@ await this.getRootNode().mount({
 await this.getRootNode().mount({
     do: 'builtIns.hoistTemplate'
 });
+await this.getRootNode().mount({
+    do: 'builtIns.generateIds'
+});
+await this.getRootNode().mount({
+    do: 'builtIns.emcParserScript'
+});
 await this.getRootNode().mount({
     do: 'builtIns.emcScript'
 });
@@ -785,6 +810,8 @@ This ensures that:
 - Script exports are available
 - HTML includes work within each shadow root
 - Templates are hoisted for performance
+- IDs are auto-generated in forms and components
+- Parsers are loaded for EMC scripts
 - EMC scripts enhance elements in each scope
 
 **Script processing:**

package/Synthesizer.js

@@ -13,6 +13,8 @@ import { emc } from 'mount-observer/handlers/EMCScript.js';
 import 'mount-observer/handlers/EMCScript.js';
 import 'mount-observer/handlers/EMCParserScript.js';
 import { emcParser } from 'mount-observer/handlers/EMCParserScript.js';
+import 'mount-observer/handlers/GenIds.js';
+import { genIds } from 'mount-observer/handlers/GenIds.js';
 /**
  * Track which root nodes have already had handlers activated.
  * Uses WeakSet to avoid memory leaks when nodes are garbage collected.
@@ -55,7 +57,7 @@ export class Synthesizer extends HTMLElement {
      * List of built-in handlers to activate.
      */
     static builtInHandlers = [
-        mos, scriptExport, include, hoist, emcParser, emc
+        mos, scriptExport, include, hoist, genIds, emcParser, emc
     ];
     connectedCallback() {
         // Synthesizer elements are infrastructure, not UI

package/Synthesizer.ts

@@ -14,6 +14,8 @@ import {emc} from 'mount-observer/handlers/EMCScript.js';
 import 'mount-observer/handlers/EMCScript.js';
 import 'mount-observer/handlers/EMCParserScript.js';
 import {emcParser} from 'mount-observer/handlers/EMCParserScript.js';
+import 'mount-observer/handlers/GenIds.js';
+import {genIds} from 'mount-observer/handlers/GenIds.js';
 
 /**
  * Track which root nodes have already had handlers activated.
@@ -59,7 +61,7 @@ export abstract class Synthesizer extends HTMLElement {
      * List of built-in handlers to activate.
      */
     protected static builtInHandlers = [
-        mos, scriptExport, include, hoist, emcParser, emc
+        mos, scriptExport, include, hoist, genIds, emcParser, emc
     ];
 
     connectedCallback(): void {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mount-observer",
-  "version": "0.1.30",
+  "version": "0.1.31",
   "description": "Observe and act on css matches.",
   "main": "MountObserver.js",
   "module": "MountObserver.js",