sprae 8.0.3 → 8.1.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sprae",
   "description": "DOM microhydration.",
-  "version": "8.0.3",
+  "version": "8.1.1",
   "main": "src/index.js",
   "module": "src/index.js",
   "type": "module",

package/sprae.auto.js

@@ -397,6 +397,7 @@
   // src/state.signals-proxy.js
   var _dispose = Symbol.dispose ||= Symbol("dispose");
   var _signals = Symbol("signals");
+  var _change = Symbol("length");
   var sandbox = {
     Array,
     Object,
@@ -430,7 +431,7 @@
     if (values[_signals] && !parent)
       return values;
     const initSignals = values[_signals];
-    const _len = Array.isArray(values) && a((initSignals || values).length), signals = parent ? Object.create((parent = createState(parent))[_signals]) : Array.isArray(values) ? [] : {}, proto = signals.constructor.prototype;
+    const isArr = Array.isArray(values), _len = a(Object.values(values).length), signals = parent ? Object.create((parent = createState(parent))[_signals]) : Array.isArray(values) ? [] : {}, proto = signals.constructor.prototype;
     if (parent)
       for (let key in parent)
         parent[key];
@@ -439,7 +440,7 @@
         return true;
       },
       get(values2, key) {
-        if (_len)
+        if (isArr)
           if (key === "length")
             return proto[lastProp] ? _len.peek() : _len.value;
           else
@@ -448,13 +449,15 @@
           return proto[key];
         if (key === _signals)
           return signals;
+        if (key === _change)
+          return _len.value;
         const s2 = signals[key] || initSignal(key);
         if (s2)
           return s2.value;
         return sandbox[key];
       },
       set(values2, key, v2) {
-        if (_len) {
+        if (isArr) {
           if (key === "length") {
             n(() => {
               for (let i2 = v2, l2 = signals.length; i2 < l2; i2++)
@@ -464,7 +467,8 @@
             return true;
           }
         }
-        const s2 = signals[key] || initSignal(key, v2) || a();
+        let newProp = false;
+        const s2 = signals[key] || initSignal(key, v2) || (newProp = true, a());
         const cur = s2.peek();
         if (v2 === cur)
           ;
@@ -480,8 +484,12 @@
         } else {
           s2.value = createState(values2[key] = v2);
         }
-        if (_len && key >= _len.peek())
-          _len.value = signals.length = values2.length = Number(key) + 1;
+        if (isArr) {
+          if (key >= _len.peek())
+            _len.value = signals.length = values2.length = Number(key) + 1;
+        } else if (newProp) {
+          _len.value++;
+        }
         return true;
       },
       deleteProperty(values2, key) {
@@ -493,6 +501,8 @@
           _del?.();
         }
         delete values2[key];
+        if (!isArr)
+          _len.value--;
         return true;
       }
     });
