sprae 2.12.3 → 2.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/r&d.md +17 -1
- package/sprae.js +19 -14
- package/sprae.min.js +1 -1
- package/src/directives.js +16 -10
- package/test/test.js +52 -15
- package/todo.md +2 -1
package/package.json
CHANGED
package/r&d.md
CHANGED
|
@@ -496,4 +496,20 @@
|
|
|
496
496
|
- conflicts with `:_target="blank"`
|
|
497
497
|
|
|
498
498
|
5. `:x="this.x=value"`
|
|
499
|
-
+ yepyepyep
|
|
499
|
+
+ yepyepyep
|
|
500
|
+
|
|
501
|
+
## [ ] Multiple chain events resolution:
|
|
502
|
+
* Consider
|
|
503
|
+
```
|
|
504
|
+
:onclick..onclick="play"
|
|
505
|
+
:onkeydown.document.alt-space..onkeydown.document.alt-space="play"
|
|
506
|
+
```
|
|
507
|
+
* When started by click and ended by alt-space, it doesn't clear the onclick
|
|
508
|
+
* We actually want here `:onclick:onkeydown.document.alt-space..onclick:onkeydown.document.alt-space`.
|
|
509
|
+
- this makes inconsistency of `..onclick` - colon is missing
|
|
510
|
+
- also it makes precedence of `:` and `..` unclear - what comes before what after.
|
|
511
|
+
|
|
512
|
+
? Can we use `:onclick.toggle="play"`?
|
|
513
|
+
- it doesn't help with switch-over
|
|
514
|
+
? Some 'or' character `:onclick--onkeydown`
|
|
515
|
+
? We can redirect to main event, that's it
|
package/sprae.js
CHANGED
|
@@ -404,7 +404,7 @@ function signalStruct(values, proto) {
|
|
|
404
404
|
},
|
|
405
405
|
set(v2) {
|
|
406
406
|
if (isObject(v2)) {
|
|
407
|
-
if (isObject(s2.value))
|
|
407
|
+
if (isObject(s2.value) && Object.keys(s2.value).join(" ") === Object.keys(v2).join(" "))
|
|
408
408
|
try {
|
|
409
409
|
Object.assign(s2.value, v2);
|
|
410
410
|
return;
|
|
@@ -620,7 +620,8 @@ secondary["class"] = (el, expr) => {
|
|
|
620
620
|
let initClassName = el.className;
|
|
621
621
|
return (state) => {
|
|
622
622
|
let v2 = evaluate(state);
|
|
623
|
-
|
|
623
|
+
let className = typeof v2 === "string" ? v2 : (Array.isArray(v2) ? v2 : Object.entries(v2).map(([k, v3]) => v3 ? k : "")).filter(Boolean).join(" ");
|
|
624
|
+
el.className = [initClassName, className].filter(Boolean).join(" ");
|
|
624
625
|
};
|
|
625
626
|
};
|
|
626
627
|
secondary["style"] = (el, expr) => {
|
|
@@ -632,9 +633,11 @@ secondary["style"] = (el, expr) => {
|
|
|
632
633
|
let v2 = evaluate(state);
|
|
633
634
|
if (typeof v2 === "string")
|
|
634
635
|
el.setAttribute("style", initStyle + v2);
|
|
635
|
-
else
|
|
636
|
+
else {
|
|
637
|
+
el.setAttribute("style", initStyle);
|
|
636
638
|
for (let k in v2)
|
|
637
639
|
el.style.setProperty(k, v2[k]);
|
|
640
|
+
}
|
|
638
641
|
};
|
|
639
642
|
};
|
|
640
643
|
secondary["text"] = (el, expr) => {
|
|
@@ -707,6 +710,8 @@ var directives_default = (el, expr, state, name) => {
|
|
|
707
710
|
return (state2) => attr(el, name, evaluate(state2));
|
|
708
711
|
};
|
|
709
712
|
var on = (target, evt, origFn) => {
|
|
713
|
+
if (!origFn)
|
|
714
|
+
return;
|
|
710
715
|
let ctxs = evt.split("..").map((e2) => {
|
|
711
716
|
let ctx = { evt: "", target, test: () => true };
|
|
712
717
|
ctx.evt = (e2.startsWith("on") ? e2.slice(2) : e2).replace(
|
|
@@ -717,22 +722,22 @@ var on = (target, evt, origFn) => {
|
|
|
717
722
|
});
|
|
718
723
|
if (ctxs.length == 1)
|
|
719
724
|
return addListener(origFn, ctxs[0]);
|
|
720
|
-
|
|
721
|
-
|
|
725
|
+
const onFn = (fn, cur = 0) => {
|
|
726
|
+
let off;
|
|
722
727
|
let curListener = (e2) => {
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
728
|
+
if (cur)
|
|
729
|
+
off();
|
|
730
|
+
let nextFn = fn.call(target, e2);
|
|
731
|
+
if (typeof nextFn !== "function")
|
|
732
|
+
nextFn = () => {
|
|
726
733
|
};
|
|
727
|
-
if (
|
|
728
|
-
|
|
729
|
-
else
|
|
730
|
-
nextEvt(origFn);
|
|
734
|
+
if (cur + 1 < ctxs.length)
|
|
735
|
+
onFn(nextFn, !cur ? 1 : cur + 1);
|
|
731
736
|
};
|
|
732
737
|
return off = addListener(curListener, ctxs[cur]);
|
|
733
738
|
};
|
|
734
|
-
|
|
735
|
-
return () =>
|
|
739
|
+
let rootOff = onFn(origFn);
|
|
740
|
+
return () => rootOff();
|
|
736
741
|
function addListener(fn, { evt: evt2, target: target2, test, defer, stop, prevent, ...opts }) {
|
|
737
742
|
if (defer)
|
|
738
743
|
fn = defer(fn);
|
package/sprae.min.js
CHANGED
|
@@ -1 +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 r.s=e={i:0,S:t,p:void 0,n:r.s,t:r,e:void 0,x:void 0,r:e},t.n=e,32&r.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.p&&(e.p.n=e.n,void 0!==e.n&&(e.n.p=e.p),e.p=void 0,e.n=r.s,r.s.p=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;void 0!==r&&(e.r=r),e.S.n=e,e.i=-1}}function c(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.n;-1===e.i?(e.S.U(e),e.n=void 0):(void 0!==r&&(r.p=e),e.p=void 0,e.n=r,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 y(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 d(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 d(t);return e.c(),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){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(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}}),d.prototype.c=function(){var t=this.S();try{8&this.f||void 0===this.x||(this.u=this.x())}finally{t()}},d.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,v(this),u(this),n++;var e=r;return r=this,y.bind(this,e)},d.prototype.N=function(){2&this.f||(this.f|=2,this.o=i,i=this)},d.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[S],S=Symbol("signal-struct");function k(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(k(s)):Array.isArray(s)?k(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(k(t))}else Array.isArray(t)?f.value=k(t):f.value=t},enumerable:!0,configurable:!1})}}return Object.defineProperty(n,S,{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]=k(t[e]);return t}function A(t){return t&&t.constructor===Object}k.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,k(_(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=k({[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);t.className=i+typeof n=="string"?n:(Array.isArray(n)?n:Object.entries(n).map((([t,e])=>e?t:""))).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 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(P(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 P(t,n,r)}:e=>U(t,i,o(e))},P=(t,e,r)=>{let i,n=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=T[e]?.(r,...i.split("-"))||r.test,""))),r}));if(1==n.length)return s(r,n[0]);const o=(e,l=0)=>i=s((s=>{i(),"function"!=typeof(e=e.call(t,s))&&(e=()=>{}),++l<n.length?o(e,l):o(r)}),n[l]);return o(r),()=>i();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)}},T={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=>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=>B.ctrl(t)&&e.every((e=>B[e]?B[e](t):t.key===e)),shift:(t,...e)=>t=>B.shift(t)&&e.every((e=>B[e]?B[e](t):t.key===e)),alt:(t,...e)=>t=>B.alt(t)&&e.every((e=>B[e]?B[e](t):t.key===e)),meta:(t,...e)=>t=>B.meta(t)&&e.every((e=>B[e]?B[e](t):t.key===e)),arrow:t=>B.arrow,enter:t=>B.enter,escape:t=>B.escape,tab:t=>B.tab,space:t=>B.space,backspace:t=>B.backspace,delete:t=>B.delete,digit:t=>B.digit,letter:t=>B.letter,character:t=>B.character},B={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} };`)}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=k(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};
|
|
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 r.s=e={i:0,S:t,p:void 0,n:r.s,t:r,e:void 0,x:void 0,r:e},t.n=e,32&r.f&&t.S(e),e;if(-1===e.i)return e.i=0,void 0!==e.p&&(e.p.n=e.n,void 0!==e.n&&(e.n.p=e.p),e.p=void 0,e.n=r.s,r.s.p=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;void 0!==r&&(e.r=r),e.S.n=e,e.i=-1}}function c(t){for(var e=t.s,r=void 0;void 0!==e;){var i=e.n;-1===e.i?(e.S.U(e),e.n=void 0):(void 0!==r&&(r.p=e),e.p=void 0,e.n=r,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 y(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 d(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 d(t);return e.c(),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){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(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}}),d.prototype.c=function(){var t=this.S();try{8&this.f||void 0===this.x||(this.u=this.x())}finally{t()}},d.prototype.S=function(){1&this.f&&t(),this.f|=1,this.f&=-9,v(this),u(this),n++;var e=r;return r=this,y.bind(this,e)},d.prototype.N=function(){2&this.f||(this.f|=2,this.o=i,i=this)},d.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)&&Object.keys(f.value).join(" ")===Object.keys(t).join(" "))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={},j={},O={},N=t=>null===t?j:void 0===t?O:"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},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} };`)}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};
|
package/src/directives.js
CHANGED
|
@@ -158,7 +158,8 @@ secondary['class'] = (el, expr) => {
|
|
|
158
158
|
let initClassName = el.className
|
|
159
159
|
return (state) => {
|
|
160
160
|
let v = evaluate(state)
|
|
161
|
-
|
|
161
|
+
let className = typeof v === 'string' ? v : (Array.isArray(v) ? v : Object.entries(v).map(([k,v])=>v?k:'')).filter(Boolean).join(' ')
|
|
162
|
+
el.className = [initClassName, className].filter(Boolean).join(' ');
|
|
162
163
|
}
|
|
163
164
|
}
|
|
164
165
|
|
|
@@ -169,7 +170,10 @@ secondary['style'] = (el, expr) => {
|
|
|
169
170
|
return (state) => {
|
|
170
171
|
let v = evaluate(state)
|
|
171
172
|
if (typeof v === 'string') el.setAttribute('style', initStyle + v)
|
|
172
|
-
else
|
|
173
|
+
else {
|
|
174
|
+
el.setAttribute('style', initStyle)
|
|
175
|
+
for (let k in v) el.style.setProperty(k, v[k])
|
|
176
|
+
}
|
|
173
177
|
}
|
|
174
178
|
}
|
|
175
179
|
|
|
@@ -263,6 +267,8 @@ export default (el, expr, state, name) => {
|
|
|
263
267
|
|
|
264
268
|
// bind event to target
|
|
265
269
|
const on = (target, evt, origFn) => {
|
|
270
|
+
if (!origFn) return
|
|
271
|
+
|
|
266
272
|
// ona..onb
|
|
267
273
|
let ctxs = evt.split('..').map(e => {
|
|
268
274
|
let ctx = { evt:'', target, test:()=>true };
|
|
@@ -277,18 +283,18 @@ const on = (target, evt, origFn) => {
|
|
|
277
283
|
if (ctxs.length == 1) return addListener(origFn, ctxs[0])
|
|
278
284
|
|
|
279
285
|
// events chain cycler
|
|
280
|
-
|
|
281
|
-
|
|
286
|
+
const onFn = (fn, cur=0) => {
|
|
287
|
+
let off
|
|
282
288
|
let curListener = e => {
|
|
283
|
-
off();
|
|
284
|
-
|
|
285
|
-
if (
|
|
286
|
-
|
|
289
|
+
if (cur) off(); // don't remove entry listener - we must keep chain entry always open
|
|
290
|
+
let nextFn = fn.call(target, e)
|
|
291
|
+
if (typeof nextFn !== 'function') nextFn = ()=>{}
|
|
292
|
+
if (cur+1 < ctxs.length) onFn(nextFn, !cur ? 1 : cur+1);
|
|
287
293
|
}
|
|
288
294
|
return off = addListener(curListener, ctxs[cur])
|
|
289
295
|
}
|
|
290
|
-
|
|
291
|
-
return () =>
|
|
296
|
+
let rootOff = onFn(origFn)
|
|
297
|
+
return () => rootOff()
|
|
292
298
|
|
|
293
299
|
// add listener applying the context
|
|
294
300
|
function addListener(fn, {evt, target, test, defer, stop, prevent, ...opts} ) {
|
package/test/test.js
CHANGED
|
@@ -65,17 +65,24 @@ test('style', async () => {
|
|
|
65
65
|
|
|
66
66
|
params.style = {'--x': 123}
|
|
67
67
|
is(el.style.getPropertyValue('--x'), '123')
|
|
68
|
+
|
|
69
|
+
params.style = {top:'1px', bottom:'2px'}
|
|
70
|
+
is(el.outerHTML, `<x style="left: 1px; top: 1px; bottom: 2px;"></x>`)
|
|
71
|
+
|
|
72
|
+
params.style = {top:'2px'}
|
|
73
|
+
// FIXME
|
|
74
|
+
is(el.outerHTML, `<x style="left: 1px; top: 2px;"></x>`)
|
|
68
75
|
})
|
|
69
76
|
|
|
70
77
|
test('class', async () => {
|
|
71
|
-
let el = h`<x :class="a"></x><y :class="[b, c]"></y><z :class="{b:true, c:d}"></z>`
|
|
78
|
+
let el = h`<x class="base" :class="a"></x><y :class="[b, c]"></y><z :class="{b:true, c:d}"></z>`
|
|
72
79
|
const c = signal('z')
|
|
73
80
|
let params = sprae(el, {a:'x', b:'y', c, d:false});
|
|
74
|
-
is(el.outerHTML, `<x class="x"></x><y class="y z"></y><z class="b"></z>`);
|
|
81
|
+
is(el.outerHTML, `<x class="base x"></x><y class="y z"></y><z class="b"></z>`);
|
|
75
82
|
params.d = true;
|
|
76
|
-
is(el.outerHTML, `<x class="x"></x><y class="y z"></y><z class="b c"></z>`);
|
|
83
|
+
is(el.outerHTML, `<x class="base x"></x><y class="y z"></y><z class="b c"></z>`);
|
|
77
84
|
c.value = 'w'
|
|
78
|
-
is(el.outerHTML, `<x class="x"></x><y class="y w"></y><z class="b c"></z>`);
|
|
85
|
+
is(el.outerHTML, `<x class="base x"></x><y class="y w"></y><z class="b c"></z>`);
|
|
79
86
|
})
|
|
80
87
|
|
|
81
88
|
test('props: base', async () => {
|
|
@@ -485,6 +492,7 @@ test('on: base', () => {
|
|
|
485
492
|
el.dispatchEvent(new window.Event('x'));
|
|
486
493
|
is(log.value, ['click','x','xx']);
|
|
487
494
|
|
|
495
|
+
console.log('make null')
|
|
488
496
|
params.x = null;
|
|
489
497
|
el.dispatchEvent(new window.Event('x'));
|
|
490
498
|
is(log.value, ['click','x','xx']);
|
|
@@ -552,11 +560,11 @@ test('on: in-out side-effects', e => {
|
|
|
552
560
|
el.dispatchEvent(new window.Event('in'));
|
|
553
561
|
is(log, ['in','out','in'])
|
|
554
562
|
el.dispatchEvent(new window.Event('in'));
|
|
555
|
-
is(log, ['in','out','in'])
|
|
563
|
+
is(log, ['in','out','in', 'in'])
|
|
556
564
|
el.dispatchEvent(new window.Event('out'));
|
|
557
|
-
is(log, ['in','out','in','out'])
|
|
565
|
+
is(log, ['in','out','in','in','out','out'])
|
|
558
566
|
el.dispatchEvent(new window.Event('out'));
|
|
559
|
-
is(log, ['in','out','in','out'])
|
|
567
|
+
is(log, ['in','out','in','in','out','out'])
|
|
560
568
|
})
|
|
561
569
|
|
|
562
570
|
test('on: chain of events', e => {
|
|
@@ -569,14 +577,44 @@ test('on: chain of events', e => {
|
|
|
569
577
|
is(state.log, ['mousedown','mousemove'])
|
|
570
578
|
el.dispatchEvent(new window.Event('mouseup'));
|
|
571
579
|
is(state.log, ['mousedown','mousemove','mouseup'])
|
|
580
|
+
el.dispatchEvent(new window.Event('mouseup'));
|
|
581
|
+
is(state.log, ['mousedown','mousemove','mouseup'])
|
|
582
|
+
el.dispatchEvent(new window.Event('mousedown'));
|
|
583
|
+
is(state.log, ['mousedown','mousemove','mouseup','mousedown'])
|
|
584
|
+
})
|
|
585
|
+
|
|
586
|
+
test('on: parallel chains', e => {
|
|
587
|
+
let el = h`<div :onx..ony..onz="e=>('x',log.push(e.type),e=>('y',log.push(e.type),e=>('z',log.push(e.type))))"></div>`
|
|
588
|
+
let state = sprae(el, {log:[]})
|
|
589
|
+
|
|
590
|
+
console.log('emit x')
|
|
591
|
+
el.dispatchEvent(new window.Event('x'));
|
|
592
|
+
is(state.log, ['x'])
|
|
593
|
+
console.log('emit x')
|
|
594
|
+
el.dispatchEvent(new window.Event('x'));
|
|
595
|
+
is(state.log, ['x','x'])
|
|
596
|
+
console.log('emit y')
|
|
597
|
+
el.dispatchEvent(new window.Event('y'));
|
|
598
|
+
is(state.log, ['x','x','y','y'])
|
|
599
|
+
console.log('emit y')
|
|
600
|
+
el.dispatchEvent(new window.Event('y'));
|
|
601
|
+
is(state.log, ['x','x','y','y'])
|
|
602
|
+
console.log('emit z')
|
|
603
|
+
el.dispatchEvent(new window.Event('z'));
|
|
604
|
+
console.log('emit y')
|
|
605
|
+
el.dispatchEvent(new window.Event('y'));
|
|
606
|
+
is(state.log, ['x','x','y','y','z','z'])
|
|
607
|
+
el.dispatchEvent(new window.Event('z'));
|
|
608
|
+
is(state.log, ['x','x','y','y','z','z']);
|
|
609
|
+
el.dispatchEvent(new window.Event('x'));
|
|
610
|
+
is(state.log, ['x','x','y','y','z','z','x']);
|
|
572
611
|
})
|
|
573
612
|
|
|
574
613
|
test('on: state changes between chain of events', e => {
|
|
575
614
|
let el = h`<x :on="{'x..y':fn}"></x>`
|
|
576
615
|
let log = []
|
|
577
|
-
let state = sprae(el, {log, fn: () => (log.push('x1'),()=>log.push('y1'))})
|
|
578
|
-
console.log('emit x
|
|
579
|
-
el.dispatchEvent(new window.Event('x'));
|
|
616
|
+
let state = sprae(el, {log, fn: () => (log.push('x1'), ()=>log.push('y1'))})
|
|
617
|
+
console.log('emit x')
|
|
580
618
|
el.dispatchEvent(new window.Event('x'));
|
|
581
619
|
is(log, ['x1'])
|
|
582
620
|
console.log('update fn')
|
|
@@ -590,15 +628,14 @@ test('on: state changes between chain of events', e => {
|
|
|
590
628
|
console.log('emit y, y')
|
|
591
629
|
el.dispatchEvent(new window.Event('y'));
|
|
592
630
|
el.dispatchEvent(new window.Event('y'));
|
|
593
|
-
is(log, ['x1'])
|
|
594
|
-
console.log('emit x
|
|
595
|
-
el.dispatchEvent(new window.Event('x'));
|
|
631
|
+
is(log, ['x1', 'y1'])
|
|
632
|
+
console.log('emit x')
|
|
596
633
|
el.dispatchEvent(new window.Event('x'));
|
|
597
|
-
is(log, ['x1','x2'])
|
|
634
|
+
is(log, ['x1','y1','x2'])
|
|
598
635
|
console.log('emit y, y')
|
|
599
636
|
el.dispatchEvent(new window.Event('y'));
|
|
600
637
|
el.dispatchEvent(new window.Event('y'));
|
|
601
|
-
is(log, ['x1','x2','y2'])
|
|
638
|
+
is(log, ['x1','y1','x2','y2'])
|
|
602
639
|
})
|
|
603
640
|
|
|
604
641
|
test('on: once', e => {
|
package/todo.md
CHANGED