@optionfactory/ful 0.65.0 → 0.66.0

package/dist/ful.iife.js

@@ -560,14 +560,28 @@ var ful = (function (exports) {
         }
     };
 
+    class Deferred {
+        constructor() {
+            this.promise = new Promise((resolve, reject) => {
+                this.reject = reject;
+                this.resolve = resolve;
+            });
+        }
+    }
+
     // SyncEvent.on($0, 'asd', async e => { await ful.timing.sleep(10_000); return 3; })
-    // const [success, results] = await new SyncEvent("asd").dispatchTo($0);
+    // const success = await new SyncEvent("asd").dispatchTo($0);
     class SyncEvent extends CustomEvent {
+        #promises;
         #results;
         constructor(type, options) {
             super(type, {...options, cancelable: true});
+            this.#promises = [];
             this.#results = [];
         }
+        get results(){
+            return this.#results;
+        }
 
         async dispatchTo(el) {
             // unlike "native" events, which are fired by the browser and invoke 
@@ -577,14 +591,14 @@ var ful = (function (exports) {
             el.dispatchEvent(this);
             //we ignore the result of dispatchEvent and use defaultPrevented instead
             //because handlers can be async
-            const results = await Promise.all(this.#results);
-            return [!this.defaultPrevented, results];
+            this.#results = await Promise.all(this.#promises);
+            return !this.defaultPrevented;
         }
 
         static on(el, type, h, useCapture) {
             el.addEventListener(type, e => {
                 //e *must* be an async event
-                e.#results.push(h(e));
+                e.#promises.push(h(e));
             }, useCapture);
         }
     }
@@ -675,6 +689,19 @@ var ful = (function (exports) {
                     to.setAttribute(target, from.getAttribute(a));
                 });
         }
+        /**
+         * 
+         * @param {HTMLElement} el 
+         * @param {stirng} attr 
+         * @param {boolean} value 
+         */
+        static toggle(el, attr, value) {
+            if (value) {
+                el.setAttribute(attr, '');
+            } else {
+                el.remvoeAttribute(attr);
+            }
+        }
     }
 
     class LightSlots {
@@ -711,7 +738,7 @@ var ful = (function (exports) {
     }
 
     class Events {
-        static dispatchChange(el, value){
+        static dispatchChange(el, value) {
             return el.dispatchEvent(new CustomEvent("change", {
                 bubbles: true,
                 cancelable: true,
@@ -847,6 +874,7 @@ var ful = (function (exports) {
             }
             #parsed;
             #initialized;
+            #reflecting;
             #internals;
             constructor(...args) {
                 super(...args);
@@ -883,9 +911,20 @@ var ful = (function (exports) {
                 if (!this.#parsed || oldValue === newValue) {
                     return;
                 }
+                if (this.#reflecting) {
+                    return;
+                }
                 const mapper = attrToMapper[attr];
                 this[attr] = mapper(newValue);
             }
+            reflect(fn) {
+                this.#reflecting = true;
+                try {
+                    fn();
+                } finally {
+                    this.#reflecting = false;
+                }
+            }
             async upgrade() {
                 if (this.#parsed) {
                     return;
@@ -910,29 +949,16 @@ var ful = (function (exports) {
                     return this.internals.states.has(`--${attr}`);
                 },
                 set(value) {
-                    const etb = this.initialized ? 'change' : 'init';
-                    const before = new SyncEvent(`${attr}:${etb}`, {
-                        detail: {
-                            target: this,
-                            value: value
-                        }
-                    });
-                    const eta = this.initialized ? 'changed' : 'inited';
-                    const after = new SyncEvent(`${attr}:${eta}`, {
-                        detail: {
-                            target: this,
-                            value: value
-                        }
-                    });
-
+                    const detail = { target: this, value };
+                    const before = new SyncEvent(`${attr}:${this.initialized ? 'change' : 'init'}`, { detail });
+                    const after = new SyncEvent(`${attr}:${this.initialized ? 'changed' : 'inited'}`, { detail });
                     (async () => {
-                        const [success, results] = await before.dispatchTo(this);
-                        if (!success) {
+                        if (!await before.dispatchTo(this)) {
                             return;
                         }
                         //see https://developer.mozilla.org/en-US/docs/Web/API/CustomStateSet#using_double_dash_prefixed_idents
                         this.internals.states[value ? 'add' : 'delete'](`--${attr}`);
-
+                        this.reflect(() => Attributes.toggle(this, attr, value));
                         await after.dispatchTo(this);
                     })();
                 }
@@ -1421,6 +1447,7 @@ var ful = (function (exports) {
     exports.AuthorizationCodeFlowInterceptor = AuthorizationCodeFlowInterceptor;
     exports.AuthorizationCodeFlowSession = AuthorizationCodeFlowSession;
     exports.Base64 = Base64;
+    exports.Deferred = Deferred;
     exports.ElementsRegistry = ElementsRegistry;
     exports.Failure = Failure;
     exports.Form = Form;