@@ -551,61 +561,59 @@
   };
   var _each = Symbol(":each");
   primary["each"] = (tpl, expr, state) => {
-    let each = parseForExpression(expr);
+    const each = parseForExpression(expr);
     if (!each)
       return exprError(new Error(), tpl, expr, ":each");
     const [itemVar, idxVar, itemsExpr] = each;
-    const refName = tpl.getAttribute(":ref") || "";
-    if (refName)
-      tpl.removeAttribute(":ref");
     const holder = tpl[_each] = document.createTextNode("");
     tpl.replaceWith(holder);
     const evaluate = parseExpr(tpl, itemsExpr, ":each");
-    let items, prevl = 0, keys2;
+    let curItems, signals;
     O(() => {
-      let newItems = evaluate(state);
-      if (!newItems)
+      let srcItems = evaluate(state), newItems, keys2;
+      let prevl = curItems?.length || 0;
+      if (!srcItems)
         newItems = [];
-      else if (typeof newItems === "number") {
-        newItems = Array.from({ length: newItems }, (_2, i2) => i2);
-      } else if (Array.isArray(newItems))
-        ;
-      else if (typeof newItems === "object") {
-        keys2 = Object.keys(newItems);
-        newItems = Object.values(newItems);
+      else if (typeof srcItems === "number") {
+        newItems = Array.from({ length: srcItems }, (_2, i2) => i2);
+      } else if (Array.isArray(srcItems))
+        newItems = srcItems;
+      else if (typeof srcItems === "object") {
+        keys2 = Object.keys(srcItems);
+        newItems = Object.values(srcItems);
+        srcItems[_change];
       } else {
-        exprError(Error("Bad items value"), tpl, expr, ":each", newItems);
+        exprError(Error("Bad items value"), tpl, expr, ":each", srcItems);
       }
       s(() => n(() => {
-        if (!items?.[_signals][0]?.peek) {
-          for (let i2 = 0, signals = items?.[_signals]; i2 < prevl; i2++)
+        if (!curItems || !curItems[_signals]) {
+          for (let i2 = 0; i2 < prevl; i2++)
             signals[i2]?._del();
-          items = newItems, items[_signals] ||= {};
+          curItems = newItems, signals = curItems[_signals] || [];
+          if (keys2)
+            prevl = 0;
         } else {
           let newl = newItems.length, i2 = 0;
           for (; i2 < newl; i2++)
-            items[i2] = newItems[i2];
-          items.length = newl;
+            curItems[i2] = newItems[i2];
+          curItems.length = newl;
         }
       }));
       return O(() => {
         let newl = newItems.length;
         if (prevl !== newl)
           s(() => n(() => {
-            const signals = items[_signals];
             for (let i2 = prevl; i2 < newl; i2++) {
-              const el = tpl.cloneNode(true), scope = Object.create(state, {
-                [itemVar]: { get() {
-                  return items[i2];
-                } },
-                [idxVar]: { value: keys2?.[i2] ?? i2 },
-                [refName]: { value: el }
-              });
+              const idx = keys2?.[i2] ?? i2;
+              const el = tpl.cloneNode(true), scope = createState({
+                [itemVar]: signals[i2] ?? curItems[i2],
+                [idxVar]: idx
+              }, state);
               holder.before(el);
               sprae(el, scope);
               const { _del } = signals[i2] ||= {};
               signals[i2]._del = () => {
-                delete items[i2];
+                delete curItems[i2];
                 _del?.();
                 el[_dispose](), el.remove();
               };
@@ -615,9 +623,10 @@
       });
     });
     return () => n(() => {
-      for (let _i of items[_signals])
+      for (let _i of signals)
         _i?._del();
-      items.length = 0;
+      signals.length = 0;
+      curItems.length = 0;
     });
   };
   primary["with"] = (el, expr, rootState) => {

package/sprae.auto.min.js

@@ -1 +1 @@
-(()=>{function t(){throw new Error("Cycle detected")}var e=Symbol.for("preact-signals");function r(){if(l>1)l--;else{for(var t,e=!1;void 0!==a;){var r=a;for(a=void 0,u++;void 0!==r;){var i=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&p(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=i}}if(u=0,l--,e)throw t}}function i(t){if(l>0)return t();l++;try{return t()}finally{r()}}var n=void 0,o=0;function s(t){if(o>0)return t();var e=n;n=void 0,o++;try{return t()}finally{o--,n=e}}var a=void 0,l=0,u=0,f=0;function c(t){if(void 0!==n){var e=t.n;if(void 0===e||e.t!==n)return e={i:0,S:t,p:n.s,n:void 0,t:n,e:void 0,x:void 0,r:e},void 0!==n.s&&(n.s.n=e),n.s=e,t.n=e,32&n.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.n&&(e.n.p=e.p,void 0!==e.p&&(e.p.n=e.n),e.p=n.s,e.n=void 0,n.s.n=e,n.s=e),e}}function h(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function v(t){return new h(t)}function p(t){for(var e=t.s;void 0!==e;e=e.n)if(e.S.i!==e.i||!e.S.h()||e.S.i!==e.i)return!0;return!1}function d(t){for(var e=t.s;void 0!==e;e=e.n){var r=e.S.n;if(void 0!==r&&(e.r=r),e.S.n=e,e.i=-1,void 0===e.n){t.s=e;break}}}function y(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.p;-1===e.i?(e.S.U(e),void 0!==i&&(i.n=e.n),void 0!==e.n&&(e.n.p=i)):r=e,e.S.n=e.r,void 0!==e.r&&(e.r=void 0),e=i}t.s=r}function m(t){h.call(this,void 0),this.x=t,this.s=void 0,this.g=f-1,this.f=4}function b(t){var e=t.u;if(t.u=void 0,"function"==typeof e){l++;var i=n;n=void 0;try{e()}catch(e){throw t.f&=-2,t.f|=8,g(t),e}finally{n=i,r()}}}function g(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,b(t)}function A(t){if(n!==this)throw new Error("Out-of-order effect");y(this),n=t,this.f&=-2,8&this.f&&g(this),r()}function w(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function S(t){var e=new w(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}h.prototype.brand=e,h.prototype.h=function(){return!0},h.prototype.S=function(t){this.t!==t&&void 0===t.e&&(t.x=this.t,void 0!==this.t&&(this.t.e=t),this.t=t)},h.prototype.U=function(t){if(void 0!==this.t){var e=t.e,r=t.x;void 0!==e&&(e.x=r,t.e=void 0),void 0!==r&&(r.e=e,t.x=void 0),t===this.t&&(this.t=r)}},h.prototype.subscribe=function(t){var e=this;return S((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},h.prototype.valueOf=function(){return this.value},h.prototype.toString=function(){return this.value+""},h.prototype.toJSON=function(){return this.value},h.prototype.peek=function(){return this.v},Object.defineProperty(h.prototype,"value",{get:function(){var t=c(this);return void 0!==t&&(t.i=this.i),this.v},set:function(e){if(n instanceof m&&function(){throw new Error("Computed cannot have side-effects")}(),e!==this.v){u>100&&t(),this.v=e,this.i++,f++,l++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{r()}}}}),(m.prototype=new h).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===f)return!0;if(this.g=f,this.f|=1,this.i>0&&!p(this))return this.f&=-2,!0;var t=n;try{d(this),n=this;var e=this.x();(16&this.f||this.v!==e||0===this.i)&&(this.v=e,this.f&=-17,this.i++)}catch(t){this.v=t,this.f|=16,this.i++}return n=t,y(this),this.f&=-2,!0},m.prototype.S=function(t){if(void 0===this.t){this.f|=36;for(var e=this.s;void 0!==e;e=e.n)e.S.S(e)}h.prototype.S.call(this,t)},m.prototype.U=function(t){if(void 0!==this.t&&(h.prototype.U.call(this,t),void 0===this.t)){this.f&=-33;for(var e=this.s;void 0!==e;e=e.n)e.S.U(e)}},m.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},m.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(m.prototype,"value",{get:function(){1&this.f&&t();var e=c(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),w.prototype.c=function(){var t=this.S();try{if(8&this.f)return;if(void 0===this.x)return;var e=this.x();"function"==typeof e&&(this.u=e)}finally{t()}},w.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,b(this),d(this),l++;var e=n;return n=this,A.bind(this,e)},w.prototype.N=function(){2&this.f||(this.f|=2,this.o=a,a=this)},w.prototype.d=function(){this.f|=8,1&this.f||g(this)};var k,x=Symbol.dispose||=Symbol("dispose"),O=Symbol("signals"),N={Array:Array,Object:Object,Number:Number,String:String,Boolean:Boolean,Date:Date,console:console,window:window,document:document,history:history,navigator:navigator,location:location,screen:screen,localStorage:localStorage,sessionStorage:sessionStorage,alert:alert,prompt:prompt,confirm:confirm,fetch:fetch,performance:performance,setTimeout:setTimeout,setInterval:setInterval,requestAnimationFrame:requestAnimationFrame};function j(t,e){if(t?.constructor!==Object&&!Array.isArray(t))return t;if(t[O]&&!e)return t;const r=t[O],n=Array.isArray(t)&&v((r||t).length),o=e?Object.create((e=j(e))[O]):Array.isArray(t)?[]:{},a=o.constructor.prototype;if(e)for(let t in e)e[t];const l=new Proxy(t,{has:()=>!0,get(t,e){if(n){if("length"===e)return a[k]?n.peek():n.value;k=e}if(a[e])return a[e];if(e===O)return o;const r=o[e]||u(e);return r?r.value:N[e]},set(t,e,r){if(n&&"length"===e)return i((()=>{for(let t=r,e=o.length;t<e;t++)delete l[t];n.value=o.length=t.length=r})),!0;const a=o[e]||u(e)||v(),f=a.peek();return r===f||(a._set?a._set(r):Array.isArray(r)&&Array.isArray(f)?s((()=>i((()=>{let i=0,n=r.length,o=t[e];for(;i<n;i++)f[i]=o[i]=r[i];f.length=n})))):a.value=j(t[e]=r)),n&&e>=n.peek()&&(n.value=o.length=t.length=Number(e)+1),!0},deleteProperty(t,e){const r=o[e];if(r){const{_del:t}=r;delete r._del,delete o[e],t?.()}return delete t[e],!0}});for(let e in t)o[e]=r?.[e]??u(e);function u(e){if(t.hasOwnProperty(e)){const i=Object.getOwnPropertyDescriptor(t,e);return i?.get?((o[e]=(r=i.get.bind(l),new m(r)))._set=i.set?.bind(l),o[e]):o[e]=i.value?.peek?i.value:v(j(i.value))}var r}return l}var E=Promise.prototype.then.bind(Promise.resolve()),_={},$={};_.if=(t,e,r)=>{let i=document.createTextNode(""),n=[I(t,e,":if")],o=[t],s=t;for(;(s=t.nextElementSibling)&&s.hasAttribute(":else");)s.removeAttribute(":else"),(e=s.getAttribute(":if"))?(s.removeAttribute(":if"),s.remove(),o.push(s),n.push(I(t,e,":else :if"))):(s.remove(),o.push(s),n.push((()=>1)));t.replaceWith(s=i);const a=S((()=>{let t=n.findIndex((t=>t(r)));o[t]!=s&&((s[P]||s).replaceWith(s=o[t]||i),M(s,r))}));return()=>{for(const t of o)t[x]?.();a()}};var P=Symbol(":each");_.each=(t,e,r)=>{let n=function(t){let e=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=t.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!r)return;let i=r[2].trim(),n=r[1].replace(/^\s*\(|\)\s*$/g,"").trim(),o=n.match(e);return o?[n.replace(e,"").trim(),o[1].trim(),i]:[n,"",i]}(e);if(!n)return L(new Error,t,e,":each");const[o,a,l]=n,u=t.getAttribute(":ref")||"";u&&t.removeAttribute(":ref");const f=t[P]=document.createTextNode("");t.replaceWith(f);const c=I(t,l,":each");let h,v,p=0;return S((()=>{let n=c(r);return n?"number"==typeof n?n=Array.from({length:n},((t,e)=>e)):Array.isArray(n)||("object"==typeof n?(v=Object.keys(n),n=Object.values(n)):L(Error("Bad items value"),t,e,":each")):n=[],s((()=>i((()=>{if(h?.[O][0]?.peek){let t=n.length,e=0;for(;e<t;e++)h[e]=n[e];h.length=t}else{for(let t=0,e=h?.[O];t<p;t++)e[t]?._del();h=n,h[O]||={}}})))),S((()=>{let e=n.length;p!==e&&s((()=>i((()=>{const i=h[O];for(let n=p;n<e;n++){const e=t.cloneNode(!0),s=Object.create(r,{[o]:{get:()=>h[n]},[a]:{value:v?.[n]??n},[u]:{value:e}});f.before(e),M(e,s);const{_del:l}=i[n]||={};i[n]._del=()=>{delete h[n],l?.(),e[x](),e.remove()}}p=e}))))}))})),()=>i((()=>{for(let t of h[O])t?._del();h.length=0}))},_.with=(t,e,r)=>(M(t,j(I(t,e,":with")(r),r)),t[x]),_.ref=(t,e,r)=>{r[e]=t},$.render=(t,e,r)=>{let i=I(t,e,":render")(r);i||L(new Error("Template not found"),t,e,":render");let n=i.content.cloneNode(!0);return t.replaceChildren(n),M(t,r),t[x]},$.id=(t,e,r)=>{let i=I(t,e,":id");return S((()=>{return e=i(r),t.id=e||0===e?e:"";var e}))},$.class=(t,e,r)=>{let i=I(t,e,":class"),n=t.getAttribute("class");return S((()=>{let e=i(r),o=[n];e&&("string"==typeof e?o.push(e):Array.isArray(e)?o.push(...e):o.push(...Object.entries(e).map((([t,e])=>e?t:"")))),(o=o.filter(Boolean).join(" "))?t.setAttribute("class",o):t.removeAttribute("class")}))},$.style=(t,e,r)=>{let i=I(t,e,":style"),n=t.getAttribute("style")||"";return n.endsWith(";")||(n+="; "),S((()=>{let e=i(r);"string"==typeof e?t.setAttribute("style",n+e):s((()=>{t.setAttribute("style",n);for(let r in e)"symbol"!=typeof e[r]&&t.style.setProperty(r,e[r])}))}))},$.text=(t,e,r)=>{let i=I(t,e,":text");return S((()=>{let e=i(r);t.textContent=null==e?"":e}))},$[""]=(t,e,r)=>{let i=I(t,e,":");if(i)return S((()=>{let e=i(r);for(let r in e)K(t,r.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase())),e[r])}))},$.value=(t,e,r)=>{let i,n,o=I(t,e,":value"),s="text"===t.type||""===t.type?e=>t.setAttribute("value",t.value=null==e?"":e):"TEXTAREA"===t.tagName||"text"===t.type||""===t.type?e=>(i=t.selectionStart,n=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),i&&t.setSelectionRange(i,n)):"checkbox"===t.type?e=>(t.value=e?"on":"",K(t,"checked",e)):"select-one"===t.type?e=>{for(let e in t.options)e.removeAttribute("selected");t.value=e,t.selectedOptions[0]?.setAttribute("selected","")}:e=>t.value=e;return S((()=>{s(o(r))}))};var T=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),o=I(t,e,":"+i);if(o){if(n){let e,i=S((()=>{e&&(e(),e=null);let i=o(r);i&&(e=C(t,n,i))}));return()=>(e?.(),i())}return S((()=>{K(t,i,o(r))}))}},C=(t,e,r)=>{if(!r)return;const i={evt:"",target:t,test:()=>!0};i.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,r="")=>(i.test=W[e]?.(i,...r.split("-"))||i.test,"")));const{evt:n,target:o,test:s,defer:a,stop:l,prevent:u,...f}=i;a&&(r=a(r));const c=t=>s(t)&&(l&&t.stopPropagation(),u&&t.preventDefault(),r.call(o,t));return o.addEventListener(n,c,f),()=>o.removeEventListener(n,c,f)},W={prevent(t){t.prevent=!0},stop(t){t.stop=!0},once(t){t.once=!0},passive(t){t.passive=!0},capture(t){t.capture=!0},window(t){t.target=window},document(t){t.target=document},throttle(t,e){t.defer=t=>U(t,e?Number(e)||0:108)},debounce(t,e){t.defer=t=>B(t,e?Number(e)||0:108)},outside:t=>e=>{let r=t.target;return!(r.contains(e.target)||!1===e.target.isConnected||r.offsetWidth<1&&r.offsetHeight<1)},self:t=>e=>e.target===t.target,ctrl:(t,...e)=>t=>D.ctrl(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),shift:(t,...e)=>t=>D.shift(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),alt:(t,...e)=>t=>D.alt(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),meta:(t,...e)=>t=>D.meta(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),arrow:t=>D.arrow,enter:t=>D.enter,escape:t=>D.escape,tab:t=>D.tab,space:t=>D.space,backspace:t=>D.backspace,delete:t=>D.delete,digit:t=>D.digit,letter:t=>D.letter,character:t=>D.character},D={ctrl:t=>t.ctrlKey||"Control"===t.key||"Ctrl"===t.key,shift:t=>t.shiftKey||"Shift"===t.key,alt:t=>t.altKey||"Alt"===t.key,meta:t=>t.metaKey||"Meta"===t.key||"Command"===t.key,arrow:t=>t.key.startsWith("Arrow"),enter:t=>"Enter"===t.key,escape:t=>t.key.startsWith("Esc"),tab:t=>"Tab"===t.key,space:t=>" "===t.key||"Space"===t.key||" "===t.key,backspace:t=>"Backspace"===t.key,delete:t=>"Delete"===t.key,digit:t=>/^\d$/.test(t.key),letter:t=>/^[a-zA-Z]$/.test(t.key),character:t=>/^\S$/.test(t.key)},U=(t,e)=>{let r,i,n=o=>{r=!0,setTimeout((()=>{if(r=!1,i)return i=!1,n(o),t(o)}),e)};return e=>r?i=!0:(n(e),t(e))},B=(t,e)=>{let r;return i=>{clearTimeout(r),r=setTimeout((()=>{r=null,t(i)}),e)}},K=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},F={};function I(t,e,r){let i=F[e];if(!i)try{i=F[e]=new Function("__scope",`with (__scope) { let __; return ${e.trim()} };`)}catch(i){return L(i,t,e,r)}return n=>{let o;try{o=i.call(t,n)}catch(i){return L(i,t,e,r)}return o}}function L(t,e,r,i){Object.assign(t,{element:e,expression:r}),console.warn(`∴ ${t.message}\n\n${i}=${r?`"${r}"\n\n`:""}`,e),E((()=>{throw t}),0)}M.globals=N;var q=new WeakMap;function M(t,e){if(!t.children)return;if(q.has(t))return i((()=>Object.assign(q.get(t),e)));const r=j(e||{}),n=[],o=(t,e=t.parentNode)=>{for(let i in _){let o=":"+i;if(t.hasAttribute?.(o)){let s=t.getAttribute(o);if(t.removeAttribute(o),n.push(_[i](t,s,r,i)),q.has(t))return;if(t.parentNode!==e)return!1}}if(t.attributes)for(let e=0;e<t.attributes.length;){let i=t.attributes[e],o=i.name[0];if(":"===o||"@"===o){t.removeAttribute(i.name);let e="@"===o?`${i.value.includes("await")?"async":""} event=>{${i.value}}`:i.value,s=i.name.slice(1).split(o);for(let i of s){"@"===o&&(i="on"+i);let s=$[i]||T;n.push(s(t,e,r,i))}}else e++}for(let e,r=0;e=t.children[r];r++)!1===o(e,t)&&r--};return o(t),q.has(t)||(q.set(t,r),n.length&&Object.defineProperty(t,x,{value:()=>{for(;n.length;)n.shift()?.();q.delete(t)}})),r}document.currentScript&&M(document.documentElement)})();
+(()=>{function t(){throw new Error("Cycle detected")}var e=Symbol.for("preact-signals");function r(){if(l>1)l--;else{for(var t,e=!1;void 0!==a;){var r=a;for(a=void 0,u++;void 0!==r;){var i=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&p(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=i}}if(u=0,l--,e)throw t}}function i(t){if(l>0)return t();l++;try{return t()}finally{r()}}var n=void 0,o=0;function s(t){if(o>0)return t();var e=n;n=void 0,o++;try{return t()}finally{o--,n=e}}var a=void 0,l=0,u=0,f=0;function c(t){if(void 0!==n){var e=t.n;if(void 0===e||e.t!==n)return e={i:0,S:t,p:n.s,n:void 0,t:n,e:void 0,x:void 0,r:e},void 0!==n.s&&(n.s.n=e),n.s=e,t.n=e,32&n.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.n&&(e.n.p=e.p,void 0!==e.p&&(e.p.n=e.n),e.p=n.s,e.n=void 0,n.s.n=e,n.s=e),e}}function h(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function v(t){return new h(t)}function p(t){for(var e=t.s;void 0!==e;e=e.n)if(e.S.i!==e.i||!e.S.h()||e.S.i!==e.i)return!0;return!1}function d(t){for(var e=t.s;void 0!==e;e=e.n){var r=e.S.n;if(void 0!==r&&(e.r=r),e.S.n=e,e.i=-1,void 0===e.n){t.s=e;break}}}function y(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.p;-1===e.i?(e.S.U(e),void 0!==i&&(i.n=e.n),void 0!==e.n&&(e.n.p=i)):r=e,e.S.n=e.r,void 0!==e.r&&(e.r=void 0),e=i}t.s=r}function m(t){h.call(this,void 0),this.x=t,this.s=void 0,this.g=f-1,this.f=4}function b(t){var e=t.u;if(t.u=void 0,"function"==typeof e){l++;var i=n;n=void 0;try{e()}catch(e){throw t.f&=-2,t.f|=8,g(t),e}finally{n=i,r()}}}function g(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,b(t)}function A(t){if(n!==this)throw new Error("Out-of-order effect");y(this),n=t,this.f&=-2,8&this.f&&g(this),r()}function w(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function S(t){var e=new w(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}h.prototype.brand=e,h.prototype.h=function(){return!0},h.prototype.S=function(t){this.t!==t&&void 0===t.e&&(t.x=this.t,void 0!==this.t&&(this.t.e=t),this.t=t)},h.prototype.U=function(t){if(void 0!==this.t){var e=t.e,r=t.x;void 0!==e&&(e.x=r,t.e=void 0),void 0!==r&&(r.e=e,t.x=void 0),t===this.t&&(this.t=r)}},h.prototype.subscribe=function(t){var e=this;return S((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},h.prototype.valueOf=function(){return this.value},h.prototype.toString=function(){return this.value+""},h.prototype.toJSON=function(){return this.value},h.prototype.peek=function(){return this.v},Object.defineProperty(h.prototype,"value",{get:function(){var t=c(this);return void 0!==t&&(t.i=this.i),this.v},set:function(e){if(n instanceof m&&function(){throw new Error("Computed cannot have side-effects")}(),e!==this.v){u>100&&t(),this.v=e,this.i++,f++,l++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{r()}}}}),(m.prototype=new h).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===f)return!0;if(this.g=f,this.f|=1,this.i>0&&!p(this))return this.f&=-2,!0;var t=n;try{d(this),n=this;var e=this.x();(16&this.f||this.v!==e||0===this.i)&&(this.v=e,this.f&=-17,this.i++)}catch(t){this.v=t,this.f|=16,this.i++}return n=t,y(this),this.f&=-2,!0},m.prototype.S=function(t){if(void 0===this.t){this.f|=36;for(var e=this.s;void 0!==e;e=e.n)e.S.S(e)}h.prototype.S.call(this,t)},m.prototype.U=function(t){if(void 0!==this.t&&(h.prototype.U.call(this,t),void 0===this.t)){this.f&=-33;for(var e=this.s;void 0!==e;e=e.n)e.S.U(e)}},m.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},m.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(m.prototype,"value",{get:function(){1&this.f&&t();var e=c(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),w.prototype.c=function(){var t=this.S();try{if(8&this.f)return;if(void 0===this.x)return;var e=this.x();"function"==typeof e&&(this.u=e)}finally{t()}},w.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,b(this),d(this),l++;var e=n;return n=this,A.bind(this,e)},w.prototype.N=function(){2&this.f||(this.f|=2,this.o=a,a=this)},w.prototype.d=function(){this.f|=8,1&this.f||g(this)};var k,x=Symbol.dispose||=Symbol("dispose"),O=Symbol("signals"),N=Symbol("length"),j={Array:Array,Object:Object,Number:Number,String:String,Boolean:Boolean,Date:Date,console:console,window:window,document:document,history:history,navigator:navigator,location:location,screen:screen,localStorage:localStorage,sessionStorage:sessionStorage,alert:alert,prompt:prompt,confirm:confirm,fetch:fetch,performance:performance,setTimeout:setTimeout,setInterval:setInterval,requestAnimationFrame:requestAnimationFrame};function E(t,e){if(t?.constructor!==Object&&!Array.isArray(t))return t;if(t[O]&&!e)return t;const r=t[O],n=Array.isArray(t),o=v(Object.values(t).length),a=e?Object.create((e=E(e))[O]):Array.isArray(t)?[]:{},l=a.constructor.prototype;if(e)for(let t in e)e[t];const u=new Proxy(t,{has:()=>!0,get(t,e){if(n){if("length"===e)return l[k]?o.peek():o.value;k=e}if(l[e])return l[e];if(e===O)return a;if(e===N)return o.value;const r=a[e]||f(e);return r?r.value:j[e]},set(t,e,r){if(n&&"length"===e)return i((()=>{for(let t=r,e=a.length;t<e;t++)delete u[t];o.value=a.length=t.length=r})),!0;let l=!1;const c=a[e]||f(e)||(l=!0,v()),h=c.peek();return r===h||(c._set?c._set(r):Array.isArray(r)&&Array.isArray(h)?s((()=>i((()=>{let i=0,n=r.length,o=t[e];for(;i<n;i++)h[i]=o[i]=r[i];h.length=n})))):c.value=E(t[e]=r)),n?e>=o.peek()&&(o.value=a.length=t.length=Number(e)+1):l&&o.value++,!0},deleteProperty(t,e){const r=a[e];if(r){const{_del:t}=r;delete r._del,delete a[e],t?.()}return delete t[e],n||o.value--,!0}});for(let e in t)a[e]=r?.[e]??f(e);function f(e){if(t.hasOwnProperty(e)){const i=Object.getOwnPropertyDescriptor(t,e);return i?.get?((a[e]=(r=i.get.bind(u),new m(r)))._set=i.set?.bind(u),a[e]):a[e]=i.value?.peek?i.value:v(E(i.value))}var r}return u}var _=Promise.prototype.then.bind(Promise.resolve()),$={},P={};$.if=(t,e,r)=>{let i=document.createTextNode(""),n=[L(t,e,":if")],o=[t],s=t;for(;(s=t.nextElementSibling)&&s.hasAttribute(":else");)s.removeAttribute(":else"),(e=s.getAttribute(":if"))?(s.removeAttribute(":if"),s.remove(),o.push(s),n.push(L(t,e,":else :if"))):(s.remove(),o.push(s),n.push((()=>1)));t.replaceWith(s=i);const a=S((()=>{let t=n.findIndex((t=>t(r)));o[t]!=s&&((s[T]||s).replaceWith(s=o[t]||i),R(s,r))}));return()=>{for(const t of o)t[x]?.();a()}};var T=Symbol(":each");$.each=(t,e,r)=>{const n=function(t){let e=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=t.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!r)return;let i=r[2].trim(),n=r[1].replace(/^\s*\(|\)\s*$/g,"").trim(),o=n.match(e);return o?[n.replace(e,"").trim(),o[1].trim(),i]:[n,"",i]}(e);if(!n)return q(new Error,t,e,":each");const[o,a,l]=n,u=t[T]=document.createTextNode("");t.replaceWith(u);const f=L(t,l,":each");let c,h;return S((()=>{let n,l,v=f(r),p=c?.length||0;return v?"number"==typeof v?n=Array.from({length:v},((t,e)=>e)):Array.isArray(v)?n=v:"object"==typeof v?(l=Object.keys(v),n=Object.values(v),v[N]):q(Error("Bad items value"),t,e,":each"):n=[],s((()=>i((()=>{if(c&&c[O]){let t=n.length,e=0;for(;e<t;e++)c[e]=n[e];c.length=t}else{for(let t=0;t<p;t++)h[t]?._del();c=n,h=c[O]||[],l&&(p=0)}})))),S((()=>{let e=n.length;p!==e&&s((()=>i((()=>{for(let i=p;i<e;i++){const e=l?.[i]??i,n=t.cloneNode(!0),s=E({[o]:h[i]??c[i],[a]:e},r);u.before(n),R(n,s);const{_del:f}=h[i]||={};h[i]._del=()=>{delete c[i],f?.(),n[x](),n.remove()}}p=e}))))}))})),()=>i((()=>{for(let t of h)t?._del();h.length=0,c.length=0}))},$.with=(t,e,r)=>(R(t,E(L(t,e,":with")(r),r)),t[x]),$.ref=(t,e,r)=>{r[e]=t},P.render=(t,e,r)=>{let i=L(t,e,":render")(r);i||q(new Error("Template not found"),t,e,":render");let n=i.content.cloneNode(!0);return t.replaceChildren(n),R(t,r),t[x]},P.id=(t,e,r)=>{let i=L(t,e,":id");return S((()=>{return e=i(r),t.id=e||0===e?e:"";var e}))},P.class=(t,e,r)=>{let i=L(t,e,":class"),n=t.getAttribute("class");return S((()=>{let e=i(r),o=[n];e&&("string"==typeof e?o.push(e):Array.isArray(e)?o.push(...e):o.push(...Object.entries(e).map((([t,e])=>e?t:"")))),(o=o.filter(Boolean).join(" "))?t.setAttribute("class",o):t.removeAttribute("class")}))},P.style=(t,e,r)=>{let i=L(t,e,":style"),n=t.getAttribute("style")||"";return n.endsWith(";")||(n+="; "),S((()=>{let e=i(r);"string"==typeof e?t.setAttribute("style",n+e):s((()=>{t.setAttribute("style",n);for(let r in e)"symbol"!=typeof e[r]&&t.style.setProperty(r,e[r])}))}))},P.text=(t,e,r)=>{let i=L(t,e,":text");return S((()=>{let e=i(r);t.textContent=null==e?"":e}))},P[""]=(t,e,r)=>{let i=L(t,e,":");if(i)return S((()=>{let e=i(r);for(let r in e)F(t,r.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase())),e[r])}))},P.value=(t,e,r)=>{let i,n,o=L(t,e,":value"),s="text"===t.type||""===t.type?e=>t.setAttribute("value",t.value=null==e?"":e):"TEXTAREA"===t.tagName||"text"===t.type||""===t.type?e=>(i=t.selectionStart,n=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),i&&t.setSelectionRange(i,n)):"checkbox"===t.type?e=>(t.value=e?"on":"",F(t,"checked",e)):"select-one"===t.type?e=>{for(let e in t.options)e.removeAttribute("selected");t.value=e,t.selectedOptions[0]?.setAttribute("selected","")}:e=>t.value=e;return S((()=>{s(o(r))}))};var C=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),o=L(t,e,":"+i);if(o){if(n){let e,i=S((()=>{e&&(e(),e=null);let i=o(r);i&&(e=W(t,n,i))}));return()=>(e?.(),i())}return S((()=>{F(t,i,o(r))}))}},W=(t,e,r)=>{if(!r)return;const i={evt:"",target:t,test:()=>!0};i.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,r="")=>(i.test=D[e]?.(i,...r.split("-"))||i.test,"")));const{evt:n,target:o,test:s,defer:a,stop:l,prevent:u,...f}=i;a&&(r=a(r));const c=t=>s(t)&&(l&&t.stopPropagation(),u&&t.preventDefault(),r.call(o,t));return o.addEventListener(n,c,f),()=>o.removeEventListener(n,c,f)},D={prevent(t){t.prevent=!0},stop(t){t.stop=!0},once(t){t.once=!0},passive(t){t.passive=!0},capture(t){t.capture=!0},window(t){t.target=window},document(t){t.target=document},throttle(t,e){t.defer=t=>B(t,e?Number(e)||0:108)},debounce(t,e){t.defer=t=>K(t,e?Number(e)||0:108)},outside:t=>e=>{let r=t.target;return!(r.contains(e.target)||!1===e.target.isConnected||r.offsetWidth<1&&r.offsetHeight<1)},self:t=>e=>e.target===t.target,ctrl:(t,...e)=>t=>U.ctrl(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),shift:(t,...e)=>t=>U.shift(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),alt:(t,...e)=>t=>U.alt(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),meta:(t,...e)=>t=>U.meta(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),arrow:t=>U.arrow,enter:t=>U.enter,escape:t=>U.escape,tab:t=>U.tab,space:t=>U.space,backspace:t=>U.backspace,delete:t=>U.delete,digit:t=>U.digit,letter:t=>U.letter,character:t=>U.character},U={ctrl:t=>t.ctrlKey||"Control"===t.key||"Ctrl"===t.key,shift:t=>t.shiftKey||"Shift"===t.key,alt:t=>t.altKey||"Alt"===t.key,meta:t=>t.metaKey||"Meta"===t.key||"Command"===t.key,arrow:t=>t.key.startsWith("Arrow"),enter:t=>"Enter"===t.key,escape:t=>t.key.startsWith("Esc"),tab:t=>"Tab"===t.key,space:t=>" "===t.key||"Space"===t.key||" "===t.key,backspace:t=>"Backspace"===t.key,delete:t=>"Delete"===t.key,digit:t=>/^\d$/.test(t.key),letter:t=>/^[a-zA-Z]$/.test(t.key),character:t=>/^\S$/.test(t.key)},B=(t,e)=>{let r,i,n=o=>{r=!0,setTimeout((()=>{if(r=!1,i)return i=!1,n(o),t(o)}),e)};return e=>r?i=!0:(n(e),t(e))},K=(t,e)=>{let r;return i=>{clearTimeout(r),r=setTimeout((()=>{r=null,t(i)}),e)}},F=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},I={};function L(t,e,r){let i=I[e];if(!i)try{i=I[e]=new Function("__scope",`with (__scope) { let __; return ${e.trim()} };`)}catch(i){return q(i,t,e,r)}return n=>{let o;try{o=i.call(t,n)}catch(i){return q(i,t,e,r)}return o}}function q(t,e,r,i){Object.assign(t,{element:e,expression:r}),console.warn(`∴ ${t.message}\n\n${i}=${r?`"${r}"\n\n`:""}`,e),_((()=>{throw t}),0)}R.globals=j;var M=new WeakMap;function R(t,e){if(!t.children)return;if(M.has(t))return i((()=>Object.assign(M.get(t),e)));const r=E(e||{}),n=[],o=(t,e=t.parentNode)=>{for(let i in $){let o=":"+i;if(t.hasAttribute?.(o)){let s=t.getAttribute(o);if(t.removeAttribute(o),n.push($[i](t,s,r,i)),M.has(t))return;if(t.parentNode!==e)return!1}}if(t.attributes)for(let e=0;e<t.attributes.length;){let i=t.attributes[e],o=i.name[0];if(":"===o||"@"===o){t.removeAttribute(i.name);let e="@"===o?`${i.value.includes("await")?"async":""} event=>{${i.value}}`:i.value,s=i.name.slice(1).split(o);for(let i of s){"@"===o&&(i="on"+i);let s=P[i]||C;n.push(s(t,e,r,i))}}else e++}for(let e,r=0;e=t.children[r];r++)!1===o(e,t)&&r--};return o(t),M.has(t)||(M.set(t,r),n.length&&Object.defineProperty(t,x,{value:()=>{for(;n.length;)n.shift()?.();M.delete(t)}})),r}document.currentScript&&R(document.documentElement)})();

