sprae 2.14.1 → 2.14.2

package/package.json

@@ -1,13 +1,12 @@
 {
   "name": "sprae",
   "description": "DOM microhydration.",
-  "version": "2.14.1",
+  "version": "2.14.2",
   "main": "src/index.js",
   "module": "src/index.js",
   "type": "module",
   "dependencies": {
     "@preact/signals-core": "^1.2.3",
-    "primitive-pool": "^2.0.0",
     "signal-struct": "^1.10.0",
     "swapdom": "^1.1.1"
   },

package/r&d.md

@@ -359,12 +359,12 @@
     ? maybe define setters such that when they're set
 
 2. Use sandboxed proxy
-  - tough evaluation
-  - implementation hiccups
-  - screwed up data
-  - no full protection
+  - tougher evaluation
+  - no full protection (Function.constructor)
   - relatively slow
   + does minimal catch
+  + allows scope control
+  + allows dynamic subscription to requested fields ( no need for preact/signals neither for signal-struct )
 
 ## [x] :onclick="direct code" ? -> no: immediately invoked.
 
@@ -447,7 +447,9 @@
       * onkey.after, onkey.microtask, onkey.defer, onkey.immediate
       * onkey.tick-1?
 
-## [x] Mods design -> use event modifiers, not props modifiers
+### [ ] onkey.unfocusable
+
+## [ ] Prop modifiers
 
   * [ ] Prop modifiers
     - overall seems code complication without much benefit
@@ -470,7 +472,8 @@
     * [ ] prop.fx="" - run effect without changing property
     * [ ] x.prop="xyz" - set element property, rather than attribute (following topic)
     * [ ] x.raf="abc" - run regularly?
-    * [ ] x.watch-xyz - update by change of any of the deps
+    * [ ] x.watch-a-b-c - update by change of any of the deps
+    * [ ] :x.always - update by _any_ dep change
 
 ## [x] Writing props on elements (like ones in :each) -> nah, just use `:x="this.x=abc"`
 
@@ -522,4 +525,4 @@
   ? does it replace element or puts a content?
 
   1. :use="ref-id"
-  2. :
+  2. :

package/readme.md

@@ -139,7 +139,7 @@ Set any attribute value or run effect.
 <!-- Bulk properties -->
 <input :="{ id: name, name, type:'text', value }" />
 
-<!-- Effect (triggers any time foo or bar changes) -->
+<!-- Effects (trigger any time foo or bar changes) -->
 <div :="if (foo) bar()" :fx="void bar()" ></div>
 ```
 

package/sprae.js

@@ -500,22 +500,35 @@ function domdiff_default(parent, a2, b2, before) {
   return b2;
 }
 
-// node_modules/primitive-pool/index.js
-var cache = {};
-var nullObj = {};
-var undefinedObj = {};
-var primitive_pool_default = (key) => {
-  if (key === null)
-    return nullObj;
-  if (key === void 0)
-    return undefinedObj;
-  if (typeof key === "number" || key instanceof Number)
-    return cache[key] || (cache[key] = new Number(key));
-  if (typeof key === "string" || key instanceof String)
-    return cache[key] || (cache[key] = new String(key));
-  if (typeof key === "boolean" || key instanceof Boolean)
-    return cache[key] || (cache[key] = new Boolean(key));
-  return key;
+// src/weakish-map.js
+var refs = /* @__PURE__ */ new WeakMap();
+var set = (value) => {
+  const ref = new WeakRef(value);
+  refs.set(value, ref);
+  return ref;
+};
+var get = (value) => refs.get(value) || set(value);
+var WeakishMap = class extends Map {
+  #registry = new FinalizationRegistry((key) => super.delete(key));
+  get size() {
+    return [...this].length;
+  }
+  constructor(entries = []) {
+    super();
+    for (const [key, value] of entries)
+      this.set(key, value);
+  }
+  get(key) {
+    return super.get(key)?.deref();
+  }
+  set(key, value) {
+    let ref = super.get(key);
+    if (ref)
+      this.#registry.unregister(ref);
+    ref = get(value);
+    this.#registry.register(value, key, ref);
+    return super.set(key, ref);
+  }
 };
 
 // src/directives.js
@@ -563,8 +576,8 @@ primary["each"] = (tpl, expr) => {
   const keyExpr = tpl.getAttribute(":key");
   const itemKey = keyExpr ? parseExpr(null, keyExpr) : null;
   tpl.removeAttribute(":key");
-  const scopes = /* @__PURE__ */ new WeakMap();
-  const itemEls = /* @__PURE__ */ new WeakMap();
+  const scopes = new WeakishMap();
+  const itemEls = new WeakishMap();
   let curEls = [];
   return (state) => {
     let list = evaluate(state);
@@ -581,8 +594,6 @@ primary["each"] = (tpl, expr) => {
     let newEls = [], elScopes = [];
     for (let [idx, item] of list) {
       let el, scope, key = itemKey?.({ [each[0]]: item, [each[1]]: idx });
-      if (isPrimitive(key))
-        key = primitive_pool_default(key);
       if (key == null)
         el = tpl.cloneNode(true);
       else
@@ -870,7 +881,7 @@ var evaluatorMemo = {};
 function parseExpr(el, expression, dir) {
   let evaluate = evaluatorMemo[expression];
   if (!evaluate) {
-    let rightSideSafeExpression = /^[\n\s]*if.*\(.*\)/.test(expression) || /\b(let|const)\s/.test(expression) ? `(() => { ${expression} })()` : expression;
+    let rightSideSafeExpression = /^[\n\s]*if.*\(.*\)/.test(expression) || /\b(let|const)\s/.test(expression) && !dir.startsWith(":on") ? `(() => {${expression}})()` : expression;
     try {
       evaluate = evaluatorMemo[expression] = new Function(`__scope`, `with (__scope) { return ${rightSideSafeExpression.trim()} };`);
     } catch (e2) {
@@ -901,9 +912,6 @@ ${dir}=${expression ? `"${expression}"
 function dashcase(str) {
   return str.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (match) => "-" + match.toLowerCase());
 }
