quill updates, signup comment

src/public/_/code/quill.js

@@ -1,6 +1,7 @@
 /*
     Sam Russell
     Captured Sun
+    3.28.26 - Stopping state() from duplicating on rerender()
     3.27.26 - Adding quill router, removing dynamicText(), removing horizontal and verticalAlign() checks
     3.24.26 - Allowing state() to watch other elements
     3.21.26 - Making state() be called on initial definition, fixing fontSize so it works with clamp(), other strings
@@ -186,6 +187,7 @@ window.quill = {
     rendering: [],
     lastState: null,
     router: null,
+    storedState: new WeakMap(),
 
     router: class {
         routes = []
@@ -261,7 +263,19 @@ window.quill = {
         quill.rendering.pop(el)
     },
 
+    removeState: (el) => {
+        let state = quill.storedState.get(el)
+        if(state) {
+            state.forEach(observer => { 
+                observer.disconnect()
+            })
+        }
+        quill.storedState.delete(el)
+    },
+
     rerender: (el) => {
+        quill.removeState(el)
+
         Array.from(el.attributes).forEach(attr => el.removeAttribute(attr.name));
         el.innerHTML = ""
         el.removeAllListeners()
@@ -763,54 +777,64 @@ HTMLElement.prototype.horizontalAlign = function (value) {
 
 /* Elements */
 
-HTMLElement.prototype.state = function(arg1, arg2, arg3) {
+/*
+    STATE RULES:
+        reset on rerender()
+        elements not connected to the dom have their state listeners removed
+*/
+
+HTMLElement.prototype.state = function(arg1, arg2, arg3, arg4) {
     let el;
     let attr;
     let cb;
+    let runImmediately;
 
-    if(arg3) {
-        el = arg1
-        attr = arg2
-        cb = arg3
+    // element, attr, callback
+    // element, attr, callback, bool
+    // attr, callback
+    // attr, callback, bool
+
+    if(arg1 instanceof Element) {
+        if(typeof arg4 === 'boolean') {
+            el = arg1; attr = arg2; cb = arg3; runImmediately = arg4;
+        } else {
+            el = arg1; attr = arg2; cb = arg3; runImmediately = true;
+        }
     } else {
-        el = this
-        attr = arg1
-        cb = arg2
+        if(typeof arg3 === 'boolean') {
+            el = this; attr = arg1; cb = arg2; runImmediately = arg3
+        } else {
+            el = this; attr = arg1; cb = arg2; runImmediately = true
+        }
     }
 
     if (attr !== attr.toLowerCase()) {
-        throw new Error(`quill: dynamicText() attr "${attr}" must be lowercase`);
+        throw new Error(`quill: state() attr "${attr}" must be lowercase`);
     }
 
     let handler = () => {
         const value = el.getAttribute(attr);
-        cb.call(this, value)
+        if(!this.isConnected) {
+            quill.removeState(this)
+        } else {
+            cb.call(this, value)
+        }
     }
 
-    new MutationObserver(handler)
-        .observe(el, { attributes: true, attributeFilter: [attr] });
+    let observer = new MutationObserver(handler)
+    observer.observe(el, { attributes: true, attributeFilter: [attr] })
 
-    handler()
+    if(!quill.storedState.get(this)) {
+        quill.storedState.set(this, [])
+    }
+    quill.storedState.get(this).push(observer)
+
+    if(runImmediately) {
+        handler()
+    }
     return this
 }
 
-HTMLElement.prototype.dynamicText = function(attr, template) {
-    // Set initial text if attr already has a value
-    if (attr !== attr.toLowerCase()) {
-        throw new Error(`quill: dynamicText() attr "${attr}" must be lowercase`);
-    }
-    if (this.getAttribute(attr)) {
-        this.innerText = template.replace('{{}}', this.getAttribute(attr));
-    }
-
-    new MutationObserver(() => {
-        const value = this.getAttribute(attr);
-        this.innerText = template.replace('{{}}', value ?? '');
-    }).observe(this, { attributes: true, attributeFilter: [attr] });
-
-    return this
-};
-
 quill.setChildren = function(el, innerContent) {
     if(typeof innerContent === "string") {
         el.innerText = innerContent