package/sprae.js

@@ -396,6 +396,7 @@ function O(i2) {
 // src/state.signals-proxy.js
 var _dispose = Symbol.dispose ||= Symbol("dispose");
 var _signals = Symbol("signals");
+var _change = Symbol("length");
 var sandbox = {
   Array,
   Object,
@@ -429,7 +430,7 @@ function createState(values, parent) {
   if (values[_signals] && !parent)
     return values;
   const initSignals = values[_signals];
-  const _len = Array.isArray(values) && a((initSignals || values).length), signals = parent ? Object.create((parent = createState(parent))[_signals]) : Array.isArray(values) ? [] : {}, proto = signals.constructor.prototype;
+  const isArr = Array.isArray(values), _len = a(Object.values(values).length), signals = parent ? Object.create((parent = createState(parent))[_signals]) : Array.isArray(values) ? [] : {}, proto = signals.constructor.prototype;
   if (parent)
     for (let key in parent)
       parent[key];
@@ -438,7 +439,7 @@ function createState(values, parent) {
       return true;
     },
     get(values2, key) {
-      if (_len)
+      if (isArr)
         if (key === "length")
           return proto[lastProp] ? _len.peek() : _len.value;
         else
@@ -447,13 +448,15 @@ function createState(values, parent) {
         return proto[key];
       if (key === _signals)
         return signals;
+      if (key === _change)
+        return _len.value;
       const s2 = signals[key] || initSignal(key);
       if (s2)
         return s2.value;
       return sandbox[key];
     },
     set(values2, key, v2) {
-      if (_len) {
+      if (isArr) {
         if (key === "length") {
           n(() => {
             for (let i2 = v2, l2 = signals.length; i2 < l2; i2++)
@@ -463,7 +466,8 @@ function createState(values, parent) {
           return true;
         }
       }
-      const s2 = signals[key] || initSignal(key, v2) || a();
+      let newProp = false;
+      const s2 = signals[key] || initSignal(key, v2) || (newProp = true, a());
       const cur = s2.peek();
       if (v2 === cur)
         ;
@@ -479,8 +483,12 @@ function createState(values, parent) {
       } else {
         s2.value = createState(values2[key] = v2);
       }
-      if (_len && key >= _len.peek())
-        _len.value = signals.length = values2.length = Number(key) + 1;
+      if (isArr) {
+        if (key >= _len.peek())
+          _len.value = signals.length = values2.length = Number(key) + 1;
+      } else if (newProp) {
+        _len.value++;
+      }
       return true;
     },
     deleteProperty(values2, key) {
@@ -492,6 +500,8 @@ function createState(values, parent) {
         _del?.();
       }
       delete values2[key];
+      if (!isArr)
+        _len.value--;
       return true;
     }
   });
@@ -550,61 +560,59 @@ primary["if"] = (el, expr, state) => {
 };
 var _each = Symbol(":each");
 primary["each"] = (tpl, expr, state) => {
-  let each = parseForExpression(expr);
+  const each = parseForExpression(expr);
   if (!each)
     return exprError(new Error(), tpl, expr, ":each");
   const [itemVar, idxVar, itemsExpr] = each;
-  const refName = tpl.getAttribute(":ref") || "";
-  if (refName)
-    tpl.removeAttribute(":ref");
   const holder = tpl[_each] = document.createTextNode("");
   tpl.replaceWith(holder);
   const evaluate = parseExpr(tpl, itemsExpr, ":each");
-  let items, prevl = 0, keys2;
+  let curItems, signals;
   O(() => {
-    let newItems = evaluate(state);
-    if (!newItems)
+    let srcItems = evaluate(state), newItems, keys2;
+    let prevl = curItems?.length || 0;
+    if (!srcItems)
       newItems = [];
-    else if (typeof newItems === "number") {
-      newItems = Array.from({ length: newItems }, (_2, i2) => i2);
-    } else if (Array.isArray(newItems))
-      ;
-    else if (typeof newItems === "object") {
-      keys2 = Object.keys(newItems);
-      newItems = Object.values(newItems);
+    else if (typeof srcItems === "number") {
+      newItems = Array.from({ length: srcItems }, (_2, i2) => i2);
+    } else if (Array.isArray(srcItems))
+      newItems = srcItems;
+    else if (typeof srcItems === "object") {
+      keys2 = Object.keys(srcItems);
+      newItems = Object.values(srcItems);
+      srcItems[_change];
     } else {
-      exprError(Error("Bad items value"), tpl, expr, ":each", newItems);
+      exprError(Error("Bad items value"), tpl, expr, ":each", srcItems);
     }
     s(() => n(() => {
-      if (!items?.[_signals][0]?.peek) {
-        for (let i2 = 0, signals = items?.[_signals]; i2 < prevl; i2++)
+      if (!curItems || !curItems[_signals]) {
+        for (let i2 = 0; i2 < prevl; i2++)
           signals[i2]?._del();
-        items = newItems, items[_signals] ||= {};
+        curItems = newItems, signals = curItems[_signals] || [];
+        if (keys2)
+          prevl = 0;
       } else {
         let newl = newItems.length, i2 = 0;
         for (; i2 < newl; i2++)
-          items[i2] = newItems[i2];
-        items.length = newl;
+          curItems[i2] = newItems[i2];
+        curItems.length = newl;
       }
     }));
     return O(() => {
       let newl = newItems.length;
       if (prevl !== newl)
         s(() => n(() => {
-          const signals = items[_signals];
           for (let i2 = prevl; i2 < newl; i2++) {
-            const el = tpl.cloneNode(true), scope = Object.create(state, {
-              [itemVar]: { get() {
-                return items[i2];
-              } },
-              [idxVar]: { value: keys2?.[i2] ?? i2 },
-              [refName]: { value: el }
-            });
+            const idx = keys2?.[i2] ?? i2;
+            const el = tpl.cloneNode(true), scope = createState({
+              [itemVar]: signals[i2] ?? curItems[i2],
+              [idxVar]: idx
+            }, state);
             holder.before(el);
             sprae(el, scope);
             const { _del } = signals[i2] ||= {};
             signals[i2]._del = () => {
-              delete items[i2];
+              delete curItems[i2];
               _del?.();
               el[_dispose](), el.remove();
             };
@@ -614,9 +622,10 @@ primary["each"] = (tpl, expr, state) => {
     });
   });
   return () => n(() => {
-    for (let _i of items[_signals])
+    for (let _i of signals)
       _i?._del();
-    items.length = 0;
+    signals.length = 0;
+    curItems.length = 0;
   });
 };
 primary["with"] = (el, expr, rootState) => {

package/sprae.min.js

@@ -1 +1 @@
-function t(){throw new Error("Cycle detected")}var e=Symbol.for("preact-signals");function r(){if(l>1)l--;else{for(var t,e=!1;void 0!==a;){var r=a;for(a=void 0,u++;void 0!==r;){var i=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&p(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=i}}if(u=0,l--,e)throw t}}function i(t){if(l>0)return t();l++;try{return t()}finally{r()}}var n=void 0,o=0;function s(t){if(o>0)return t();var e=n;n=void 0,o++;try{return t()}finally{o--,n=e}}var a=void 0,l=0,u=0,f=0;function c(t){if(void 0!==n){var e=t.n;if(void 0===e||e.t!==n)return e={i:0,S:t,p:n.s,n:void 0,t:n,e:void 0,x:void 0,r:e},void 0!==n.s&&(n.s.n=e),n.s=e,t.n=e,32&n.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.n&&(e.n.p=e.p,void 0!==e.p&&(e.p.n=e.n),e.p=n.s,e.n=void 0,n.s.n=e,n.s=e),e}}function h(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function v(t){return new h(t)}function p(t){for(var e=t.s;void 0!==e;e=e.n)if(e.S.i!==e.i||!e.S.h()||e.S.i!==e.i)return!0;return!1}function d(t){for(var e=t.s;void 0!==e;e=e.n){var r=e.S.n;if(void 0!==r&&(e.r=r),e.S.n=e,e.i=-1,void 0===e.n){t.s=e;break}}}function y(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.p;-1===e.i?(e.S.U(e),void 0!==i&&(i.n=e.n),void 0!==e.n&&(e.n.p=i)):r=e,e.S.n=e.r,void 0!==e.r&&(e.r=void 0),e=i}t.s=r}function m(t){h.call(this,void 0),this.x=t,this.s=void 0,this.g=f-1,this.f=4}function b(t){var e=t.u;if(t.u=void 0,"function"==typeof e){l++;var i=n;n=void 0;try{e()}catch(e){throw t.f&=-2,t.f|=8,g(t),e}finally{n=i,r()}}}function g(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,b(t)}function A(t){if(n!==this)throw new Error("Out-of-order effect");y(this),n=t,this.f&=-2,8&this.f&&g(this),r()}function w(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function S(t){var e=new w(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}h.prototype.brand=e,h.prototype.h=function(){return!0},h.prototype.S=function(t){this.t!==t&&void 0===t.e&&(t.x=this.t,void 0!==this.t&&(this.t.e=t),this.t=t)},h.prototype.U=function(t){if(void 0!==this.t){var e=t.e,r=t.x;void 0!==e&&(e.x=r,t.e=void 0),void 0!==r&&(r.e=e,t.x=void 0),t===this.t&&(this.t=r)}},h.prototype.subscribe=function(t){var e=this;return S((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},h.prototype.valueOf=function(){return this.value},h.prototype.toString=function(){return this.value+""},h.prototype.toJSON=function(){return this.value},h.prototype.peek=function(){return this.v},Object.defineProperty(h.prototype,"value",{get:function(){var t=c(this);return void 0!==t&&(t.i=this.i),this.v},set:function(e){if(n instanceof m&&function(){throw new Error("Computed cannot have side-effects")}(),e!==this.v){u>100&&t(),this.v=e,this.i++,f++,l++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{r()}}}}),(m.prototype=new h).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===f)return!0;if(this.g=f,this.f|=1,this.i>0&&!p(this))return this.f&=-2,!0;var t=n;try{d(this),n=this;var e=this.x();(16&this.f||this.v!==e||0===this.i)&&(this.v=e,this.f&=-17,this.i++)}catch(t){this.v=t,this.f|=16,this.i++}return n=t,y(this),this.f&=-2,!0},m.prototype.S=function(t){if(void 0===this.t){this.f|=36;for(var e=this.s;void 0!==e;e=e.n)e.S.S(e)}h.prototype.S.call(this,t)},m.prototype.U=function(t){if(void 0!==this.t&&(h.prototype.U.call(this,t),void 0===this.t)){this.f&=-33;for(var e=this.s;void 0!==e;e=e.n)e.S.U(e)}},m.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},m.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(m.prototype,"value",{get:function(){1&this.f&&t();var e=c(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),w.prototype.c=function(){var t=this.S();try{if(8&this.f)return;if(void 0===this.x)return;var e=this.x();"function"==typeof e&&(this.u=e)}finally{t()}},w.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,b(this),d(this),l++;var e=n;return n=this,A.bind(this,e)},w.prototype.N=function(){2&this.f||(this.f|=2,this.o=a,a=this)},w.prototype.d=function(){this.f|=8,1&this.f||g(this)};var k,x=Symbol.dispose||=Symbol("dispose"),O=Symbol("signals"),N={Array:Array,Object:Object,Number:Number,String:String,Boolean:Boolean,Date:Date,console:console,window:window,document:document,history:history,navigator:navigator,location:location,screen:screen,localStorage:localStorage,sessionStorage:sessionStorage,alert:alert,prompt:prompt,confirm:confirm,fetch:fetch,performance:performance,setTimeout:setTimeout,setInterval:setInterval,requestAnimationFrame:requestAnimationFrame};function j(t,e){if(t?.constructor!==Object&&!Array.isArray(t))return t;if(t[O]&&!e)return t;const r=t[O],n=Array.isArray(t)&&v((r||t).length),o=e?Object.create((e=j(e))[O]):Array.isArray(t)?[]:{},a=o.constructor.prototype;if(e)for(let t in e)e[t];const l=new Proxy(t,{has:()=>!0,get(t,e){if(n){if("length"===e)return a[k]?n.peek():n.value;k=e}if(a[e])return a[e];if(e===O)return o;const r=o[e]||u(e);return r?r.value:N[e]},set(t,e,r){if(n&&"length"===e)return i((()=>{for(let t=r,e=o.length;t<e;t++)delete l[t];n.value=o.length=t.length=r})),!0;const a=o[e]||u(e)||v(),f=a.peek();return r===f||(a._set?a._set(r):Array.isArray(r)&&Array.isArray(f)?s((()=>i((()=>{let i=0,n=r.length,o=t[e];for(;i<n;i++)f[i]=o[i]=r[i];f.length=n})))):a.value=j(t[e]=r)),n&&e>=n.peek()&&(n.value=o.length=t.length=Number(e)+1),!0},deleteProperty(t,e){const r=o[e];if(r){const{_del:t}=r;delete r._del,delete o[e],t?.()}return delete t[e],!0}});for(let e in t)o[e]=r?.[e]??u(e);function u(e){if(t.hasOwnProperty(e)){const i=Object.getOwnPropertyDescriptor(t,e);return i?.get?((o[e]=(r=i.get.bind(l),new m(r)))._set=i.set?.bind(l),o[e]):o[e]=i.value?.peek?i.value:v(j(i.value))}var r}return l}var E=Promise.prototype.then.bind(Promise.resolve()),_={},$={};_.if=(t,e,r)=>{let i=document.createTextNode(""),n=[I(t,e,":if")],o=[t],s=t;for(;(s=t.nextElementSibling)&&s.hasAttribute(":else");)s.removeAttribute(":else"),(e=s.getAttribute(":if"))?(s.removeAttribute(":if"),s.remove(),o.push(s),n.push(I(t,e,":else :if"))):(s.remove(),o.push(s),n.push((()=>1)));t.replaceWith(s=i);const a=S((()=>{let t=n.findIndex((t=>t(r)));o[t]!=s&&((s[P]||s).replaceWith(s=o[t]||i),M(s,r))}));return()=>{for(const t of o)t[x]?.();a()}};var P=Symbol(":each");_.each=(t,e,r)=>{let n=function(t){let e=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=t.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!r)return;let i=r[2].trim(),n=r[1].replace(/^\s*\(|\)\s*$/g,"").trim(),o=n.match(e);return o?[n.replace(e,"").trim(),o[1].trim(),i]:[n,"",i]}(e);if(!n)return L(new Error,t,e,":each");const[o,a,l]=n,u=t.getAttribute(":ref")||"";u&&t.removeAttribute(":ref");const f=t[P]=document.createTextNode("");t.replaceWith(f);const c=I(t,l,":each");let h,v,p=0;return S((()=>{let n=c(r);return n?"number"==typeof n?n=Array.from({length:n},((t,e)=>e)):Array.isArray(n)||("object"==typeof n?(v=Object.keys(n),n=Object.values(n)):L(Error("Bad items value"),t,e,":each")):n=[],s((()=>i((()=>{if(h?.[O][0]?.peek){let t=n.length,e=0;for(;e<t;e++)h[e]=n[e];h.length=t}else{for(let t=0,e=h?.[O];t<p;t++)e[t]?._del();h=n,h[O]||={}}})))),S((()=>{let e=n.length;p!==e&&s((()=>i((()=>{const i=h[O];for(let n=p;n<e;n++){const e=t.cloneNode(!0),s=Object.create(r,{[o]:{get:()=>h[n]},[a]:{value:v?.[n]??n},[u]:{value:e}});f.before(e),M(e,s);const{_del:l}=i[n]||={};i[n]._del=()=>{delete h[n],l?.(),e[x](),e.remove()}}p=e}))))}))})),()=>i((()=>{for(let t of h[O])t?._del();h.length=0}))},_.with=(t,e,r)=>(M(t,j(I(t,e,":with")(r),r)),t[x]),_.ref=(t,e,r)=>{r[e]=t},$.render=(t,e,r)=>{let i=I(t,e,":render")(r);i||L(new Error("Template not found"),t,e,":render");let n=i.content.cloneNode(!0);return t.replaceChildren(n),M(t,r),t[x]},$.id=(t,e,r)=>{let i=I(t,e,":id");return S((()=>{return e=i(r),t.id=e||0===e?e:"";var e}))},$.class=(t,e,r)=>{let i=I(t,e,":class"),n=t.getAttribute("class");return S((()=>{let e=i(r),o=[n];e&&("string"==typeof e?o.push(e):Array.isArray(e)?o.push(...e):o.push(...Object.entries(e).map((([t,e])=>e?t:"")))),(o=o.filter(Boolean).join(" "))?t.setAttribute("class",o):t.removeAttribute("class")}))},$.style=(t,e,r)=>{let i=I(t,e,":style"),n=t.getAttribute("style")||"";return n.endsWith(";")||(n+="; "),S((()=>{let e=i(r);"string"==typeof e?t.setAttribute("style",n+e):s((()=>{t.setAttribute("style",n);for(let r in e)"symbol"!=typeof e[r]&&t.style.setProperty(r,e[r])}))}))},$.text=(t,e,r)=>{let i=I(t,e,":text");return S((()=>{let e=i(r);t.textContent=null==e?"":e}))},$[""]=(t,e,r)=>{let i=I(t,e,":");if(i)return S((()=>{let e=i(r);for(let r in e)K(t,r.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase())),e[r])}))},$.value=(t,e,r)=>{let i,n,o=I(t,e,":value"),s="text"===t.type||""===t.type?e=>t.setAttribute("value",t.value=null==e?"":e):"TEXTAREA"===t.tagName||"text"===t.type||""===t.type?e=>(i=t.selectionStart,n=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),i&&t.setSelectionRange(i,n)):"checkbox"===t.type?e=>(t.value=e?"on":"",K(t,"checked",e)):"select-one"===t.type?e=>{for(let e in t.options)e.removeAttribute("selected");t.value=e,t.selectedOptions[0]?.setAttribute("selected","")}:e=>t.value=e;return S((()=>{s(o(r))}))};var T=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),o=I(t,e,":"+i);if(o){if(n){let e,i=S((()=>{e&&(e(),e=null);let i=o(r);i&&(e=C(t,n,i))}));return()=>(e?.(),i())}return S((()=>{K(t,i,o(r))}))}},C=(t,e,r)=>{if(!r)return;const i={evt:"",target:t,test:()=>!0};i.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,r="")=>(i.test=W[e]?.(i,...r.split("-"))||i.test,"")));const{evt:n,target:o,test:s,defer:a,stop:l,prevent:u,...f}=i;a&&(r=a(r));const c=t=>s(t)&&(l&&t.stopPropagation(),u&&t.preventDefault(),r.call(o,t));return o.addEventListener(n,c,f),()=>o.removeEventListener(n,c,f)},W={prevent(t){t.prevent=!0},stop(t){t.stop=!0},once(t){t.once=!0},passive(t){t.passive=!0},capture(t){t.capture=!0},window(t){t.target=window},document(t){t.target=document},throttle(t,e){t.defer=t=>U(t,e?Number(e)||0:108)},debounce(t,e){t.defer=t=>B(t,e?Number(e)||0:108)},outside:t=>e=>{let r=t.target;return!(r.contains(e.target)||!1===e.target.isConnected||r.offsetWidth<1&&r.offsetHeight<1)},self:t=>e=>e.target===t.target,ctrl:(t,...e)=>t=>D.ctrl(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),shift:(t,...e)=>t=>D.shift(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),alt:(t,...e)=>t=>D.alt(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),meta:(t,...e)=>t=>D.meta(t)&&e.every((e=>D[e]?D[e](t):t.key===e)),arrow:t=>D.arrow,enter:t=>D.enter,escape:t=>D.escape,tab:t=>D.tab,space:t=>D.space,backspace:t=>D.backspace,delete:t=>D.delete,digit:t=>D.digit,letter:t=>D.letter,character:t=>D.character},D={ctrl:t=>t.ctrlKey||"Control"===t.key||"Ctrl"===t.key,shift:t=>t.shiftKey||"Shift"===t.key,alt:t=>t.altKey||"Alt"===t.key,meta:t=>t.metaKey||"Meta"===t.key||"Command"===t.key,arrow:t=>t.key.startsWith("Arrow"),enter:t=>"Enter"===t.key,escape:t=>t.key.startsWith("Esc"),tab:t=>"Tab"===t.key,space:t=>" "===t.key||"Space"===t.key||" "===t.key,backspace:t=>"Backspace"===t.key,delete:t=>"Delete"===t.key,digit:t=>/^\d$/.test(t.key),letter:t=>/^[a-zA-Z]$/.test(t.key),character:t=>/^\S$/.test(t.key)},U=(t,e)=>{let r,i,n=o=>{r=!0,setTimeout((()=>{if(r=!1,i)return i=!1,n(o),t(o)}),e)};return e=>r?i=!0:(n(e),t(e))},B=(t,e)=>{let r;return i=>{clearTimeout(r),r=setTimeout((()=>{r=null,t(i)}),e)}},K=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},F={};function I(t,e,r){let i=F[e];if(!i)try{i=F[e]=new Function("__scope",`with (__scope) { let __; return ${e.trim()} };`)}catch(i){return L(i,t,e,r)}return n=>{let o;try{o=i.call(t,n)}catch(i){return L(i,t,e,r)}return o}}function L(t,e,r,i){Object.assign(t,{element:e,expression:r}),console.warn(`∴ ${t.message}\n\n${i}=${r?`"${r}"\n\n`:""}`,e),E((()=>{throw t}),0)}M.globals=N;var q=new WeakMap;function M(t,e){if(!t.children)return;if(q.has(t))return i((()=>Object.assign(q.get(t),e)));const r=j(e||{}),n=[],o=(t,e=t.parentNode)=>{for(let i in _){let o=":"+i;if(t.hasAttribute?.(o)){let s=t.getAttribute(o);if(t.removeAttribute(o),n.push(_[i](t,s,r,i)),q.has(t))return;if(t.parentNode!==e)return!1}}if(t.attributes)for(let e=0;e<t.attributes.length;){let i=t.attributes[e],o=i.name[0];if(":"===o||"@"===o){t.removeAttribute(i.name);let e="@"===o?`${i.value.includes("await")?"async":""} event=>{${i.value}}`:i.value,s=i.name.slice(1).split(o);for(let i of s){"@"===o&&(i="on"+i);let s=$[i]||T;n.push(s(t,e,r,i))}}else e++}for(let e,r=0;e=t.children[r];r++)!1===o(e,t)&&r--};return o(t),q.has(t)||(q.set(t,r),n.length&&Object.defineProperty(t,x,{value:()=>{for(;n.length;)n.shift()?.();q.delete(t)}})),r}var R=M;document.currentScript&&M(document.documentElement);export{R as default};
+function t(){throw new Error("Cycle detected")}var e=Symbol.for("preact-signals");function r(){if(l>1)l--;else{for(var t,e=!1;void 0!==a;){var r=a;for(a=void 0,u++;void 0!==r;){var i=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&p(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=i}}if(u=0,l--,e)throw t}}function i(t){if(l>0)return t();l++;try{return t()}finally{r()}}var n=void 0,o=0;function s(t){if(o>0)return t();var e=n;n=void 0,o++;try{return t()}finally{o--,n=e}}var a=void 0,l=0,u=0,f=0;function c(t){if(void 0!==n){var e=t.n;if(void 0===e||e.t!==n)return e={i:0,S:t,p:n.s,n:void 0,t:n,e:void 0,x:void 0,r:e},void 0!==n.s&&(n.s.n=e),n.s=e,t.n=e,32&n.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.n&&(e.n.p=e.p,void 0!==e.p&&(e.p.n=e.n),e.p=n.s,e.n=void 0,n.s.n=e,n.s=e),e}}function h(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function v(t){return new h(t)}function p(t){for(var e=t.s;void 0!==e;e=e.n)if(e.S.i!==e.i||!e.S.h()||e.S.i!==e.i)return!0;return!1}function d(t){for(var e=t.s;void 0!==e;e=e.n){var r=e.S.n;if(void 0!==r&&(e.r=r),e.S.n=e,e.i=-1,void 0===e.n){t.s=e;break}}}function y(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.p;-1===e.i?(e.S.U(e),void 0!==i&&(i.n=e.n),void 0!==e.n&&(e.n.p=i)):r=e,e.S.n=e.r,void 0!==e.r&&(e.r=void 0),e=i}t.s=r}function m(t){h.call(this,void 0),this.x=t,this.s=void 0,this.g=f-1,this.f=4}function b(t){var e=t.u;if(t.u=void 0,"function"==typeof e){l++;var i=n;n=void 0;try{e()}catch(e){throw t.f&=-2,t.f|=8,g(t),e}finally{n=i,r()}}}function g(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,b(t)}function A(t){if(n!==this)throw new Error("Out-of-order effect");y(this),n=t,this.f&=-2,8&this.f&&g(this),r()}function w(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function S(t){var e=new w(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}h.prototype.brand=e,h.prototype.h=function(){return!0},h.prototype.S=function(t){this.t!==t&&void 0===t.e&&(t.x=this.t,void 0!==this.t&&(this.t.e=t),this.t=t)},h.prototype.U=function(t){if(void 0!==this.t){var e=t.e,r=t.x;void 0!==e&&(e.x=r,t.e=void 0),void 0!==r&&(r.e=e,t.x=void 0),t===this.t&&(this.t=r)}},h.prototype.subscribe=function(t){var e=this;return S((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},h.prototype.valueOf=function(){return this.value},h.prototype.toString=function(){return this.value+""},h.prototype.toJSON=function(){return this.value},h.prototype.peek=function(){return this.v},Object.defineProperty(h.prototype,"value",{get:function(){var t=c(this);return void 0!==t&&(t.i=this.i),this.v},set:function(e){if(n instanceof m&&function(){throw new Error("Computed cannot have side-effects")}(),e!==this.v){u>100&&t(),this.v=e,this.i++,f++,l++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{r()}}}}),(m.prototype=new h).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===f)return!0;if(this.g=f,this.f|=1,this.i>0&&!p(this))return this.f&=-2,!0;var t=n;try{d(this),n=this;var e=this.x();(16&this.f||this.v!==e||0===this.i)&&(this.v=e,this.f&=-17,this.i++)}catch(t){this.v=t,this.f|=16,this.i++}return n=t,y(this),this.f&=-2,!0},m.prototype.S=function(t){if(void 0===this.t){this.f|=36;for(var e=this.s;void 0!==e;e=e.n)e.S.S(e)}h.prototype.S.call(this,t)},m.prototype.U=function(t){if(void 0!==this.t&&(h.prototype.U.call(this,t),void 0===this.t)){this.f&=-33;for(var e=this.s;void 0!==e;e=e.n)e.S.U(e)}},m.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},m.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(m.prototype,"value",{get:function(){1&this.f&&t();var e=c(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),w.prototype.c=function(){var t=this.S();try{if(8&this.f)return;if(void 0===this.x)return;var e=this.x();"function"==typeof e&&(this.u=e)}finally{t()}},w.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,b(this),d(this),l++;var e=n;return n=this,A.bind(this,e)},w.prototype.N=function(){2&this.f||(this.f|=2,this.o=a,a=this)},w.prototype.d=function(){this.f|=8,1&this.f||g(this)};var k,x=Symbol.dispose||=Symbol("dispose"),O=Symbol("signals"),N=Symbol("length"),j={Array:Array,Object:Object,Number:Number,String:String,Boolean:Boolean,Date:Date,console:console,window:window,document:document,history:history,navigator:navigator,location:location,screen:screen,localStorage:localStorage,sessionStorage:sessionStorage,alert:alert,prompt:prompt,confirm:confirm,fetch:fetch,performance:performance,setTimeout:setTimeout,setInterval:setInterval,requestAnimationFrame:requestAnimationFrame};function E(t,e){if(t?.constructor!==Object&&!Array.isArray(t))return t;if(t[O]&&!e)return t;const r=t[O],n=Array.isArray(t),o=v(Object.values(t).length),a=e?Object.create((e=E(e))[O]):Array.isArray(t)?[]:{},l=a.constructor.prototype;if(e)for(let t in e)e[t];const u=new Proxy(t,{has:()=>!0,get(t,e){if(n){if("length"===e)return l[k]?o.peek():o.value;k=e}if(l[e])return l[e];if(e===O)return a;if(e===N)return o.value;const r=a[e]||f(e);return r?r.value:j[e]},set(t,e,r){if(n&&"length"===e)return i((()=>{for(let t=r,e=a.length;t<e;t++)delete u[t];o.value=a.length=t.length=r})),!0;let l=!1;const c=a[e]||f(e)||(l=!0,v()),h=c.peek();return r===h||(c._set?c._set(r):Array.isArray(r)&&Array.isArray(h)?s((()=>i((()=>{let i=0,n=r.length,o=t[e];for(;i<n;i++)h[i]=o[i]=r[i];h.length=n})))):c.value=E(t[e]=r)),n?e>=o.peek()&&(o.value=a.length=t.length=Number(e)+1):l&&o.value++,!0},deleteProperty(t,e){const r=a[e];if(r){const{_del:t}=r;delete r._del,delete a[e],t?.()}return delete t[e],n||o.value--,!0}});for(let e in t)a[e]=r?.[e]??f(e);function f(e){if(t.hasOwnProperty(e)){const i=Object.getOwnPropertyDescriptor(t,e);return i?.get?((a[e]=(r=i.get.bind(u),new m(r)))._set=i.set?.bind(u),a[e]):a[e]=i.value?.peek?i.value:v(E(i.value))}var r}return u}var _=Promise.prototype.then.bind(Promise.resolve()),$={},P={};$.if=(t,e,r)=>{let i=document.createTextNode(""),n=[L(t,e,":if")],o=[t],s=t;for(;(s=t.nextElementSibling)&&s.hasAttribute(":else");)s.removeAttribute(":else"),(e=s.getAttribute(":if"))?(s.removeAttribute(":if"),s.remove(),o.push(s),n.push(L(t,e,":else :if"))):(s.remove(),o.push(s),n.push((()=>1)));t.replaceWith(s=i);const a=S((()=>{let t=n.findIndex((t=>t(r)));o[t]!=s&&((s[T]||s).replaceWith(s=o[t]||i),R(s,r))}));return()=>{for(const t of o)t[x]?.();a()}};var T=Symbol(":each");$.each=(t,e,r)=>{const n=function(t){let e=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=t.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!r)return;let i=r[2].trim(),n=r[1].replace(/^\s*\(|\)\s*$/g,"").trim(),o=n.match(e);return o?[n.replace(e,"").trim(),o[1].trim(),i]:[n,"",i]}(e);if(!n)return q(new Error,t,e,":each");const[o,a,l]=n,u=t[T]=document.createTextNode("");t.replaceWith(u);const f=L(t,l,":each");let c,h;return S((()=>{let n,l,v=f(r),p=c?.length||0;return v?"number"==typeof v?n=Array.from({length:v},((t,e)=>e)):Array.isArray(v)?n=v:"object"==typeof v?(l=Object.keys(v),n=Object.values(v),v[N]):q(Error("Bad items value"),t,e,":each"):n=[],s((()=>i((()=>{if(c&&c[O]){let t=n.length,e=0;for(;e<t;e++)c[e]=n[e];c.length=t}else{for(let t=0;t<p;t++)h[t]?._del();c=n,h=c[O]||[],l&&(p=0)}})))),S((()=>{let e=n.length;p!==e&&s((()=>i((()=>{for(let i=p;i<e;i++){const e=l?.[i]??i,n=t.cloneNode(!0),s=E({[o]:h[i]??c[i],[a]:e},r);u.before(n),R(n,s);const{_del:f}=h[i]||={};h[i]._del=()=>{delete c[i],f?.(),n[x](),n.remove()}}p=e}))))}))})),()=>i((()=>{for(let t of h)t?._del();h.length=0,c.length=0}))},$.with=(t,e,r)=>(R(t,E(L(t,e,":with")(r),r)),t[x]),$.ref=(t,e,r)=>{r[e]=t},P.render=(t,e,r)=>{let i=L(t,e,":render")(r);i||q(new Error("Template not found"),t,e,":render");let n=i.content.cloneNode(!0);return t.replaceChildren(n),R(t,r),t[x]},P.id=(t,e,r)=>{let i=L(t,e,":id");return S((()=>{return e=i(r),t.id=e||0===e?e:"";var e}))},P.class=(t,e,r)=>{let i=L(t,e,":class"),n=t.getAttribute("class");return S((()=>{let e=i(r),o=[n];e&&("string"==typeof e?o.push(e):Array.isArray(e)?o.push(...e):o.push(...Object.entries(e).map((([t,e])=>e?t:"")))),(o=o.filter(Boolean).join(" "))?t.setAttribute("class",o):t.removeAttribute("class")}))},P.style=(t,e,r)=>{let i=L(t,e,":style"),n=t.getAttribute("style")||"";return n.endsWith(";")||(n+="; "),S((()=>{let e=i(r);"string"==typeof e?t.setAttribute("style",n+e):s((()=>{t.setAttribute("style",n);for(let r in e)"symbol"!=typeof e[r]&&t.style.setProperty(r,e[r])}))}))},P.text=(t,e,r)=>{let i=L(t,e,":text");return S((()=>{let e=i(r);t.textContent=null==e?"":e}))},P[""]=(t,e,r)=>{let i=L(t,e,":");if(i)return S((()=>{let e=i(r);for(let r in e)F(t,r.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase())),e[r])}))},P.value=(t,e,r)=>{let i,n,o=L(t,e,":value"),s="text"===t.type||""===t.type?e=>t.setAttribute("value",t.value=null==e?"":e):"TEXTAREA"===t.tagName||"text"===t.type||""===t.type?e=>(i=t.selectionStart,n=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),i&&t.setSelectionRange(i,n)):"checkbox"===t.type?e=>(t.value=e?"on":"",F(t,"checked",e)):"select-one"===t.type?e=>{for(let e in t.options)e.removeAttribute("selected");t.value=e,t.selectedOptions[0]?.setAttribute("selected","")}:e=>t.value=e;return S((()=>{s(o(r))}))};var C=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),o=L(t,e,":"+i);if(o){if(n){let e,i=S((()=>{e&&(e(),e=null);let i=o(r);i&&(e=W(t,n,i))}));return()=>(e?.(),i())}return S((()=>{F(t,i,o(r))}))}},W=(t,e,r)=>{if(!r)return;const i={evt:"",target:t,test:()=>!0};i.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,r="")=>(i.test=D[e]?.(i,...r.split("-"))||i.test,"")));const{evt:n,target:o,test:s,defer:a,stop:l,prevent:u,...f}=i;a&&(r=a(r));const c=t=>s(t)&&(l&&t.stopPropagation(),u&&t.preventDefault(),r.call(o,t));return o.addEventListener(n,c,f),()=>o.removeEventListener(n,c,f)},D={prevent(t){t.prevent=!0},stop(t){t.stop=!0},once(t){t.once=!0},passive(t){t.passive=!0},capture(t){t.capture=!0},window(t){t.target=window},document(t){t.target=document},throttle(t,e){t.defer=t=>B(t,e?Number(e)||0:108)},debounce(t,e){t.defer=t=>K(t,e?Number(e)||0:108)},outside:t=>e=>{let r=t.target;return!(r.contains(e.target)||!1===e.target.isConnected||r.offsetWidth<1&&r.offsetHeight<1)},self:t=>e=>e.target===t.target,ctrl:(t,...e)=>t=>U.ctrl(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),shift:(t,...e)=>t=>U.shift(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),alt:(t,...e)=>t=>U.alt(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),meta:(t,...e)=>t=>U.meta(t)&&e.every((e=>U[e]?U[e](t):t.key===e)),arrow:t=>U.arrow,enter:t=>U.enter,escape:t=>U.escape,tab:t=>U.tab,space:t=>U.space,backspace:t=>U.backspace,delete:t=>U.delete,digit:t=>U.digit,letter:t=>U.letter,character:t=>U.character},U={ctrl:t=>t.ctrlKey||"Control"===t.key||"Ctrl"===t.key,shift:t=>t.shiftKey||"Shift"===t.key,alt:t=>t.altKey||"Alt"===t.key,meta:t=>t.metaKey||"Meta"===t.key||"Command"===t.key,arrow:t=>t.key.startsWith("Arrow"),enter:t=>"Enter"===t.key,escape:t=>t.key.startsWith("Esc"),tab:t=>"Tab"===t.key,space:t=>" "===t.key||"Space"===t.key||" "===t.key,backspace:t=>"Backspace"===t.key,delete:t=>"Delete"===t.key,digit:t=>/^\d$/.test(t.key),letter:t=>/^[a-zA-Z]$/.test(t.key),character:t=>/^\S$/.test(t.key)},B=(t,e)=>{let r,i,n=o=>{r=!0,setTimeout((()=>{if(r=!1,i)return i=!1,n(o),t(o)}),e)};return e=>r?i=!0:(n(e),t(e))},K=(t,e)=>{let r;return i=>{clearTimeout(r),r=setTimeout((()=>{r=null,t(i)}),e)}},F=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},I={};function L(t,e,r){let i=I[e];if(!i)try{i=I[e]=new Function("__scope",`with (__scope) { let __; return ${e.trim()} };`)}catch(i){return q(i,t,e,r)}return n=>{let o;try{o=i.call(t,n)}catch(i){return q(i,t,e,r)}return o}}function q(t,e,r,i){Object.assign(t,{element:e,expression:r}),console.warn(`∴ ${t.message}\n\n${i}=${r?`"${r}"\n\n`:""}`,e),_((()=>{throw t}),0)}R.globals=j;var M=new WeakMap;function R(t,e){if(!t.children)return;if(M.has(t))return i((()=>Object.assign(M.get(t),e)));const r=E(e||{}),n=[],o=(t,e=t.parentNode)=>{for(let i in $){let o=":"+i;if(t.hasAttribute?.(o)){let s=t.getAttribute(o);if(t.removeAttribute(o),n.push($[i](t,s,r,i)),M.has(t))return;if(t.parentNode!==e)return!1}}if(t.attributes)for(let e=0;e<t.attributes.length;){let i=t.attributes[e],o=i.name[0];if(":"===o||"@"===o){t.removeAttribute(i.name);let e="@"===o?`${i.value.includes("await")?"async":""} event=>{${i.value}}`:i.value,s=i.name.slice(1).split(o);for(let i of s){"@"===o&&(i="on"+i);let s=P[i]||C;n.push(s(t,e,r,i))}}else e++}for(let e,r=0;e=t.children[r];r++)!1===o(e,t)&&r--};return o(t),M.has(t)||(M.set(t,r),n.length&&Object.defineProperty(t,x,{value:()=>{for(;n.length;)n.shift()?.();M.delete(t)}})),r}var Z=R;document.currentScript&&R(document.documentElement);export{Z as default};

package/src/directives.js

@@ -1,7 +1,7 @@
 // directives & parsing
 import sprae from './core.js'
-import createState, { effect, computed, untracked, batch, _dispose, _signals } from './state.signals-proxy.js'
-import { queueMicrotask } from './util.js'
+import createState, { effect, computed, untracked, batch, _dispose, _signals, _change } from './state.signals-proxy.js'
+import { getFirstProperty, queueMicrotask } from './util.js'
 
 // reserved directives - order matters!
 // primary initialized first by selector, secondary initialized by iterating attributes
@@ -53,14 +53,14 @@ const _each = Symbol(':each')
 
 // :each must init before :ref, :id or any others, since it defines scope
 primary['each'] = (tpl, expr, state) => {
-  let each = parseForExpression(expr);
+  const each = parseForExpression(expr);
   if (!each) return exprError(new Error, tpl, expr, ':each');
 
   const [itemVar, idxVar, itemsExpr] = each;
 
-  // we have to handle item :ref separately since we don't create substates
-  const refName = tpl.getAttribute(':ref') || ''
-  if (refName) tpl.removeAttribute(':ref')
+  // we have to handle item :ref separately if don't create substates
+  // const refName = tpl.getAttribute(':ref') || ''
+  // if (refName) tpl.removeAttribute(':ref')
 
   // we need :if to be able to replace holder instead of tpl for :if :each case
   const holder = tpl[_each] = document.createTextNode('')
@@ -69,58 +69,65 @@ primary['each'] = (tpl, expr, state) => {
   const evaluate = parseExpr(tpl, itemsExpr, ':each');
 
   // we re-create items any time new items are produced
-  let items, prevl = 0, keys
+  let curItems, signals
   effect(() => {
-    let newItems = evaluate(state)
+    let srcItems = evaluate(state), newItems, keys
+    let prevl = curItems?.length || 0
 
     // convert items to array
-    if (!newItems) newItems = []
-    else if (typeof newItems === 'number') {
-      newItems = Array.from({ length: newItems }, (_, i) => i)
+    if (!srcItems) newItems = []
+    else if (typeof srcItems === 'number') {
+      newItems = Array.from({ length: srcItems }, (_, i) => i)
     }
-    else if (Array.isArray(newItems));
-    else if (typeof newItems === 'object') {
-      keys = Object.keys(newItems);
-      newItems = Object.values(newItems);
+    else if (Array.isArray(srcItems)) newItems = srcItems;
+    else if (typeof srcItems === 'object') {
+      keys = Object.keys(srcItems);
+      newItems = Object.values(srcItems);
+      srcItems[_change]; // subscribe to object new props changes
     }
     else {
-      exprError(Error('Bad items value'), tpl, expr, ':each', newItems)
+      exprError(Error('Bad items value'), tpl, expr, ':each', srcItems)
     }
 
     untracked(() => batch(() => {
-      // init items
-      if (!items?.[_signals][0]?.peek) {
-        // manual dispose for plain arrays (not states) - _signals here is just fake holder for destructors
-        for (let i = 0, signals = items?.[_signals]; i < prevl; i++) signals[i]?._del()
-        // NOTE: new items are initialized in length effect below
-        items = newItems, items[_signals] ||= {}
+      // (re)init items (if plain array/obj passed instead of proxy-state)
+      if (!curItems || !curItems[_signals]) {
+        // manual dispose for plain (non-state) arrays - signals here is just holder for destructors
+        for (let i = 0; i < prevl; i++) signals[i]?._del()
+        // NOTE: new items are initialized in length effect below;
+        curItems = newItems, signals = curItems[_signals] || []
+        if (keys) prevl = 0 // NOTE: objects regenerate full list each time instead of subscription
       }
       // patch existing items and insert new items - init happens in length effect
       else {
         let newl = newItems.length, i = 0
-        for (; i < newl; i++) items[i] = newItems[i]
-        items.length = newl // dispose tail (done internally in state)
+        for (; i < newl; i++) curItems[i] = newItems[i]
+        curItems.length = newl // dispose tail (done internally in state)
       }
     }))
 
     // length change effect
     return effect(() => {
-      let newl = newItems.length // indicate that we track it
+      let newl = newItems.length; // indicate that we track length
       if (prevl !== newl) untracked(() => batch(() => {
         // init new items
-        const signals = items[_signals]
         for (let i = prevl; i < newl; i++) {
+          const idx = keys?.[i] ?? i
           const el = tpl.cloneNode(true),
-            // instead of substate we create inherited object (less memory & faster)
-            scope = Object.create(state, {
-              [itemVar]: { get() { return items[i] } },
-              [idxVar]: { value: keys?.[i] ?? i },
-              [refName]: { value: el },
-            })
+            // inherited object instead of substate (less memory & faster)
+            // scope = Object.create(state, {
+            //   [itemVar]: { get() { return curItems[i] } },
+            //   [idxVar]: { value: idx },
+            //   [refName]: { value: el },
+            // })
+            scope = createState({
+              [itemVar]: signals[i] ?? curItems[i],
+              [idxVar]: idx
+            }, state)
           holder.before(el)
           sprae(el, scope)
           const { _del } = (signals[i] ||= {});
-          signals[i]._del = () => { delete items[i]; _del?.(); el[_dispose](), el.remove() }
+          signals[i]._del = () => { delete curItems[i]; _del?.(); el[_dispose](), el.remove() }
         }
         prevl = newl
       }))
@@ -128,8 +135,9 @@ primary['each'] = (tpl, expr, state) => {
   })
 
   return () => batch(() => {
-    for (let _i of items[_signals]) _i?._del()
-    items.length = 0
+    for (let _i of signals) _i?._del()
+    signals.length = 0
+    curItems.length = 0
   })
 }
 

package/src/state.signals-proxy.js

@@ -14,7 +14,7 @@ import { signal, computed, effect, batch, untracked } from '@preact/signals-core
 export { effect, computed, batch, untracked }
 
 export const _dispose = (Symbol.dispose ||= Symbol('dispose'));
-export const _signals = Symbol('signals');
+export const _signals = Symbol('signals'), _change = Symbol('length');
 
 
 // default root sandbox
@@ -33,12 +33,14 @@ let lastProp
 
 export default function createState(values, parent) {
   if (!isObject(values) && !Array.isArray(values)) return values;
+
   // ignore existing state as argument
   if (values[_signals] && !parent) return values;
   const initSignals = values[_signals]
 
-  // .length signal is stored outside, since cannot be replaced
-  const _len = Array.isArray(values) && signal((initSignals || values).length),
+  // .length signal is stored outside, since it cannot be replaced
+  // _len stores total values length (for objects as well)
+  const isArr = Array.isArray(values), _len = signal(Object.values(values).length),
     // dict with signals storing values
     signals = parent ? Object.create((parent = createState(parent))[_signals]) : Array.isArray(values) ? [] : {},
     proto = signals.constructor.prototype;
@@ -49,19 +51,22 @@ export default function createState(values, parent) {
   const state = new Proxy(values, {
     // sandbox everything
     has() { return true },
+
     get(values, key) {
       // if .length is read within .push/etc - peek signal (don't subscribe)
-      if (_len)
+      if (isArr)
         if (key === 'length') return (proto[lastProp]) ? _len.peek() : _len.value;
         else lastProp = key;
       if (proto[key]) return proto[key]
       if (key === _signals) return signals
+      if (key === _change) return _len.value
       const s = signals[key] || initSignal(key)
       if (s) return s.value // existing property
       return sandbox[key] // Array, window etc
     },
+
     set(values, key, v) {
-      if (_len) {
+      if (isArr) {
         // .length
         if (key === 'length') {
           batch(() => {
@@ -73,7 +78,8 @@ export default function createState(values, parent) {
         }
       }
 
-      const s = signals[key] || initSignal(key, v) || signal()
+      let newProp = false
+      const s = signals[key] || initSignal(key, v) || (newProp = true, signal())
       const cur = s.peek()
 
       // skip unchanged (although can be handled by last condition - we skip a few checks this way)
@@ -95,10 +101,17 @@ export default function createState(values, parent) {
       }
 
       // force changing length, if eg. a=[]; a[1]=1 - need to come after setting the item
-      if (_len && key >= _len.peek()) _len.value = signals.length = values.length = Number(key) + 1
+      if (isArr) {
+        if (key >= _len.peek()) _len.value = signals.length = values.length = Number(key) + 1
+      }
+      // bump _change for object
+      else if (newProp) {
+        _len.value++
+      }
 
       return true
     },
+
     deleteProperty(values, key) {
       const s = signals[key]
       if (s) {
@@ -108,6 +121,7 @@ export default function createState(values, parent) {
         _del?.()
       }
       delete values[key]
+      if (!isArr) _len.value--
       return true
     }
   })

package/src/util.js

@@ -2,3 +2,12 @@
 // reset stacktrace or plan for fastest next call
 // https://twitter.com/_developit/status/1634033380940455936
 export const queueMicrotask = Promise.prototype.then.bind(Promise.resolve());
+
+// pick first prop
+export function getFirstProperty(obj) {
+  for (let key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      return obj[key];
+    }
+  }
+}