-function isPrimitive(obj) {
-  return typeof obj === "string" || typeof obj === "boolean" || typeof obj === "number";
-}
 
 // src/core.js
 var memo = /* @__PURE__ */ new WeakMap();

package/sprae.min.js

@@ -1 +1 @@
-function t(){throw new Error("Cycle detected")}function e(){if(n>1)n--;else{for(var t,e=!1;void 0!==i;){var r=i;for(i=void 0,o++;void 0!==r;){var s=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&f(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=s}}if(o=0,n--,e)throw t}}var r=void 0,i=void 0,n=0,o=0,s=0;function l(t){if(void 0!==r){var e=t.n;if(void 0===e||e.t!==r)return e={i:0,S:t,p:r.s,n:void 0,t:r,e:void 0,x:void 0,r:e},void 0!==r.s&&(r.s.n=e),r.s=e,t.n=e,32&r.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=r.s,e.n=void 0,r.s.n=e,r.s=e),e}}function a(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function f(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 u(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 c(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 h(t){a.call(this,void 0),this.x=t,this.s=void 0,this.g=s-1,this.f=4}function v(t){var i=t.u;if(t.u=void 0,"function"==typeof i){n++;var o=r;r=void 0;try{i()}catch(e){throw t.f&=-2,t.f|=8,p(t),e}finally{r=o,e()}}}function p(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,v(t)}function d(t){if(r!==this)throw new Error("Out-of-order effect");c(this),r=t,this.f&=-2,8&this.f&&p(this),e()}function y(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function b(t){var e=new y(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}a.prototype.h=function(){return!0},a.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)},a.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)}},a.prototype.subscribe=function(t){var e=this;return b((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},a.prototype.valueOf=function(){return this.value},a.prototype.toString=function(){return this.value+""},a.prototype.peek=function(){return this.v},Object.defineProperty(a.prototype,"value",{get:function(){var t=l(this);return void 0!==t&&(t.i=this.i),this.v},set:function(r){if(r!==this.v){o>100&&t(),this.v=r,this.i++,s++,n++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{e()}}}}),(h.prototype=new a).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===s)return!0;if(this.g=s,this.f|=1,this.i>0&&!f(this))return this.f&=-2,!0;var t=r;try{u(this),r=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 r=t,c(this),this.f&=-2,!0},h.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)}a.prototype.S.call(this,t)},h.prototype.U=function(t){if(void 0!==this.t&&(a.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)}},h.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},h.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(h.prototype,"value",{get:function(){1&this.f&&t();var e=l(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),y.prototype.c=function(){var t=this.S();try{8&this.f||void 0===this.x||(this.u=this.x())}finally{t()}},y.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,v(this),u(this),n++;var e=r;return r=this,d.bind(this,e)},y.prototype.N=function(){2&this.f||(this.f|=2,this.o=i,i=this)},y.prototype.d=function(){this.f|=8,1&this.f||p(this)},Symbol.observable||=Symbol("observable");var g=new FinalizationRegistry((t=>t.call?.())),m=(t,e,r,i,n,o)=>{return t&&(s=(t[Symbol.observable]?.()||t).subscribe?.(e,r,i),o=s&&(()=>s.unsubscribe?.())||t.set&&t.call?.(n,e)||(t.then?.((t=>(!n&&e(t),i?.())),r)||(async o=>{try{for await(o of t){if(n)return;e(o)}i?.()}catch(t){r?.(t)}})())&&(t=>n=1),g.register(t,o),o);var s},w=t=>t&&t[k],k=Symbol("signal-struct");function S(t,e){if(w(t)&&!e)return t;if(A(t)){const n=Object.create(e||Object.getPrototypeOf(t)),o={},s=Object.getOwnPropertyDescriptors(t);for(let t in s){let e=s[t];if(e.get){let r=o[t]=new h(e.get.bind(n));Object.defineProperty(n,t,{get:()=>r.value,set:e.set?.bind(n),configurable:!1,enumerable:!0})}else{let s=e.value,l=(i=s)&&!!(i[Symbol.observable]||i[Symbol.asyncIterator]||i.call&&i.set||i.subscribe||i.then),f=o[t]=(r=s)&&r.peek?s:new a(l?void 0:A(s)?Object.seal(S(s)):Array.isArray(s)?S(s):s);l&&m(s,(t=>f.value=t)),Object.defineProperty(n,t,{get:()=>f.value,set(t){if(A(t)){if(A(f.value))try{return void Object.assign(f.value,t)}catch(t){}f.value=Object.seal(S(t))}else Array.isArray(t)?f.value=S(t):f.value=t},enumerable:!0,configurable:!1})}}return Object.defineProperty(n,k,{configurable:!1,enumerable:!1,value:!0}),n}var r,i;if(Array.isArray(t)&&!w(t[0]))for(let e=0;e<t.length;e++)t[e]=S(t[e]);return t}function A(t){return t&&t.constructor===Object}S.isStruct=w;var x={},O={},j={},N=t=>null===t?O:void 0===t?j:"number"==typeof t||t instanceof Number?x[t]||(x[t]=new Number(t)):"string"==typeof t||t instanceof String?x[t]||(x[t]=new String(t)):"boolean"==typeof t||t instanceof Boolean?x[t]||(x[t]=new Boolean(t)):t,E={},W={};E.if=(t,e)=>{let r=document.createTextNode(""),i=[_(t,e,":if")],n=[t],o=t;for(;(o=t.nextElementSibling)&&o.hasAttribute(":else");)o.removeAttribute(":else"),(e=o.getAttribute(":if"))?(o.removeAttribute(":if"),o.remove(),n.push(o),i.push(_(t,e,":else :if"))):(o.remove(),n.push(o),i.push((()=>1)));return t.replaceWith(o=r),t=>{let e=i.findIndex((e=>e(t)));n[e]!=o&&((o[$]||o).replaceWith(o=n[e]||r),F(o,t))}},E.with=(t,e,r)=>{F(t,S(_(t,e,"with")(r),r))};var $=Symbol(":each");E.each=(t,e)=>{let r=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(!r)return L(new Error,t,e);const i=t[$]=document.createTextNode("");t.replaceWith(i);const n=_(t,r[2],":each"),o=t.getAttribute(":key"),s=o?_(null,o):null;t.removeAttribute(":key");const l=new WeakMap,a=new WeakMap;let f=[];return o=>{let u=n(o);u?"number"==typeof u?u=Array.from({length:u},((t,e)=>[e,e+1])):Array.isArray(u)?u=u.map(((t,e)=>[e+1,t])):"object"==typeof u?u=Object.entries(u):L(Error("Bad list value"),t,e,":each"):u=[];let c=[],h=[];for(let[e,i]of u){let n,f,u=s?.({[r[0]]:i,[r[1]]:e});("string"==typeof(v=u)||"boolean"==typeof v||"number"==typeof v)&&(u=N(u)),null==u?n=t.cloneNode(!0):(n=a.get(u))||a.set(u,n=t.cloneNode(!0)),c.push(n),null!=u&&(f=l.get(u))?f[r[0]]=i:(f=S({[r[0]]:i,[r[1]]:e},o),null!=u&&l.set(u,f)),h.push(f)}var v;!function(t,e,r,i){const n=new Map,o=new Map;let s,l;for(s=0;s<e.length;s++)n.set(e[s],s);for(s=0;s<r.length;s++)o.set(r[s],s);for(s=l=0;s!==e.length||l!==r.length;){var a=e[s],f=r[l];if(null===a)s++;else if(r.length<=l)t.removeChild(e[s]),s++;else if(e.length<=s)t.insertBefore(f,e[s]||i),l++;else if(a===f)s++,l++;else{var u=o.get(a),c=n.get(f);void 0===u?(t.removeChild(e[s]),s++):void 0===c?(t.insertBefore(f,e[s]||i),l++):(t.insertBefore(e[c],e[s]||i),e[c]=null,c>s+1&&s++,l++)}}}(i.parentNode,f,c,i),f=c;for(let t=0;t<c.length;t++)F(c[t],h[t])}},W.ref=(t,e,r)=>{r[e]=t},W.id=(t,e)=>{let r=_(t,e,":id");return e=>{return i=r(e),t.id=i||0===i?i:"";var i}},W.class=(t,e)=>{let r=_(t,e,":class"),i=t.className;return e=>{let n=r(e),o="string"==typeof n?n:(Array.isArray(n)?n:Object.entries(n).map((([t,e])=>e?t:""))).filter(Boolean).join(" ");t.className=[i,o].filter(Boolean).join(" ")}},W.style=(t,e)=>{let r=_(t,e,":style"),i=t.getAttribute("style")||"";return i.endsWith(";")||(i+="; "),e=>{let n=r(e);if("string"==typeof n)t.setAttribute("style",i+n);else{t.setAttribute("style",i);for(let e in n)t.style.setProperty(e,n[e])}}},W.text=(t,e)=>{let r=_(t,e,":text");return e=>{let i=r(e);t.textContent=null==i?"":i}},W.data=(t,e)=>{let r=_(t,e,":data");return e=>{let i=r(e);for(let e in i)t.dataset[e]=i[e]}},W.aria=(t,e)=>{let r=_(t,e,":aria");return e=>(e=>{for(let r in e)U(t,"aria-"+R(r),null==e[r]?null:e[r]+"")})(r(e))},W[""]=(t,e)=>{let r=_(t,e,":");if(r)return e=>{let i=r(e);for(let e in i)U(t,R(e),i[e])}},W.value=(t,e)=>{let r,i,n=_(t,e,":value"),o="text"===t.type||""===t.type?e=>t.setAttribute("value",t.value=null==e?"":e):"TEXTAREA"===t.tagName||"text"===t.type||""===t.type?e=>(r=t.selectionStart,i=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),r&&t.setSelectionRange(r,i)):"checkbox"===t.type?e=>(t.value=e?"on":"",U(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 t=>o(n(t))},W.on=(t,e)=>{let r=_(t,e,":on");return e=>{let i=r(e),n=[];for(let e in i)n.push(B(t,e,i[e]));return()=>{for(let t of n)t()}}};var C=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),o=_(t,e,":"+i);if(o)return n?e=>{let r=o(e)||(()=>{});return B(t,n,r)}:e=>U(t,i,o(e))},B=(t,e,r)=>{if(!r)return;let i=e.split("..").map((e=>{let r={evt:"",target:t,test:()=>!0};return r.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,i="")=>(r.test=P[e]?.(r,...i.split("-"))||r.test,""))),r}));if(1==i.length)return s(r,i[0]);const n=(e,r=0)=>{let o;return o=s((s=>{r&&o();let l=e.call(t,s);"function"!=typeof l&&(l=()=>{}),r+1<i.length&&n(l,r?r+1:1)}),i[r])};let o=n(r);return()=>o();function s(t,{evt:e,target:r,test:i,defer:n,stop:o,prevent:s,...l}){n&&(t=n(t));let a=e=>i(e)&&(o&&e.stopPropagation(),s&&e.preventDefault(),t.call(r,e));return r.addEventListener(e,a,l),()=>r.removeEventListener(e,a,l)}},P={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},toggle(t){t.defer=(e,r)=>i=>r?(r.call?.(t.target,i),r=null):r=e()},throttle(t,e){t.defer=t=>D(t,e?Number(e)||0:108)},debounce(t,e){t.defer=t=>M(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=>T.ctrl(t)&&e.every((e=>T[e]?T[e](t):t.key===e)),shift:(t,...e)=>t=>T.shift(t)&&e.every((e=>T[e]?T[e](t):t.key===e)),alt:(t,...e)=>t=>T.alt(t)&&e.every((e=>T[e]?T[e](t):t.key===e)),meta:(t,...e)=>t=>T.meta(t)&&e.every((e=>T[e]?T[e](t):t.key===e)),arrow:t=>T.arrow,enter:t=>T.enter,escape:t=>T.escape,tab:t=>T.tab,space:t=>T.space,backspace:t=>T.backspace,delete:t=>T.delete,digit:t=>T.digit,letter:t=>T.letter,character:t=>T.character},T={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)},D=(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))},M=(t,e)=>{let r;return i=>{clearTimeout(r),r=setTimeout((()=>{r=null,t(i)}),e)}},U=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},K={};function _(t,e,r){let i=K[e];if(!i){let n=/^[\n\s]*if.*\(.*\)/.test(e)||/\b(let|const)\s/.test(e)?`(() => { ${e} })()`:e;try{i=K[e]=new Function("__scope",`with (__scope) { return ${n.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),setTimeout((()=>{throw t}),0)}function R(t){return t.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase()))}var z=new WeakMap;function F(t,r){if(!t.children)return;if(z.has(t)){let i=z.get(t);return function(t){if(n>0)return t();n++;try{t()}finally{e()}}((()=>Object.assign(i,r))),i}const i=S(r||{}),o=[],s=(t,e=t.parentNode)=>{for(let r in E){let n=":"+r;if(t.hasAttribute?.(n)){let s=t.getAttribute(n);if(t.removeAttribute(n),o.push(E[r](t,s,i,r)),z.has(t)||t.parentNode!==e)return!1}}if(t.attributes)for(let r=0;r<t.attributes.length;){let n=t.attributes[r];if(":"!==n.name[0]){r++;continue}t.removeAttribute(n.name);let s=n.value,l=n.name.slice(1).split(":");for(let r of l){let n=W[r]||C;if(o.push(n(t,s,i,r)),z.has(t)||t.parentNode!==e)return!1}}for(let e,r=0;e=t.children[r];r++)!1===s(e,t)&&r--};s(t);for(let t of o)if(t){let e;b((()=>{"function"==typeof e&&e(),e=t(i)}))}return Object.seal(i),z.set(t,i),i}var I=F;export{I as default};
+function t(){throw new Error("Cycle detected")}function e(){if(n>1)n--;else{for(var t,e=!1;void 0!==i;){var r=i;for(i=void 0,s++;void 0!==r;){var o=r.o;if(r.o=void 0,r.f&=-3,!(8&r.f)&&u(r))try{r.c()}catch(r){e||(t=r,e=!0)}r=o}}if(s=0,n--,e)throw t}}var r=void 0,i=void 0,n=0,s=0,o=0;function l(t){if(void 0!==r){var e=t.n;if(void 0===e||e.t!==r)return e={i:0,S:t,p:r.s,n:void 0,t:r,e:void 0,x:void 0,r:e},void 0!==r.s&&(r.s.n=e),r.s=e,t.n=e,32&r.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=r.s,e.n=void 0,r.s.n=e,r.s=e),e}}function a(t){this.v=t,this.i=0,this.n=void 0,this.t=void 0}function u(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 f(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 c(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 h(t){a.call(this,void 0),this.x=t,this.s=void 0,this.g=o-1,this.f=4}function v(t){var i=t.u;if(t.u=void 0,"function"==typeof i){n++;var s=r;r=void 0;try{i()}catch(e){throw t.f&=-2,t.f|=8,p(t),e}finally{r=s,e()}}}function p(t){for(var e=t.s;void 0!==e;e=e.n)e.S.U(e);t.x=void 0,t.s=void 0,v(t)}function d(t){if(r!==this)throw new Error("Out-of-order effect");c(this),r=t,this.f&=-2,8&this.f&&p(this),e()}function y(t){this.x=t,this.u=void 0,this.s=void 0,this.o=void 0,this.f=32}function b(t){var e=new y(t);try{e.c()}catch(t){throw e.d(),t}return e.d.bind(e)}a.prototype.h=function(){return!0},a.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)},a.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)}},a.prototype.subscribe=function(t){var e=this;return b((function(){var r=e.value,i=32&this.f;this.f&=-33;try{t(r)}finally{this.f|=i}}))},a.prototype.valueOf=function(){return this.value},a.prototype.toString=function(){return this.value+""},a.prototype.peek=function(){return this.v},Object.defineProperty(a.prototype,"value",{get:function(){var t=l(this);return void 0!==t&&(t.i=this.i),this.v},set:function(r){if(r!==this.v){s>100&&t(),this.v=r,this.i++,o++,n++;try{for(var i=this.t;void 0!==i;i=i.x)i.t.N()}finally{e()}}}}),(h.prototype=new a).h=function(){if(this.f&=-3,1&this.f)return!1;if(32==(36&this.f))return!0;if(this.f&=-5,this.g===o)return!0;if(this.g=o,this.f|=1,this.i>0&&!u(this))return this.f&=-2,!0;var t=r;try{f(this),r=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 r=t,c(this),this.f&=-2,!0},h.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)}a.prototype.S.call(this,t)},h.prototype.U=function(t){if(void 0!==this.t&&(a.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)}},h.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(var t=this.t;void 0!==t;t=t.x)t.t.N()}},h.prototype.peek=function(){if(this.h()||t(),16&this.f)throw this.v;return this.v},Object.defineProperty(h.prototype,"value",{get:function(){1&this.f&&t();var e=l(this);if(this.h(),void 0!==e&&(e.i=this.i),16&this.f)throw this.v;return this.v}}),y.prototype.c=function(){var t=this.S();try{8&this.f||void 0===this.x||(this.u=this.x())}finally{t()}},y.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,v(this),f(this),n++;var e=r;return r=this,d.bind(this,e)},y.prototype.N=function(){2&this.f||(this.f|=2,this.o=i,i=this)},y.prototype.d=function(){this.f|=8,1&this.f||p(this)},Symbol.observable||=Symbol("observable");var g=new FinalizationRegistry((t=>t.call?.())),m=(t,e,r,i,n,s)=>{return t&&(o=(t[Symbol.observable]?.()||t).subscribe?.(e,r,i),s=o&&(()=>o.unsubscribe?.())||t.set&&t.call?.(n,e)||(t.then?.((t=>(!n&&e(t),i?.())),r)||(async s=>{try{for await(s of t){if(n)return;e(s)}i?.()}catch(t){r?.(t)}})())&&(t=>n=1),g.register(t,s),s);var o},w=t=>t&&t[k],k=Symbol("signal-struct");function A(t,e){if(w(t)&&!e)return t;if(S(t)){const n=Object.create(e||Object.getPrototypeOf(t)),s={},o=Object.getOwnPropertyDescriptors(t);for(let t in o){let e=o[t];if(e.get){let r=s[t]=new h(e.get.bind(n));Object.defineProperty(n,t,{get:()=>r.value,set:e.set?.bind(n),configurable:!1,enumerable:!0})}else{let o=e.value,l=(i=o)&&!!(i[Symbol.observable]||i[Symbol.asyncIterator]||i.call&&i.set||i.subscribe||i.then),u=s[t]=(r=o)&&r.peek?o:new a(l?void 0:S(o)?Object.seal(A(o)):Array.isArray(o)?A(o):o);l&&m(o,(t=>u.value=t)),Object.defineProperty(n,t,{get:()=>u.value,set(t){if(S(t)){if(S(u.value))try{return void Object.assign(u.value,t)}catch(t){}u.value=Object.seal(A(t))}else Array.isArray(t)?u.value=A(t):u.value=t},enumerable:!0,configurable:!1})}}return Object.defineProperty(n,k,{configurable:!1,enumerable:!1,value:!0}),n}var r,i;if(Array.isArray(t)&&!w(t[0]))for(let e=0;e<t.length;e++)t[e]=A(t[e]);return t}function S(t){return t&&t.constructor===Object}A.isStruct=w;var x=new WeakMap,O=class extends Map{#t=new FinalizationRegistry((t=>super.delete(t)));get size(){return[...this].length}constructor(t=[]){super();for(const[e,r]of t)this.set(e,r)}get(t){return super.get(t)?.deref()}set(t,e){let r=super.get(t);return r&&this.#t.unregister(r),r=(t=>x.get(t)||(t=>{const e=new WeakRef(t);return x.set(t,e),e})(t))(e),this.#t.register(e,t,r),super.set(t,r)}},j={},N={};j.if=(t,e)=>{let r=document.createTextNode(""),i=[U(t,e,":if")],n=[t],s=t;for(;(s=t.nextElementSibling)&&s.hasAttribute(":else");)s.removeAttribute(":else"),(e=s.getAttribute(":if"))?(s.removeAttribute(":if"),s.remove(),n.push(s),i.push(U(t,e,":else :if"))):(s.remove(),n.push(s),i.push((()=>1)));return t.replaceWith(s=r),t=>{let e=i.findIndex((e=>e(t)));n[e]!=s&&((s[E]||s).replaceWith(s=n[e]||r),_(s,t))}},j.with=(t,e,r)=>{_(t,A(U(t,e,"with")(r),r))};var E=Symbol(":each");j.each=(t,e)=>{let r=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(),s=n.match(e);return s?[n.replace(e,"").trim(),s[1].trim(),i]:[n,"",i]}(e);if(!r)return R(new Error,t,e);const i=t[E]=document.createTextNode("");t.replaceWith(i);const n=U(t,r[2],":each"),s=t.getAttribute(":key"),o=s?U(null,s):null;t.removeAttribute(":key");const l=new O,a=new O;let u=[];return s=>{let f=n(s);f?"number"==typeof f?f=Array.from({length:f},((t,e)=>[e,e+1])):Array.isArray(f)?f=f.map(((t,e)=>[e+1,t])):"object"==typeof f?f=Object.entries(f):R(Error("Bad list value"),t,e,":each"):f=[];let c=[],h=[];for(let[e,i]of f){let n,u,f=o?.({[r[0]]:i,[r[1]]:e});null==f?n=t.cloneNode(!0):(n=a.get(f))||a.set(f,n=t.cloneNode(!0)),c.push(n),null!=f&&(u=l.get(f))?u[r[0]]=i:(u=A({[r[0]]:i,[r[1]]:e},s),null!=f&&l.set(f,u)),h.push(u)}!function(t,e,r,i){const n=new Map,s=new Map;let o,l;for(o=0;o<e.length;o++)n.set(e[o],o);for(o=0;o<r.length;o++)s.set(r[o],o);for(o=l=0;o!==e.length||l!==r.length;){var a=e[o],u=r[l];if(null===a)o++;else if(r.length<=l)t.removeChild(e[o]),o++;else if(e.length<=o)t.insertBefore(u,e[o]||i),l++;else if(a===u)o++,l++;else{var f=s.get(a),c=n.get(u);void 0===f?(t.removeChild(e[o]),o++):void 0===c?(t.insertBefore(u,e[o]||i),l++):(t.insertBefore(e[c],e[o]||i),e[c]=null,c>o+1&&o++,l++)}}}(i.parentNode,u,c,i),u=c;for(let t=0;t<c.length;t++)_(c[t],h[t])}},N.ref=(t,e,r)=>{r[e]=t},N.id=(t,e)=>{let r=U(t,e,":id");return e=>{return i=r(e),t.id=i||0===i?i:"";var i}},N.class=(t,e)=>{let r=U(t,e,":class"),i=t.className;return e=>{let n=r(e),s="string"==typeof n?n:(Array.isArray(n)?n:Object.entries(n).map((([t,e])=>e?t:""))).filter(Boolean).join(" ");t.className=[i,s].filter(Boolean).join(" ")}},N.style=(t,e)=>{let r=U(t,e,":style"),i=t.getAttribute("style")||"";return i.endsWith(";")||(i+="; "),e=>{let n=r(e);if("string"==typeof n)t.setAttribute("style",i+n);else{t.setAttribute("style",i);for(let e in n)t.style.setProperty(e,n[e])}}},N.text=(t,e)=>{let r=U(t,e,":text");return e=>{let i=r(e);t.textContent=null==i?"":i}},N.data=(t,e)=>{let r=U(t,e,":data");return e=>{let i=r(e);for(let e in i)t.dataset[e]=i[e]}},N.aria=(t,e)=>{let r=U(t,e,":aria");return e=>(e=>{for(let r in e)D(t,"aria-"+z(r),null==e[r]?null:e[r]+"")})(r(e))},N[""]=(t,e)=>{let r=U(t,e,":");if(r)return e=>{let i=r(e);for(let e in i)D(t,z(e),i[e])}},N.value=(t,e)=>{let r,i,n=U(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=>(r=t.selectionStart,i=t.selectionEnd,t.setAttribute("value",t.value=null==e?"":e),r&&t.setSelectionRange(r,i)):"checkbox"===t.type?e=>(t.value=e?"on":"",D(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 t=>s(n(t))},N.on=(t,e)=>{let r=U(t,e,":on");return e=>{let i=r(e),n=[];for(let e in i)n.push($(t,e,i[e]));return()=>{for(let t of n)t()}}};var W=(t,e,r,i)=>{let n=i.startsWith("on")&&i.slice(2),s=U(t,e,":"+i);if(s)return n?e=>{let r=s(e)||(()=>{});return $(t,n,r)}:e=>D(t,i,s(e))},$=(t,e,r)=>{if(!r)return;let i=e.split("..").map((e=>{let r={evt:"",target:t,test:()=>!0};return r.evt=(e.startsWith("on")?e.slice(2):e).replace(/\.(\w+)?-?([-\w]+)?/g,((t,e,i="")=>(r.test=C[e]?.(r,...i.split("-"))||r.test,""))),r}));if(1==i.length)return o(r,i[0]);const n=(e,r=0)=>{let s;return s=o((o=>{r&&s();let l=e.call(t,o);"function"!=typeof l&&(l=()=>{}),r+1<i.length&&n(l,r?r+1:1)}),i[r])};let s=n(r);return()=>s();function o(t,{evt:e,target:r,test:i,defer:n,stop:s,prevent:o,...l}){n&&(t=n(t));let a=e=>i(e)&&(s&&e.stopPropagation(),o&&e.preventDefault(),t.call(r,e));return r.addEventListener(e,a,l),()=>r.removeEventListener(e,a,l)}},C={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},toggle(t){t.defer=(e,r)=>i=>r?(r.call?.(t.target,i),r=null):r=e()},throttle(t,e){t.defer=t=>T(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=>P.ctrl(t)&&e.every((e=>P[e]?P[e](t):t.key===e)),shift:(t,...e)=>t=>P.shift(t)&&e.every((e=>P[e]?P[e](t):t.key===e)),alt:(t,...e)=>t=>P.alt(t)&&e.every((e=>P[e]?P[e](t):t.key===e)),meta:(t,...e)=>t=>P.meta(t)&&e.every((e=>P[e]?P[e](t):t.key===e)),arrow:t=>P.arrow,enter:t=>P.enter,escape:t=>P.escape,tab:t=>P.tab,space:t=>P.space,backspace:t=>P.backspace,delete:t=>P.delete,digit:t=>P.digit,letter:t=>P.letter,character:t=>P.character},P={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)},T=(t,e)=>{let r,i,n=s=>{r=!0,setTimeout((()=>{if(r=!1,i)return i=!1,n(s),t(s)}),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)}},D=(t,e,r)=>{null==r||!1===r?t.removeAttribute(e):t.setAttribute(e,!0===r?"":"number"==typeof r||"string"==typeof r?r:"")},M={};function U(t,e,r){let i=M[e];if(!i){let n=/^[\n\s]*if.*\(.*\)/.test(e)||/\b(let|const)\s/.test(e)&&!r.startsWith(":on")?`(() => {${e}})()`:e;try{i=M[e]=new Function("__scope",`with (__scope) { return ${n.trim()} };`)}catch(i){return R(i,t,e,r)}}return n=>{let s;try{s=i.call(t,n)}catch(i){return R(i,t,e,r)}return s}}function R(t,e,r,i){Object.assign(t,{element:e,expression:r}),console.warn(`∴ ${t.message}\n\n${i}=${r?`"${r}"\n\n`:""}`,e),setTimeout((()=>{throw t}),0)}function z(t){return t.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(t=>"-"+t.toLowerCase()))}var K=new WeakMap;function _(t,r){if(!t.children)return;if(K.has(t)){let i=K.get(t);return function(t){if(n>0)return t();n++;try{t()}finally{e()}}((()=>Object.assign(i,r))),i}const i=A(r||{}),s=[],o=(t,e=t.parentNode)=>{for(let r in j){let n=":"+r;if(t.hasAttribute?.(n)){let o=t.getAttribute(n);if(t.removeAttribute(n),s.push(j[r](t,o,i,r)),K.has(t)||t.parentNode!==e)return!1}}if(t.attributes)for(let r=0;r<t.attributes.length;){let n=t.attributes[r];if(":"!==n.name[0]){r++;continue}t.removeAttribute(n.name);let o=n.value,l=n.name.slice(1).split(":");for(let r of l){let n=N[r]||W;if(s.push(n(t,o,i,r)),K.has(t)||t.parentNode!==e)return!1}}for(let e,r=0;e=t.children[r];r++)!1===o(e,t)&&r--};o(t);for(let t of s)if(t){let e;b((()=>{"function"==typeof e&&e(),e=t(i)}))}return Object.seal(i),K.set(t,i),i}var F=_;export{F as default};

package/src/directives.js

@@ -2,7 +2,7 @@
 import sprae from './core.js'
 import swap from './domdiff.js'
 import signalStruct from 'signal-struct'
-import p from 'primitive-pool'
+import { WeakishMap } from './weakish-map.js'
 
 // reserved directives - order matters!
 // primary initialized first by selector, secondary initialized by iterating attributes
@@ -69,8 +69,8 @@ primary['each'] = (tpl, expr) => {
   tpl.removeAttribute(':key')
 
 
-  const scopes = new WeakMap() // stores scope per data item
-  const itemEls = new WeakMap() // element per data item
+  const scopes = new WeakishMap() // stores scope per data item
+  const itemEls = new WeakishMap() // element per data item
   let curEls = []
 
   return (state) => {
@@ -88,7 +88,6 @@ primary['each'] = (tpl, expr) => {
 
     for (let [idx, item] of list) {
       let el, scope, key = itemKey?.({[each[0]]: item, [each[1]]: idx})
-      if (isPrimitive(key)) key = p(key); // singletonize key
 
       // we consider if data items are primitive, then nodes needn't be cached
       // since likely they're very simple to create
@@ -107,7 +106,6 @@ primary['each'] = (tpl, expr) => {
       elScopes.push(scope)
     }
 
-    // swap is really fast & tiny
     swap(holder.parentNode, curEls, newEls, holder)
     curEls = newEls
 
@@ -422,8 +420,8 @@ function parseExpr(el, expression, dir) {
       // Support expressions starting with "if" statements like: "if (...) doSomething()"
       || /^[\n\s]*if.*\(.*\)/.test(expression)
       // Support expressions starting with "let/const" like: "let foo = 'bar'"
-      || /\b(let|const)\s/.test(expression)
-          ? `(() => { ${expression} })()`
+      || (/\b(let|const)\s/.test(expression) && !dir.startsWith(':on'))
+          ? `(() => {${expression}})()`
           : expression;
 
     try {
@@ -451,7 +449,3 @@ function exprError(error, element, expression, dir) {
 function dashcase(str) {
 	return str.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (match) => '-' + match.toLowerCase());
 };
-
-function isPrimitive(obj) {
-  return typeof obj === 'string' || typeof obj === 'boolean' || typeof obj === 'number'
-}

package/src/weakish-map.js

@@ -0,0 +1,29 @@
+// based on https://github.com/WebReflection/not-so-weak/
+const refs = new WeakMap;
+
+const set = value => {
+  const ref = new WeakRef(value);
+  refs.set(value, ref);
+  return ref;
+};
+
+const get = value => refs.get(value) || set(value);
+
+export class WeakishMap extends Map {
+  #registry = new FinalizationRegistry(key => super.delete(key));
+  get size() { return [...this].length }
+  constructor(entries = []) {
+    super();
+    for (const [key, value] of entries) this.set(key, value);
+  }
+  get(key) {
+    return super.get(key)?.deref();
+  }
+  set(key, value) {
+    let ref = super.get(key);
+    if (ref) this.#registry.unregister(ref);
+    ref = get(value);
+    this.#registry.register(value, key, ref);
+    return super.set(key, ref);
+  }
+}

package/test/test.js

@@ -64,6 +64,13 @@ test('common: newlines', async () => {
   is(el.outerHTML, `<x>1</x>`)
 })
 
+test('common: const in on', async () => {
+  let el = h`<div :onx="() => {const x=1; y=x+1}"></div>`
+  let state = sprae(el, {y:0})
+  el.dispatchEvent(new CustomEvent('x'))
+  is(state.y, 2)
+})
+
 test('style', async () => {
   let el = h`<x style="left: 1px" :style="style"></x>`
   let params = sprae(el, {style: "top: 1px"})
@@ -113,7 +120,7 @@ test('props: multiprop', async () => {
 })
 
 // FIXME: this must work without return
-test.todo('props: calculation', async () => {
+test('props: calculation', async () => {
   let el = h`<x :x="let a = 5; return Array.from({length: x}, (_,i)=>i).join('')"></x>`
   let state = sprae(el, {x:3});
   is(el.outerHTML, `<x x="012"></x>`)