simplyflow 0.2.3 → 0.3.1

package/dist/simply.flow.js

@@ -14,17 +14,24 @@
     effect: () => effect,
     signal: () => signal,
     throttledEffect: () => throttledEffect,
+    trace: () => trace,
     untracked: () => untracked
   });
   var iterate = Symbol("iterate");
   if (!Symbol.xRay) {
     Symbol.xRay = Symbol("xRay");
   }
+  if (!Symbol.Signal) {
+    Symbol.Signal = Symbol("Signal");
+  }
   var signalHandler = {
     get: (target, property, receiver) => {
       if (property === Symbol.xRay) {
         return target;
       }
+      if (property === Symbol.Signal) {
+        return true;
+      }
       const value = target?.[property];
       notifyGet(receiver, property);
       if (typeof value === "function") {
@@ -103,11 +110,27 @@
   };
   var signals = /* @__PURE__ */ new WeakMap();
   function signal(v) {
-    if (!signals.has(v)) {
+    if (v[Symbol.Signal]) {
+      let target = v[Symbol.xRay];
+      if (!signals.has(target)) {
+        signals.set(target, v);
+      }
+      v = target;
+    } else if (!signals.has(v)) {
       signals.set(v, new Proxy(v, signalHandler));
     }
     return signals.get(v);
   }
+  function trace(signal2, prop) {
+    const listeners = getListeners(signal2, prop);
+    return listeners.map((listener) => {
+      return {
+        effect: listener.effectType,
+        fn: listener.effectFunction,
+        signal: signals.get(listener.effectFunction)
+      };
+    });
+  }
   var batchedListeners = /* @__PURE__ */ new Set();
   var batchMode = 0;
   function notifySet(self, context = {}) {
@@ -225,6 +248,8 @@
         throw new Error("Cyclical dependency in update() call", { cause: fn });
       }
       clearListeners(computeEffect2);
+      computeEffect2.effectFunction = fn;
+      computeEffect2.effectType = effect;
       computeStack.push(computeEffect2);
       signalStack.push(connectedSignal);
       let result;
@@ -313,6 +338,8 @@
         return;
       }
       clearListeners(computeEffect2);
+      computeEffect2.effectFunction = fn;
+      computeEffect2.effectType = throttledEffect;
       computeStack.push(computeEffect2);
       signalStack.push(connectedSignal);
       let result;
@@ -354,6 +381,8 @@
       if (lastTick < clock.time) {
         if (hasChanged) {
           clearListeners(computeEffect2);
+          computeEffect2.effectFunction = fn;
+          computeEffect2.effectType = clockEffect;
           computeStack.push(computeEffect2);
           lastTick = clock.time;
           let result;
@@ -392,12 +421,20 @@
 
   // src/bind.mjs
   var SimplyBind = class {
+    /**
+     * @param Object options - a set of options for this instance, options may include:
+     *  - root (signal) (required) - the root data object that contains al signals that can be bound
+     *  - container (HTMLElement) - the dom element to use as the root for all bindings
+     *  - attribute (string) - the prefix for the field, list and map attributes, e.g. 'data-bind'
+     *  - transformers (object name:function) - a map of transformer names and functions
+     *  - defaultTransformers (object with field, list and map properties)
+     */
     constructor(options) {
       this.bindings = /* @__PURE__ */ new Map();
       const defaultOptions = {
         container: document.body,
         attribute: "data-bind",
-        transformers: [],
+        transformers: {},
         defaultTransformers: {
           field: [defaultFieldTransformer],
           list: [defaultListTransformer],
@@ -411,15 +448,21 @@
       const attribute = this.options.attribute;
       const bindAttributes = [attribute + "-field", attribute + "-list", attribute + "-map"];
       const bindSelector = `[${attribute}-field],[${attribute}-list],[${attribute}-map]`;
+      const transformAttribute = attribute + "-transform";
       const getBindingAttribute = (el) => {
-        const foundAttribute = bindAttributes.find((attr) => el.hasAttribute(attr));
+        const foundAttribute = bindAttributes.find((attr2) => el.hasAttribute(attr2));
         if (!foundAttribute) {
-          console.error("No matching attribute found", el);
+          console.error("No matching attribute found", el, attr);
         }
         return foundAttribute;
       };
       const render = (el) => {
         this.bindings.set(el, throttledEffect(() => {
+          if (!el.isConnected) {
+            untrack(el, this.getBindingPath(el));
+            destroy(this.bindings.get(el));
+            return;
+          }
           const context = {
             templates: el.querySelectorAll(":scope > template"),
             attribute: getBindingAttribute(el)
@@ -427,8 +470,9 @@
           context.path = this.getBindingPath(el);
           context.value = getValueByPath(this.options.root, context.path);
           context.element = el;
+          track(el, context);
           runTransformers(context);
-        }, 100));
+        }, 50));
       };
       const runTransformers = (context) => {
         let transformers;
@@ -443,8 +487,8 @@
             transformers = this.options.defaultTransformers.map || [];
             break;
         }
-        if (context.element.dataset.transform) {
-          context.element.dataset.transform.split(" ").filter(Boolean).forEach((t) => {
+        if (context.element.hasAttribute(transformAttribute)) {
+          context.element.getAttribute(transformAttribute).split(" ").filter(Boolean).forEach((t) => {
             if (this.options.transformers[t]) {
               transformers.push(this.options.transformers[t]);
             } else {
@@ -464,7 +508,9 @@
       };
       const applyBindings = (bindings2) => {
         for (let bindingEl of bindings2) {
-          render(bindingEl);
+          if (!this.bindings.get(bindingEl)) {
+            render(bindingEl);
+          }
         }
       };
       const updateBindings = (changes) => {
@@ -488,7 +534,7 @@
       this.observer = new MutationObserver((changes) => {
         updateBindings(changes);
       });
-      this.observer.observe(options.container, {
+      this.observer.observe(this.options.container, {
         subtree: true,
         childList: true
       });
@@ -502,6 +548,8 @@
     /**
      * Finds the first matching template and creates a new DocumentFragment
      * with the correct data bind attributes in it (prepends the current path)
+     * @param Context context
+     * @return DocumentFragment
      */
     applyTemplate(context) {
       const path = context.path;
@@ -527,33 +575,47 @@
       const attributes = [attribute + "-field", attribute + "-list", attribute + "-map"];
       const bindings = clone.querySelectorAll(`[${attribute}-field],[${attribute}-list],[${attribute}-map]`);
       for (let binding of bindings) {
-        const attr = attributes.find((attr2) => binding.hasAttribute(attr2));
-        const bind2 = binding.getAttribute(attr);
+        const attr2 = attributes.find((attr3) => binding.hasAttribute(attr3));
+        const bind2 = binding.getAttribute(attr2);
         if (bind2.substring(0, ":root.".length) == ":root.") {
-          binding.setAttribute(attr, bind2.substring(":root.".length));
+          binding.setAttribute(attr2, bind2.substring(":root.".length));
         } else if (bind2 == ":value" && index != null) {
-          binding.setAttribute(attr, path + "." + index);
+          binding.setAttribute(attr2, path + "." + index);
         } else if (index != null) {
-          binding.setAttribute(attr, path + "." + index + "." + bind2);
+          binding.setAttribute(attr2, path + "." + index + "." + bind2);
         } else {
-          binding.setAttribute(attr, parent + "." + bind2);
+          binding.setAttribute(attr2, parent + "." + bind2);
         }
       }
       if (typeof index !== "undefined") {
         clone.children[0].setAttribute(attribute + "-key", index);
       }
-      clone.children[0].$bindTemplate = template;
+      Object.defineProperty(
+        clone.children[0],
+        "$bindTemplate",
+        {
+          value: template,
+          enumerable: false,
+          writable: true,
+          configurable: true
+        }
+      );
       return clone;
     }
+    /**
+     * Returns the path referenced in either the field, list or map attribute
+     * @param HTMLElement el
+     * @return string The path referenced, or void
+     */
     getBindingPath(el) {
       const attributes = [
         this.options.attribute + "-field",
         this.options.attribute + "-list",
         this.options.attribute + "-map"
       ];
-      for (let attr of attributes) {
-        if (el.hasAttribute(attr)) {
-          return el.getAttribute(attr);
+      for (let attr2 of attributes) {
+        if (el.hasAttribute(attr2)) {
+          return el.getAttribute(attr2);
         }
       }
     }
@@ -612,6 +674,19 @@
   function bind(options) {
     return new SimplyBind(options);
   }
+  var tracking = /* @__PURE__ */ new Map();
+  function track(el, context) {
+    if (!tracking.has(context.path)) {
+      tracking.set(context.path, [context]);
+    } else {
+      tracking.get(context.path).push(context);
+    }
+  }
+  function untrack(el, path) {
+    let list = tracking.get(path);
+    list = list.filter((context) => context.element == el);
+    tracking.set(path, list);
+  }
   function matchValue(a, b) {
     if (a == ":empty" && !b) {
       return true;
@@ -667,6 +742,15 @@
         case "A":
           transformAnchor.call(this, context);
           break;
+        case "IMG":
+          transformImage.call(this, contet);
+          break;
+        case "IFRAME":
+          transformIframe.call(this, context);
+          break;
+        case "META":
+          transformMeta.call(this, context);
+          break;
         case "TEMPLATE":
           break;
         default:
@@ -684,7 +768,7 @@
     const value = context.value;
     const attribute = this.options.attribute;
     if (!Array.isArray(value)) {
-      console.error("Value is not an array.", el, value);
+      console.error("Value is not an array.", el, path, value);
     } else if (!templates?.length) {
       console.error("No templates found in", el);
     } else {
@@ -700,7 +784,7 @@
     const value = context.value;
     const attribute = this.options.attribute;
     if (typeof value != "object") {
-      console.error("Value is not an object.", el, value);
+      console.error("Value is not an object.", el, path, value);
     } else if (!templates?.length) {
       console.error("No templates found in", el);
     } else {
@@ -847,7 +931,11 @@
   }
   function transformInput(context) {
     const el = context.element;
-    const value = context.value;
+    let value = context.value;
+    transformElement(context);
+    if (typeof value == "undefined") {
+      value = "";
+    }
     if (el.type == "checkbox" || el.type == "radio") {
       if (matchValue(el.value, value)) {
         el.checked = true;
@@ -861,48 +949,119 @@
   function transformButton(context) {
     const el = context.element;
     const value = context.value;
-    if (!matchValue(el.value, value)) {
-      el.value = "" + value;
-    }
+    transformElement(context);
+    setProperties(el, value, "value");
   }
   function transformSelect(context) {
     const el = context.element;
-    const value = context.value;
-    if (el.multiple) {
-      if (Array.isArray(value)) {
-        for (let option of el.options) {
-          if (value.indexOf(option.value) === false) {
-            option.selected = false;
-          } else {
-            option.selected = true;
+    let value = context.value;
+    if (value === null) {
+      value = "";
+    }
+    if (typeof value != "object") {
+      if (el.multiple) {
+        if (Array.isArray(value)) {
+          for (let option of el.options) {
+            if (value.indexOf(option.value) === false) {
+              option.selected = false;
+            } else {
+              option.selected = true;
+            }
           }
         }
+      } else {
+        let option = el.options.find((o) => matchValue(o.value, value));
+        if (option) {
+          option.selected = true;
+          option.setAttribute("selected", true);
+        }
       }
     } else {
-      let option = el.options.find((o) => matchValue(o.value, value));
-      if (option) {
-        option.selected = true;
+      if (value.options) {
+        setSelectOptions(el, value.options);
+      }
+      if (value.selected) {
+        transformSelect(Object.asssign({}, context, { value: value.selected }));
+      }
+      setProperties(el, value, "name", "id", "selectedIndex", "className");
+    }
+  }
+  function addOption(select, option) {
+    if (!option) {
+      return;
+    }
+    if (typeof option !== "object") {
+      select.options.add(new Option("" + option));
+    } else if (option.text) {
+      select.options.add(new Option(option.text, option.value, option.defaultSelected, option.selected));
+    } else if (typeof option.value != "undefined") {
+      select.options.add(new Option("" + option.value, option.value, option.defaultSelected, option.selected));
+    }
+  }
+  function setSelectOptions(select, options) {
+    select.innerHTML = "";
+    if (Array.isArray(options)) {
+      for (const option of options) {
+        addOption(select, option);
+      }
+    } else if (options && typeof options == "object") {
+      for (const option in options) {
+        addOption(select, { text: options[option], value: option });
       }
     }
   }
   function transformAnchor(context) {
     const el = context.element;
     const value = context.value;
-    if (value?.innerHTML && !matchValue(el.innerHTML, value.innerHTML)) {
-      el.innerHTML = "" + value.innerHTML;
-    }
-    if (value?.href && !matchValue(el.href, value.href)) {
-      el.href = "" + value.href;
-    }
+    transformElement(context);
+    setProperties(el, value, "title", "target", "href", "name", "newwindow", "nofollow");
   }
-  function transformElement(context) {
+  function transformImage(context) {
+    const el = context.element;
+    const value = context.value;
+    transformElement(context);
+    setProperties(el, value, "title", "alt", "src");
+  }
+  function transformIframe(context) {
+    const el = context.element;
+    const value = context.value;
+    transformElement(context);
+    setProperties(el, value, "title", "src");
+  }
+  function transformMeta(context) {
     const el = context.element;
     const value = context.value;
-    if (!matchValue(el.innerHTML, value)) {
-      if (typeof value == "undefined" || value == null) {
-        el.innerHTML = "";
+    transformElement(context);
+    setProperties(el, value, "content");
+  }
+  function transformElement(context) {
+    const el = context.element;
+    let value = context.value;
+    if (typeof value == "undefined" || value == null) {
+      value = "";
+    }
+    let strValue = "" + value;
+    if (typeof value != "object" || strValue.substring(0, 8) != "[object ") {
+      el.innerHTML = strValue;
+      return;
+    }
+    setProperties(el, value, "innerHTML", "title", "id", "className");
+  }
+  function setProperties(el, data, ...properties) {
+    if (!data || typeof data !== "object") {
+      return;
+    }
+    for (const property of properties) {
+      if (typeof data[property] === "undefined") {
+        continue;
+      }
+      if (matchValue(el[property], data[property])) {
+        continue;
+      }
+      if (data[property] === null) {
+        el[property] = "";
       } else {
-        el.innerHTML = "" + value;
+        el[property] = "" + data[property];
       }
     }
   }
@@ -980,13 +1139,13 @@
           }
         }
       }, options);
-      return effect(() => {
+      return throttledEffect(() => {
         const sort2 = this.state.options.sort;
         if (sort2?.sortBy && sort2?.direction) {
           return data.current.toSorted(sort2?.sortFn);
         }
         return data.current;
-      });
+      }, 50);
     };
   }
   function paging(options = {}) {
@@ -996,7 +1155,7 @@
         pageSize: 20,
         max: 1
       }, options);
-      return effect(() => {
+      return throttledEffect(() => {
         return batch(() => {
           const paging2 = this.state.options.paging;
           if (!paging2.pageSize) {
@@ -1008,26 +1167,27 @@
           const end = start + paging2.pageSize;
           return data.current.slice(start, end);
         });
-      });
+      }, 50);
     };
   }
   function filter(options) {
     if (!options?.name || typeof options.name !== "string") {
       throw new Error("filter requires options.name to be a string");
     }
-    if (this.state.options[options.name]) {
-      throw new Error("a filter with this name already exists on this model");
-    }
     if (!options.matches || typeof options.matches !== "function") {
       throw new Error("filter requires options.matches to be a function");
     }
     return function(data) {
+      if (this.state.options[options.name]) {
+        throw new Error("a filter with this name already exists on this model");
+      }
       this.state.options[options.name] = options;
-      return effect(() => {
+      return throttledEffect(() => {
         if (this.state.options[options.name].enabled) {
-          return data.filter(this.state.options[options.name].matches);
+          return data.current.filter(this.state.options[options.name].matches.bind(this));
         }
-      });
+        return data.current;
+      }, 50);
     };
   }
   function columns(options = {}) {
@@ -1036,7 +1196,7 @@
     }
     return function(data) {
       this.state.options.columns = options;
-      return effect(() => {
+      return throttledEffect(() => {
         return data.current.map((input) => {
           let result = {};
           for (let key of Object.keys(this.state.options.columns)) {
@@ -1046,7 +1206,7 @@
           }
           return result;
         });
-      });
+      }, 50);
     };
   }
   function scroll(options) {
@@ -1068,12 +1228,12 @@
             );
           });
         }
-        effect(() => {
+        throttledEffect(() => {
           scrollOptions.size = data.current.length * scrollOptions.rowHeight;
           scrollbar.style.height = scrollOptions.size + "px";
-        });
+        }, 50);
       }
-      return effect(() => {
+      return throttledEffect(() => {
         if (scrollOptions.container) {
           scrollOptions.rowCount = Math.ceil(
             scrollOptions.container.getBoundingClientRect().height / scrollOptions.rowHeight
@@ -1087,7 +1247,7 @@
           start = end - scrollOptions.rowCount;
         }
         return data.current.slice(start, end);
-      });
+      }, 50);
     };
   }
 

package/dist/simply.flow.min.js

@@ -1,2 +1,2 @@
-(()=>{var J=Object.defineProperty;var V=(e,t)=>{for(var n in t)J(e,n,{get:t[n],enumerable:!0})};var R={};V(R,{batch:()=>H,clockEffect:()=>_,destroy:()=>q,effect:()=>E,signal:()=>A,throttledEffect:()=>z,untracked:()=>ee});var P=Symbol("iterate");Symbol.xRay||(Symbol.xRay=Symbol("xRay"));var Q={get:(e,t,n)=>{if(t===Symbol.xRay)return e;let i=e?.[t];return O(n,t),typeof i=="function"?Array.isArray(e)?(...r)=>{let s=e.length,l=i.apply(n,r);return s!=e.length&&S(n,w("length",{was:s,now:e.length})),l}:e instanceof Set||e instanceof Map?(...r)=>{let s=e.size,l=i.apply(e,r);return s!=e.size&&S(n,w("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&S(n,w({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),l}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?i.bind(e):i.bind(n):i&&typeof i=="object"?A(i):i},set:(e,t,n,i)=>{n=n?.[Symbol.xRay]||n;let r=e[t];return r!==n&&(e[t]=n,S(i,w(t,{was:r,now:n}))),typeof r>"u"&&S(i,w(P,{})),!0},has:(e,t)=>{let n=g.get(e);return n&&O(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let i=g.get(e);S(i,w(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let i=g.get(e);S(i,w(P,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=g.get(e);return O(t,P),Reflect.ownKeys(e)}},g=new WeakMap;function A(e){return g.has(e)||g.set(e,new Proxy(e,Q)),g.get(e)}var B=new Set,k=0;function S(e,t={}){let n=[];if(t.forEach((i,r)=>{let s=Y(e,r);if(s?.length){for(let l of s)X(l,w(r,i));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(k)B=B.union(n);else{let i=b[b.length-1];for(let r of Array.from(n))r!=i&&r?.needsUpdate&&r(),x(r)}}function w(e,t){let n=new Map;if(typeof e=="object")for(let i in e)n.set(i,e[i]);else n.set(e,t);return n}function X(e,t){e.context?t.forEach((n,i)=>{e.context.set(i,n)}):e.context=t,e.needsUpdate=!0}function x(e){delete e.context,delete e.needsUpdate}function O(e,t){let n=b[b.length-1];n&&Z(e,t,n)}var M=new WeakMap,C=new WeakMap;function Y(e,t){let n=M.get(e);return n?Array.from(n.get(t)||[]):[]}function Z(e,t,n){M.has(e)||M.set(e,new Map);let i=M.get(e);i.has(t)||i.set(t,new Set),i.get(t).add(n),C.has(n)||C.set(n,new Map);let r=C.get(n);r.has(t)||r.set(t,new Set),r.get(t).add(e)}function $(e){let t=C.get(e);t&&t.forEach(n=>{n.forEach(i=>{let r=M.get(i);r.has(n)&&r.get(n).delete(e)})})}var b=[],L=[],j=new WeakMap,T=[];function E(e){if(L.findIndex(i=>e==i)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let t=g.get(e);t||(t=A({current:null}),g.set(e,t));let n=function i(){if(T.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});$(i),b.push(i),T.push(t);let r;try{r=e(i,b,T)}finally{b.pop(),T.pop(),r instanceof Promise?r.then(s=>{t.current=s}):t.current=r}};return n.fn=e,j.set(t,n),n(),t}function q(e){let t=j.get(e)?.deref();if(!t)return;$(t);let n=t.fn;g.remove(n),j.delete(e)}function H(e){k++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{k--,k||W()}):(k--,k||W())}return t}function W(){let e=Array.from(B);B=new Set;let t=b[b.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),x(n)}function z(e,t){if(L.findIndex(l=>e==l)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let n=g.get(e);n||(n=A({current:null}),g.set(e,n));let i=!1,r=!0;return function l(){if(T.findIndex(a=>a==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(i&&i>Date.now()){r=!0;return}$(l),b.push(l),T.push(n);let o;try{o=e(l,b,T)}finally{r=!1,b.pop(),T.pop(),o instanceof Promise?o.then(a=>{n.current=a}):n.current=o}i=Date.now()+t,globalThis.setTimeout(()=>{r&&l()},t)}(),n}function _(e,t){let n=g.get(e);n||(n=A({current:null}),g.set(e,n));let i=-1,r=!0;return function l(){if(i<t.time)if(r){$(l),b.push(l),i=t.time;let o;try{o=e(l,b)}finally{b.pop(),o instanceof Promise?o.then(a=>{n.current=a}):n.current=o,r=!1}}else i=t.time;else r=!0}(),n}function ee(e){let t=b.slice();b=[];try{return e()}finally{b=t}}var N=class{constructor(t){this.bindings=new Map;let n={container:document.body,attribute:"data-bind",transformers:[],defaultTransformers:{field:[te],list:[ne],map:[ie]}};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},n,t);let i=this.options.attribute,r=[i+"-field",i+"-list",i+"-map"],s=`[${i}-field],[${i}-list],[${i}-map]`,l=u=>{let f=r.find(m=>u.hasAttribute(m));return f||console.error("No matching attribute found",u),f},o=u=>{this.bindings.set(u,z(()=>{let f={templates:u.querySelectorAll(":scope > template"),attribute:l(u)};f.path=this.getBindingPath(u),f.value=I(this.options.root,f.path),f.element=u,a(f)},100))},a=u=>{let f;switch(u.attribute){case this.options.attribute+"-field":f=this.options.defaultTransformers.field||[];break;case this.options.attribute+"-list":f=this.options.defaultTransformers.list||[];break;case this.options.attribute+"-map":f=this.options.defaultTransformers.map||[];break}u.element.dataset.transform&&u.element.dataset.transform.split(" ").filter(Boolean).forEach(d=>{this.options.transformers[d]?f.push(this.options.transformers[d]):console.warn("No transformer with name "+d+" configured",{cause:u.element})});let m;for(let d of f)m=((y,F)=>G=>F.call(this,G,y))(m,d);m(u)},p=u=>{for(let f of u)o(f)},c=u=>{let f=`[${i}-field],[${i}-list],[${i}-map]`;for(let m of u)if(m.type=="childList"&&m.addedNodes){for(let d of m.addedNodes)if(d instanceof HTMLElement){let y=Array.from(d.querySelectorAll(f));d.matches(f)&&y.unshift(d),y.length&&p(y)}}};this.observer=new MutationObserver(u=>{c(u)}),this.observer.observe(t.container,{subtree:!0,childList:!0});let h=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");h.length&&p(h)}applyTemplate(t){let n=t.path,i=t.templates,r=t.list,s=t.index,l=t.parent,o=r?r[s]:t.value,a=this.findTemplate(i,o);if(!a){let f=new DocumentFragment;return f.innerHTML="<!-- no matching template -->",f}let p=a.content.cloneNode(!0);if(!p.children?.length)return p;if(p.children.length>1)throw new Error("template must contain a single root node",{cause:a});let c=this.options.attribute,h=[c+"-field",c+"-list",c+"-map"],u=p.querySelectorAll(`[${c}-field],[${c}-list],[${c}-map]`);for(let f of u){let m=h.find(y=>f.hasAttribute(y)),d=f.getAttribute(m);d.substring(0,6)==":root."?f.setAttribute(m,d.substring(6)):d==":value"&&s!=null?f.setAttribute(m,n+"."+s):s!=null?f.setAttribute(m,n+"."+s+"."+d):f.setAttribute(m,l+"."+d)}return typeof s<"u"&&p.children[0].setAttribute(c+"-key",s),p.children[0].$bindTemplate=a,p}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let i of n)if(t.hasAttribute(i))return t.getAttribute(i)}findTemplate(t,n){let i=l=>{let o=this.getBindingPath(l),a;o?o.substr(0,6)==":root."?a=I(this.options.root,o):a=I(n,o):a=n;let p=""+a,c=l.getAttribute(this.options.attribute+"-match");if(c){if(c===":empty"&&!a)return l;if(c===":notempty"&&a||p.match(c))return l}if(!c&&a!==null&&a!==void 0)return l},r=Array.from(t).find(i),s=r?.getAttribute("rel");if(s){let l=document.querySelector("template#"+s);if(!l)throw new Error("Could not find template with id "+s);r=l}return r}destroy(){this.bindings.forEach(t=>{q(t)}),this.bindings=new Map,this.observer.disconnect()}};function D(e){return new N(e)}function v(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}function I(e,t){let n=t.split("."),i=e,r,s;for(;n.length&&i;){if(r=n.shift(),r==":key")return s;if(r==":value")return i;r==":root"?i=e:(r=decodeURIComponent(r),i=i[r],s=r)}return i}function te(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;if(n?.length)oe.call(this,e);else switch(t.tagName){case"INPUT":ae.call(this,e);break;case"BUTTON":fe.call(this,e);break;case"SELECT":ue.call(this,e);break;case"A":ce.call(this,e);break;case"TEMPLATE":break;default:pe.call(this,e);break}return e}function ne(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return Array.isArray(s)?n?.length?re.call(this,e):console.error("No templates found in",t):console.error("Value is not an array.",t,s),e}function ie(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return typeof s!="object"?console.error("Value is not an object.",t,s):n?.length?se.call(this,e):console.error("No templates found in",t),e}function re(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute,o=t.querySelectorAll(":scope > ["+l+"-key]"),a=0,p=0;e.list=s;for(let h of o){let u=parseInt(h.getAttribute(l+"-key"));if(u>a)e.index=a,t.insertBefore(this.applyTemplate(e),h);else if(u<a)h.remove();else{let f=Array.from(h.querySelectorAll(`[${l}]`));h.matches(`[${l}]`)&&f.unshift(h);let m=f.find(d=>{let y=d.getAttribute(l);return y.substr(0,5)!==":root"&&y.substr(0,r.length)!==r});if(!m&&h.$bindTemplate){let d=this.findTemplate(n,s[a]);d!=h.$bindTemplate&&(m=!0,d||p++)}m&&(e.index=a,t.replaceChild(this.applyTemplate(e),h))}if(a++,a>=s.length)break}o=t.querySelectorAll(":scope > ["+l+"-key]");let c=o.length+p;if(c>s.length)for(;c>s.length;)t.querySelectorAll(":scope > :not(template)")?.[c-1]?.remove(),c--;else if(c<s.length)for(;c<s.length;)e.index=c,t.appendChild(this.applyTemplate(e)),c++}function se(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;e.list=s;let o=Array.from(t.querySelectorAll(":scope > ["+l+"-key]"));for(let a in e.list){e.index=a;let p=o.shift();if(!p){let h=this.applyTemplate(e);t.appendChild(h);continue}if(p.getAttribute[l+"-key"]!=a){o.unshift(p);let h=t.querySelector(":scope > ["+l+'-key="'+a+'"]');if(h)t.insertBefore(h,p),p=h,o=o.filter(u=>u!=h);else{let u=this.applyTemplate(e);t.insertBefore(u,p);continue}}if(this.findTemplate(n,s[a])!=p.$bindTemplate){let h=this.applyTemplate(e);t.replaceChild(h,p)}}for(;o.length;)o.shift().remove()}function le(e,t){let n=e.parentElement?.closest(`[${t}-list],[${t}-map]`);return n?n.hasAttribute(`${t}-list`)?n.getAttribute(`${t}-list`):n.getAttribute(`${t}-map`):":root"}function oe(e){let t=e.element,n=e.templates,i=e.value,r=this.options.attribute,s=t.querySelector(":scope > :not(template)"),l=this.findTemplate(n,i);if(e.parent=le(t,r),s)if(l){if(s?.$bindTemplate!=l){let o=this.applyTemplate(e);t.replaceChild(o,s)}}else t.removeChild(s);else if(l){let o=this.applyTemplate(e);t.appendChild(o)}}function ae(e){let t=e.element,n=e.value;t.type=="checkbox"||t.type=="radio"?v(t.value,n)?t.checked=!0:t.checked=!1:v(t.value,n)||(t.value=""+n)}function fe(e){let t=e.element,n=e.value;v(t.value,n)||(t.value=""+n)}function ue(e){let t=e.element,n=e.value;if(t.multiple){if(Array.isArray(n))for(let i of t.options)n.indexOf(i.value)===!1?i.selected=!1:i.selected=!0}else{let i=t.options.find(r=>v(r.value,n));i&&(i.selected=!0)}}function ce(e){let t=e.element,n=e.value;n?.innerHTML&&!v(t.innerHTML,n.innerHTML)&&(t.innerHTML=""+n.innerHTML),n?.href&&!v(t.href,n.href)&&(t.href=""+n.href)}function pe(e){let t=e.element,n=e.value;v(t.innerHTML,n)||(typeof n>"u"||n==null?t.innerHTML="":t.innerHTML=""+n)}var K={};V(K,{columns:()=>ge,filter:()=>be,model:()=>he,paging:()=>me,scroll:()=>ye,sort:()=>de});var U=class{constructor(t){this.state=A(t),this.state.options||(this.state.options={}),this.effects=[{current:t.data}],this.view=A(t.data)}addEffect(t){let n=this.effects[this.effects.length-1];this.view=t.call(this,n),this.effects.push(this.view)}};function he(e){return new U(e)}function de(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,i)=>{let r=this.state.options.sort,s=r.sortBy;if(!r.sortBy)return 0;let l=r.direction=="asc"?1:-1,o=r.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof i?.[s]>"u"?0:l:typeof i?.[s]>"u"||n[s]<i[s]?o:n[s]>i[s]?l:0}},e),E(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current})}}function me(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),E(()=>H(()=>{let n=this.state.options.paging;n.pageSize||(n.pageSize=20),n.max=Math.ceil(this.state.data.length/n.pageSize),n.page=Math.max(1,Math.min(n.max,n.page));let i=(n.page-1)*n.pageSize,r=i+n.pageSize;return t.current.slice(i,r)}))}}function be(e){if(!e?.name||typeof e.name!="string")throw new Error("filter requires options.name to be a string");if(this.state.options[e.name])throw new Error("a filter with this name already exists on this model");if(!e.matches||typeof e.matches!="function")throw new Error("filter requires options.matches to be a function");return function(t){return this.state.options[e.name]=e,E(()=>{if(this.state.options[e.name].enabled)return t.filter(this.state.options[e.name].matches)})}}function ge(e={}){if(!e||typeof e!="object"||Object.keys(e).length===0)throw new Error("columns requires options to be an object with at least one property");return function(t){return this.state.options.columns=e,E(()=>t.current.map(n=>{let i={};for(let r of Object.keys(this.state.options.columns))this.state.options.columns[r]?.hidden||(i[r]=n[r]);return i}))}}function ye(e){return function(t){this.state.options.scroll=Object.assign({offset:0,rowHeight:26,rowCount:20,itemsPerRow:1,size:t.current.length},e);let n=this.state.options.scroll,i=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return i&&(n.container&&n.container.addEventListener("scroll",r=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),E(()=>{n.size=t.current.length*n.rowHeight,i.style.height=n.size+"px"})),E(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let r=Math.min(n.offset,t.current.length-1),s=r+n.rowCount;return s>t.current.length&&(s=t.current.length,r=s-n.rowCount),t.current.slice(r,s)})}}window.simply||(window.simply={});Object.assign(window.simply,{bind:D,flow:K,state:R});var ve=window.simply;})();
+(()=>{var ne=Object.defineProperty;var D=(e,t)=>{for(var n in t)ne(e,n,{get:t[n],enumerable:!0})};var F={};D(F,{batch:()=>H,clockEffect:()=>X,destroy:()=>q,effect:()=>Q,signal:()=>T,throttledEffect:()=>w,trace:()=>re,untracked:()=>oe});var R=Symbol("iterate");Symbol.xRay||(Symbol.xRay=Symbol("xRay"));Symbol.Signal||(Symbol.Signal=Symbol("Signal"));var ie={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let i=e?.[t];return z(n,t),typeof i=="function"?Array.isArray(e)?(...r)=>{let s=e.length,l=i.apply(n,r);return s!=e.length&&v(n,S("length",{was:s,now:e.length})),l}:e instanceof Set||e instanceof Map?(...r)=>{let s=e.size,l=i.apply(e,r);return s!=e.size&&v(n,S("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&v(n,S({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),l}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?i.bind(e):i.bind(n):i&&typeof i=="object"?T(i):i},set:(e,t,n,i)=>{n=n?.[Symbol.xRay]||n;let r=e[t];return r!==n&&(e[t]=n,v(i,S(t,{was:r,now:n}))),typeof r>"u"&&v(i,S(R,{})),!0},has:(e,t)=>{let n=b.get(e);return n&&z(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let i=b.get(e);v(i,S(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let i=b.get(e);v(i,S(R,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=b.get(e);return z(t,R),Reflect.ownKeys(e)}},b=new WeakMap;function T(e){if(e[Symbol.Signal]){let t=e[Symbol.xRay];b.has(t)||b.set(t,e),e=t}else b.has(e)||b.set(e,new Proxy(e,ie));return b.get(e)}function re(e,t){return J(e,t).map(i=>({effect:i.effectType,fn:i.effectFunction,signal:b.get(i.effectFunction)}))}var P=new Set,M=0;function v(e,t={}){let n=[];if(t.forEach((i,r)=>{let s=J(e,r);if(s?.length){for(let l of s)se(l,S(r,i));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(M)P=P.union(n);else{let i=m[m.length-1];for(let r of Array.from(n))r!=i&&r?.needsUpdate&&r(),x(r)}}function S(e,t){let n=new Map;if(typeof e=="object")for(let i in e)n.set(i,e[i]);else n.set(e,t);return n}function se(e,t){e.context?t.forEach((n,i)=>{e.context.set(i,n)}):e.context=t,e.needsUpdate=!0}function x(e){delete e.context,delete e.needsUpdate}function z(e,t){let n=m[m.length-1];n&&le(e,t,n)}var B=new WeakMap,j=new WeakMap;function J(e,t){let n=B.get(e);return n?Array.from(n.get(t)||[]):[]}function le(e,t,n){B.has(e)||B.set(e,new Map);let i=B.get(e);i.has(t)||i.set(t,new Set),i.get(t).add(n),j.has(n)||j.set(n,new Map);let r=j.get(n);r.has(t)||r.set(t,new Set),r.get(t).add(e)}function L(e){let t=j.get(e);t&&t.forEach(n=>{n.forEach(i=>{let r=B.get(i);r.has(n)&&r.get(n).delete(e)})})}var m=[],$=[],N=new WeakMap,A=[];function Q(e){if($.findIndex(i=>e==i)!==-1)throw new Error("Recursive update() call",{cause:e});$.push(e);let t=b.get(e);t||(t=T({current:null}),b.set(e,t));let n=function i(){if(A.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});L(i),i.effectFunction=e,i.effectType=Q,m.push(i),A.push(t);let r;try{r=e(i,m,A)}finally{m.pop(),A.pop(),r instanceof Promise?r.then(s=>{t.current=s}):t.current=r}};return n.fn=e,N.set(t,n),n(),t}function q(e){let t=N.get(e)?.deref();if(!t)return;L(t);let n=t.fn;b.remove(n),N.delete(e)}function H(e){M++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{M--,M||G()}):(M--,M||G())}return t}function G(){let e=Array.from(P);P=new Set;let t=m[m.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),x(n)}function w(e,t){if($.findIndex(l=>e==l)!==-1)throw new Error("Recursive update() call",{cause:e});$.push(e);let n=b.get(e);n||(n=T({current:null}),b.set(e,n));let i=!1,r=!0;return function l(){if(A.findIndex(f=>f==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(i&&i>Date.now()){r=!0;return}L(l),l.effectFunction=e,l.effectType=w,m.push(l),A.push(n);let a;try{a=e(l,m,A)}finally{r=!1,m.pop(),A.pop(),a instanceof Promise?a.then(f=>{n.current=f}):n.current=a}i=Date.now()+t,globalThis.setTimeout(()=>{r&&l()},t)}(),n}function X(e,t){let n=b.get(e);n||(n=T({current:null}),b.set(e,n));let i=-1,r=!0;return function l(){if(i<t.time)if(r){L(l),l.effectFunction=e,l.effectType=X,m.push(l),i=t.time;let a;try{a=e(l,m)}finally{m.pop(),a instanceof Promise?a.then(f=>{n.current=f}):n.current=a,r=!1}}else i=t.time;else r=!0}(),n}function oe(e){let t=m.slice();m=[];try{return e()}finally{m=t}}var V=class{constructor(t){this.bindings=new Map;let n={container:document.body,attribute:"data-bind",transformers:{},defaultTransformers:{field:[ue],list:[ce],map:[pe]}};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},n,t);let i=this.options.attribute,r=[i+"-field",i+"-list",i+"-map"],s=`[${i}-field],[${i}-list],[${i}-map]`,l=i+"-transform",a=o=>{let u=r.find(d=>o.hasAttribute(d));return u||console.error("No matching attribute found",o,attr),u},f=o=>{this.bindings.set(o,w(()=>{if(!o.isConnected){fe(o,this.getBindingPath(o)),q(this.bindings.get(o));return}let u={templates:o.querySelectorAll(":scope > template"),attribute:a(o)};u.path=this.getBindingPath(o),u.value=U(this.options.root,u.path),u.element=o,ae(o,u),p(u)},50))},p=o=>{let u;switch(o.attribute){case this.options.attribute+"-field":u=this.options.defaultTransformers.field||[];break;case this.options.attribute+"-list":u=this.options.defaultTransformers.list||[];break;case this.options.attribute+"-map":u=this.options.defaultTransformers.map||[];break}o.element.hasAttribute(l)&&o.element.getAttribute(l).split(" ").filter(Boolean).forEach(g=>{this.options.transformers[g]?u.push(this.options.transformers[g]):console.warn("No transformer with name "+g+" configured",{cause:o.element})});let d;for(let g of u)d=((C,ee)=>te=>ee.call(this,te,C))(d,g);d(o)},c=o=>{for(let u of o)this.bindings.get(u)||f(u)},h=o=>{let u=`[${i}-field],[${i}-list],[${i}-map]`;for(let d of o)if(d.type=="childList"&&d.addedNodes){for(let g of d.addedNodes)if(g instanceof HTMLElement){let C=Array.from(g.querySelectorAll(u));g.matches(u)&&C.unshift(g),C.length&&c(C)}}};this.observer=new MutationObserver(o=>{h(o)}),this.observer.observe(this.options.container,{subtree:!0,childList:!0});let y=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");y.length&&c(y)}applyTemplate(t){let n=t.path,i=t.templates,r=t.list,s=t.index,l=t.parent,a=r?r[s]:t.value,f=this.findTemplate(i,a);if(!f){let o=new DocumentFragment;return o.innerHTML="<!-- no matching template -->",o}let p=f.content.cloneNode(!0);if(!p.children?.length)return p;if(p.children.length>1)throw new Error("template must contain a single root node",{cause:f});let c=this.options.attribute,h=[c+"-field",c+"-list",c+"-map"],y=p.querySelectorAll(`[${c}-field],[${c}-list],[${c}-map]`);for(let o of y){let u=h.find(g=>o.hasAttribute(g)),d=o.getAttribute(u);d.substring(0,6)==":root."?o.setAttribute(u,d.substring(6)):d==":value"&&s!=null?o.setAttribute(u,n+"."+s):s!=null?o.setAttribute(u,n+"."+s+"."+d):o.setAttribute(u,l+"."+d)}return typeof s<"u"&&p.children[0].setAttribute(c+"-key",s),Object.defineProperty(p.children[0],"$bindTemplate",{value:f,enumerable:!1,writable:!0,configurable:!0}),p}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let i of n)if(t.hasAttribute(i))return t.getAttribute(i)}findTemplate(t,n){let i=l=>{let a=this.getBindingPath(l),f;a?a.substr(0,6)==":root."?f=U(this.options.root,a):f=U(n,a):f=n;let p=""+f,c=l.getAttribute(this.options.attribute+"-match");if(c){if(c===":empty"&&!f)return l;if(c===":notempty"&&f||p.match(c))return l}if(!c&&f!==null&&f!==void 0)return l},r=Array.from(t).find(i),s=r?.getAttribute("rel");if(s){let l=document.querySelector("template#"+s);if(!l)throw new Error("Could not find template with id "+s);r=l}return r}destroy(){this.bindings.forEach(t=>{q(t)}),this.bindings=new Map,this.observer.disconnect()}};function Z(e){return new V(e)}var O=new Map;function ae(e,t){O.has(t.path)?O.get(t.path).push(t):O.set(t.path,[t])}function fe(e,t){let n=O.get(t);n=n.filter(i=>i.element==e),O.set(t,n)}function I(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}function U(e,t){let n=t.split("."),i=e,r,s;for(;n.length&&i;){if(r=n.shift(),r==":key")return s;if(r==":value")return i;r==":root"?i=e:(r=decodeURIComponent(r),i=i[r],s=r)}return i}function ue(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;if(n?.length)be.call(this,e);else switch(t.tagName){case"INPUT":ge.call(this,e);break;case"BUTTON":ye.call(this,e);break;case"SELECT":_.call(this,e);break;case"A":Se.call(this,e);break;case"IMG":Ae.call(this,contet);break;case"IFRAME":Te.call(this,e);break;case"META":ve.call(this,e);break;case"TEMPLATE":break;default:E.call(this,e);break}return e}function ce(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return Array.isArray(s)?n?.length?he.call(this,e):console.error("No templates found in",t):console.error("Value is not an array.",t,r,s),e}function pe(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return typeof s!="object"?console.error("Value is not an object.",t,r,s):n?.length?de.call(this,e):console.error("No templates found in",t),e}function he(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute,a=t.querySelectorAll(":scope > ["+l+"-key]"),f=0,p=0;e.list=s;for(let h of a){let y=parseInt(h.getAttribute(l+"-key"));if(y>f)e.index=f,t.insertBefore(this.applyTemplate(e),h);else if(y<f)h.remove();else{let o=Array.from(h.querySelectorAll(`[${l}]`));h.matches(`[${l}]`)&&o.unshift(h);let u=o.find(d=>{let g=d.getAttribute(l);return g.substr(0,5)!==":root"&&g.substr(0,r.length)!==r});if(!u&&h.$bindTemplate){let d=this.findTemplate(n,s[f]);d!=h.$bindTemplate&&(u=!0,d||p++)}u&&(e.index=f,t.replaceChild(this.applyTemplate(e),h))}if(f++,f>=s.length)break}a=t.querySelectorAll(":scope > ["+l+"-key]");let c=a.length+p;if(c>s.length)for(;c>s.length;)t.querySelectorAll(":scope > :not(template)")?.[c-1]?.remove(),c--;else if(c<s.length)for(;c<s.length;)e.index=c,t.appendChild(this.applyTemplate(e)),c++}function de(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;e.list=s;let a=Array.from(t.querySelectorAll(":scope > ["+l+"-key]"));for(let f in e.list){e.index=f;let p=a.shift();if(!p){let h=this.applyTemplate(e);t.appendChild(h);continue}if(p.getAttribute[l+"-key"]!=f){a.unshift(p);let h=t.querySelector(":scope > ["+l+'-key="'+f+'"]');if(h)t.insertBefore(h,p),p=h,a=a.filter(y=>y!=h);else{let y=this.applyTemplate(e);t.insertBefore(y,p);continue}}if(this.findTemplate(n,s[f])!=p.$bindTemplate){let h=this.applyTemplate(e);t.replaceChild(h,p)}}for(;a.length;)a.shift().remove()}function me(e,t){let n=e.parentElement?.closest(`[${t}-list],[${t}-map]`);return n?n.hasAttribute(`${t}-list`)?n.getAttribute(`${t}-list`):n.getAttribute(`${t}-map`):":root"}function be(e){let t=e.element,n=e.templates,i=e.value,r=this.options.attribute,s=t.querySelector(":scope > :not(template)"),l=this.findTemplate(n,i);if(e.parent=me(t,r),s)if(l){if(s?.$bindTemplate!=l){let a=this.applyTemplate(e);t.replaceChild(a,s)}}else t.removeChild(s);else if(l){let a=this.applyTemplate(e);t.appendChild(a)}}function ge(e){let t=e.element,n=e.value;E(e),typeof n>"u"&&(n=""),t.type=="checkbox"||t.type=="radio"?I(t.value,n)?t.checked=!0:t.checked=!1:I(t.value,n)||(t.value=""+n)}function ye(e){let t=e.element,n=e.value;E(e),k(t,n,"value")}function _(e){let t=e.element,n=e.value;if(n===null&&(n=""),typeof n!="object")if(t.multiple){if(Array.isArray(n))for(let i of t.options)n.indexOf(i.value)===!1?i.selected=!1:i.selected=!0}else{let i=t.options.find(r=>I(r.value,n));i&&(i.selected=!0,i.setAttribute("selected",!0))}else n.options&&we(t,n.options),n.selected&&_(Object.asssign({},e,{value:n.selected})),k(t,n,"name","id","selectedIndex","className")}function Y(e,t){t&&(typeof t!="object"?e.options.add(new Option(""+t)):t.text?e.options.add(new Option(t.text,t.value,t.defaultSelected,t.selected)):typeof t.value<"u"&&e.options.add(new Option(""+t.value,t.value,t.defaultSelected,t.selected)))}function we(e,t){if(e.innerHTML="",Array.isArray(t))for(let n of t)Y(e,n);else if(t&&typeof t=="object")for(let n in t)Y(e,{text:t[n],value:n})}function Se(e){let t=e.element,n=e.value;E(e),k(t,n,"title","target","href","name","newwindow","nofollow")}function Ae(e){let t=e.element,n=e.value;E(e),k(t,n,"title","alt","src")}function Te(e){let t=e.element,n=e.value;E(e),k(t,n,"title","src")}function ve(e){let t=e.element,n=e.value;E(e),k(t,n,"content")}function E(e){let t=e.element,n=e.value;(typeof n>"u"||n==null)&&(n="");let i=""+n;if(typeof n!="object"||i.substring(0,8)!="[object "){t.innerHTML=i;return}k(t,n,"innerHTML","title","id","className")}function k(e,t,...n){if(!(!t||typeof t!="object"))for(let i of n)typeof t[i]>"u"||I(e[i],t[i])||(t[i]===null?e[i]="":e[i]=""+t[i])}var W={};D(W,{columns:()=>Be,filter:()=>Ce,model:()=>Ee,paging:()=>Me,scroll:()=>Oe,sort:()=>ke});var K=class{constructor(t){this.state=T(t),this.state.options||(this.state.options={}),this.effects=[{current:t.data}],this.view=T(t.data)}addEffect(t){let n=this.effects[this.effects.length-1];this.view=t.call(this,n),this.effects.push(this.view)}};function Ee(e){return new K(e)}function ke(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,i)=>{let r=this.state.options.sort,s=r.sortBy;if(!r.sortBy)return 0;let l=r.direction=="asc"?1:-1,a=r.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof i?.[s]>"u"?0:l:typeof i?.[s]>"u"||n[s]<i[s]?a:n[s]>i[s]?l:0}},e),w(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current},50)}}function Me(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),w(()=>H(()=>{let n=this.state.options.paging;n.pageSize||(n.pageSize=20),n.max=Math.ceil(this.state.data.length/n.pageSize),n.page=Math.max(1,Math.min(n.max,n.page));let i=(n.page-1)*n.pageSize,r=i+n.pageSize;return t.current.slice(i,r)}),50)}}function Ce(e){if(!e?.name||typeof e.name!="string")throw new Error("filter requires options.name to be a string");if(!e.matches||typeof e.matches!="function")throw new Error("filter requires options.matches to be a function");return function(t){if(this.state.options[e.name])throw new Error("a filter with this name already exists on this model");return this.state.options[e.name]=e,w(()=>this.state.options[e.name].enabled?t.current.filter(this.state.options[e.name].matches.bind(this)):t.current,50)}}function Be(e={}){if(!e||typeof e!="object"||Object.keys(e).length===0)throw new Error("columns requires options to be an object with at least one property");return function(t){return this.state.options.columns=e,w(()=>t.current.map(n=>{let i={};for(let r of Object.keys(this.state.options.columns))this.state.options.columns[r]?.hidden||(i[r]=n[r]);return i}),50)}}function Oe(e){return function(t){this.state.options.scroll=Object.assign({offset:0,rowHeight:26,rowCount:20,itemsPerRow:1,size:t.current.length},e);let n=this.state.options.scroll,i=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return i&&(n.container&&n.container.addEventListener("scroll",r=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),w(()=>{n.size=t.current.length*n.rowHeight,i.style.height=n.size+"px"},50)),w(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let r=Math.min(n.offset,t.current.length-1),s=r+n.rowCount;return s>t.current.length&&(s=t.current.length,r=s-n.rowCount),t.current.slice(r,s)},50)}}window.simply||(window.simply={});Object.assign(window.simply,{bind:Z,flow:W,state:F});var Re=window.simply;})();
 //# sourceMappingURL=simply.flow.min.js.map