sprae 11.6.0 → 12.0.1
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/core.js +229 -90
- package/directive/class.js +9 -13
- package/directive/default.js +2 -154
- package/directive/each.js +79 -75
- package/directive/else.js +22 -0
- package/directive/fx.js +2 -2
- package/directive/if.js +40 -34
- package/directive/ref.js +8 -7
- package/directive/scope.js +17 -0
- package/directive/spread.js +3 -0
- package/directive/style.js +9 -7
- package/directive/text.js +4 -4
- package/directive/value.js +39 -40
- package/dist/sprae.js +3 -495
- package/dist/sprae.js.map +4 -4
- package/dist/sprae.umd.js +3 -640
- package/dist/sprae.umd.js.map +4 -4
- package/micro.js +2 -0
- package/package.json +17 -14
- package/readme.md +432 -205
- package/signal.js +41 -40
- package/sprae.js +127 -18
- package/store.js +109 -96
- package/directive/aria.js +0 -6
- package/directive/data.js +0 -3
- package/directive/with.js +0 -12
- package/dist/sprae.auto.js +0 -662
- package/dist/sprae.auto.js.map +0 -7
- package/dist/sprae.auto.min.js +0 -5
- package/dist/sprae.auto.min.js.map +0 -7
- package/dist/sprae.min.js +0 -5
- package/dist/sprae.min.js.map +0 -7
- package/dist/sprae.umd.min.js +0 -5
- package/dist/sprae.umd.min.js.map +0 -7
package/dist/sprae.js
CHANGED
|
@@ -1,497 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
var current;
|
|
3
|
-
var signal = (v, s, obs = /* @__PURE__ */ new Set()) => (s = {
|
|
4
|
-
get value() {
|
|
5
|
-
current?.deps.push(obs.add(current));
|
|
6
|
-
return v;
|
|
7
|
-
},
|
|
8
|
-
set value(val) {
|
|
9
|
-
if (val === v) return;
|
|
10
|
-
v = val;
|
|
11
|
-
for (let sub of obs) sub();
|
|
12
|
-
},
|
|
13
|
-
peek() {
|
|
14
|
-
return v;
|
|
15
|
-
}
|
|
16
|
-
}, s.toJSON = s.then = s.toString = s.valueOf = () => s.value, s);
|
|
17
|
-
var effect = (fn, teardown, fx, deps) => (fx = (prev) => {
|
|
18
|
-
teardown?.call?.();
|
|
19
|
-
prev = current, current = fx;
|
|
20
|
-
try {
|
|
21
|
-
teardown = fn();
|
|
22
|
-
} finally {
|
|
23
|
-
current = prev;
|
|
24
|
-
}
|
|
25
|
-
}, deps = fx.deps = [], fx(), (dep) => {
|
|
26
|
-
teardown?.call?.();
|
|
27
|
-
while (dep = deps.pop()) dep.delete(fx);
|
|
28
|
-
});
|
|
29
|
-
var computed = (fn, s = signal(), c, e) => (c = {
|
|
30
|
-
get value() {
|
|
31
|
-
e || (e = effect(() => s.value = fn()));
|
|
32
|
-
return s.value;
|
|
33
|
-
},
|
|
34
|
-
peek: s.peek
|
|
35
|
-
}, c.toJSON = c.then = c.toString = c.valueOf = () => c.value, c);
|
|
36
|
-
var batch = (fn) => fn();
|
|
37
|
-
var untracked = batch;
|
|
38
|
-
var use = (s) => (signal = s.signal, effect = s.effect, computed = s.computed, batch = s.batch || batch, untracked = s.untracked || untracked);
|
|
1
|
+
var B=Symbol.dispose||(Symbol.dispose=Symbol("dispose")),u=Symbol("state"),H=Symbol("on"),K=Symbol("off"),z=Symbol("add"),N=":",$,I,Q,X=e=>e(),R=X,q={},F={},G=null,ne=(e=document.body,r)=>{if(e[u])return Object.assign(e[u],r);r=J(r||{});let t=[],o=[],n,s=()=>!o&&(o=t.map(a=>a())),i=()=>(o?.map(a=>a()),o=null);e[H]=s,e[K]=i,e[B]||(e[B]=()=>(e[K](),e[K]=e[H]=e[B]=e[u]=e[z]=null));let c=(a,f=a.attributes)=>{if(f)for(let d=0;d<f.length;){let{name:l,value:m}=f[d];if(l.startsWith(N)){if(a.removeAttribute(l),t.push(n=we(a,l,m,r)),o.push(n()),u in a)return}else d++}for(let d of[...a.childNodes])d.nodeType==1&&c(d)};return e[z]=c,c(e),e[u]===void 0&&(e[u]=r),r},we=(e,r,t,o)=>{let n,s,i=r.slice(N.length).split("..").map((c,a,{length:f})=>c.split(N).reduce((d,l)=>{let[m,...h]=l.split("."),C=S(t,q[G=m]?.parse);if(m.startsWith("on")){let P=m.slice(2),re=M=>y(C(o),M),L=oe(Object.assign(f==1?re:M=>(n=(a?n:re)(M),s(),s=i[(a+1)%f]()),{target:e,type:P}),h);return M=>(M=d?.(),L.target.addEventListener(P,L,L),()=>(M?.(),L.target.removeEventListener(P,L)))}let j=(q[m]||q["*"])(e,o,t,m);if(!h.length&&!d)return()=>j&&I(()=>C(o,j));let g,W=$(-1),x=-1,V=w(oe(()=>{++W.value||(g=I(()=>j&&(W.value==x?V():(x=W.value,C(o,j)))))},h));return P=>(P=d?.(),V(),{[m]:()=>(P?.(),g(),W.value=-1,x=g=null)}[m])},null));return()=>s=i[0]()},U=e=>(e.compile&&(ie=e.compile),e.prefix&&(N=e.prefix),e.signal&&($=e.signal),e.effect&&(I=e.effect),e.computed&&(Q=e.computed),e.batch&&(X=e.batch),e.untracked&&(R=e.untracked)),se=(e=document.body,r)=>{let t=J(r);return ne(e,t),new MutationObserver(n=>{for(let s of n)for(let i of s.addedNodes)if(i.nodeType===1&&i[u]===void 0){for(let c of i.attributes)if(c.name.startsWith(N)){e[z](i);break}}}).observe(e,{childList:!0,subtree:!0}),t},ie,S=(e,r,t)=>{if(t=S.cache[e])return t;let o=e.trim()||"undefined";r&&(o=r(o)),/^(if|let|const)\b/.test(o)||/;/.test(o)||(o=`return ${o}`),/\bawait\s/.test(o)&&(o=`return (async()=>{ ${o} })()`);try{t=ie(o),Object.defineProperty(t,"name",{value:`\u2234 ${e}`})}catch(n){console.error(`\u2234 ${n}
|
|
39
2
|
|
|
40
|
-
|
|
41
|
-
var _signals = Symbol("signals");
|
|
42
|
-
var _change = Symbol("change");
|
|
43
|
-
var _stash = "__";
|
|
44
|
-
var store = (values, parent) => {
|
|
45
|
-
if (!values) return values;
|
|
46
|
-
if (values[_signals] || values[Symbol.toStringTag]) return values;
|
|
47
|
-
if (values.constructor !== Object) return Array.isArray(values) ? list(values) : values;
|
|
48
|
-
let signals = Object.create(parent?.[_signals] || {}), _len = signal(Object.keys(values).length), stash;
|
|
49
|
-
let state = new Proxy(signals, {
|
|
50
|
-
get: (_, k) => k === _change ? _len : k === _signals ? signals : k === _stash ? stash : k in signals ? signals[k]?.valueOf() : globalThis[k],
|
|
51
|
-
set: (_, k, v, s) => k === _stash ? (stash = v, 1) : (s = k in signals, set(signals, k, v), s || ++_len.value),
|
|
52
|
-
// bump length for new signal
|
|
53
|
-
deleteProperty: (_, k) => (signals[k] && (signals[k][Symbol.dispose]?.(), delete signals[k], _len.value--), 1),
|
|
54
|
-
// subscribe to length when object is spread
|
|
55
|
-
ownKeys: () => (_len.value, Reflect.ownKeys(signals)),
|
|
56
|
-
has: (_) => true
|
|
57
|
-
// sandbox prevents writing to global
|
|
58
|
-
}), descs = Object.getOwnPropertyDescriptors(values);
|
|
59
|
-
for (let k in values) {
|
|
60
|
-
if (descs[k]?.get)
|
|
61
|
-
(signals[k] = computed(descs[k].get.bind(state)))._set = descs[k].set?.bind(state);
|
|
62
|
-
else
|
|
63
|
-
signals[k] = null, set(signals, k, values[k]);
|
|
64
|
-
}
|
|
65
|
-
return state;
|
|
66
|
-
};
|
|
67
|
-
var list = (values) => {
|
|
68
|
-
let lastProp, _len = signal(values.length), signals = Array(values.length).fill(), state = new Proxy(signals, {
|
|
69
|
-
get(_, k) {
|
|
70
|
-
if (typeof k === "symbol") return k === _change ? _len : k === _signals ? signals : signals[k];
|
|
71
|
-
if (k === "length") return mut.includes(lastProp) ? _len.peek() : _len.value;
|
|
72
|
-
lastProp = k;
|
|
73
|
-
return (signals[k] ?? (signals[k] = signal(store(values[k])))).valueOf();
|
|
74
|
-
},
|
|
75
|
-
set(_, k, v) {
|
|
76
|
-
if (k === "length") {
|
|
77
|
-
for (let i = v; i < signals.length; i++) delete state[i];
|
|
78
|
-
_len.value = signals.length = v;
|
|
79
|
-
} else {
|
|
80
|
-
set(signals, k, v);
|
|
81
|
-
if (k >= _len.peek()) _len.value = signals.length = +k + 1;
|
|
82
|
-
}
|
|
83
|
-
return 1;
|
|
84
|
-
},
|
|
85
|
-
deleteProperty: (_, k) => (signals[k]?.[Symbol.dispose]?.(), delete signals[k], 1)
|
|
86
|
-
});
|
|
87
|
-
return state;
|
|
88
|
-
};
|
|
89
|
-
var mut = ["push", "pop", "shift", "unshift", "splice"];
|
|
90
|
-
var set = (signals, k, v) => {
|
|
91
|
-
let s = signals[k], cur;
|
|
92
|
-
if (k[0] === "_") signals[k] = v;
|
|
93
|
-
else if (!s) signals[k] = s = v?.peek ? v : signal(store(v));
|
|
94
|
-
else if (v === (cur = s.peek())) ;
|
|
95
|
-
else if (s._set) s._set(v);
|
|
96
|
-
else if (Array.isArray(v) && Array.isArray(cur)) {
|
|
97
|
-
if (cur[_change]) batch(() => {
|
|
98
|
-
for (let i = 0; i < v.length; i++) cur[i] = v[i];
|
|
99
|
-
cur.length = v.length;
|
|
100
|
-
});
|
|
101
|
-
else s.value = v;
|
|
102
|
-
} else s.value = store(v);
|
|
103
|
-
};
|
|
104
|
-
var setter = (expr, set2 = parse(`${expr}=${_stash}`)) => (state, value) => (state[_stash] = value, // save value to stash
|
|
105
|
-
set2(state));
|
|
106
|
-
var store_default = store;
|
|
3
|
+
${N+G}="${e}"`)}return S.cache[e]=(n,s,i)=>{try{let c=t?.(n);return s?(c?.then?c.then(a=>i=s(a)):i=s(c),()=>y(i)):c}catch(c){console.error(`\u2234 ${c}
|
|
107
4
|
|
|
108
|
-
|
|
109
|
-
var _dispose = Symbol.dispose || (Symbol.dispose = Symbol("dispose"));
|
|
110
|
-
var _state = Symbol("state");
|
|
111
|
-
var _on = Symbol("on");
|
|
112
|
-
var _off = Symbol("off");
|
|
113
|
-
var directive = {};
|
|
114
|
-
var dir = (name, create, p = parse) => directive[name] = (el, expr, state, name2, update, evaluate) => (update = create(el, state, expr, name2), evaluate = p(expr, ":" + name2), () => update(evaluate(state)));
|
|
115
|
-
var sprae = (el = document.body, values) => {
|
|
116
|
-
if (el[_state]) return Object.assign(el[_state], values);
|
|
117
|
-
let state = store(values || {}), offs = [], fx = [];
|
|
118
|
-
let init = (el2, attrs = el2.attributes) => {
|
|
119
|
-
if (attrs) for (let i = 0; i < attrs.length; ) {
|
|
120
|
-
let { name, value } = attrs[i], update, dir2;
|
|
121
|
-
if (name.startsWith(prefix)) {
|
|
122
|
-
el2.removeAttribute(name);
|
|
123
|
-
for (dir2 of name.slice(prefix.length).split(":")) {
|
|
124
|
-
update = (directive[dir2] || directive.default)(el2, value, state, dir2);
|
|
125
|
-
fx.push(update);
|
|
126
|
-
offs.push(effect(update));
|
|
127
|
-
if (el2[_state] === null) return;
|
|
128
|
-
}
|
|
129
|
-
} else i++;
|
|
130
|
-
}
|
|
131
|
-
for (let child of el2.childNodes) child.nodeType == 1 && init(child);
|
|
132
|
-
};
|
|
133
|
-
init(el);
|
|
134
|
-
if (!(_state in el)) {
|
|
135
|
-
el[_state] = state;
|
|
136
|
-
el[_off] = () => (offs.map((off) => off()), offs = []);
|
|
137
|
-
el[_on] = () => offs = fx.map((f) => effect(f));
|
|
138
|
-
el[_dispose] = () => (el[_off](), el[_off] = el[_on] = el[_dispose] = el[_state] = null);
|
|
139
|
-
}
|
|
140
|
-
return state;
|
|
141
|
-
};
|
|
142
|
-
sprae.use = (s) => (s.signal && use(s), s.compile && (compile = s.compile), s.prefix && (prefix = s.prefix));
|
|
143
|
-
var parse = (expr, dir2, fn) => {
|
|
144
|
-
if (fn = memo[expr = expr.trim()]) return fn;
|
|
145
|
-
try {
|
|
146
|
-
fn = compile(expr);
|
|
147
|
-
} catch (e) {
|
|
148
|
-
err(e, dir2, expr);
|
|
149
|
-
}
|
|
150
|
-
return memo[expr] = (s) => {
|
|
151
|
-
try {
|
|
152
|
-
return fn(s);
|
|
153
|
-
} catch (e) {
|
|
154
|
-
err(e, dir2, expr);
|
|
155
|
-
}
|
|
156
|
-
};
|
|
157
|
-
};
|
|
158
|
-
var memo = {};
|
|
159
|
-
var err = (e, dir2 = "", expr = "") => {
|
|
160
|
-
throw Object.assign(e, { message: `\u2234 ${e.message}
|
|
161
|
-
|
|
162
|
-
${dir2}${expr ? `="${expr}"
|
|
163
|
-
|
|
164
|
-
` : ""}`, expr });
|
|
165
|
-
};
|
|
166
|
-
var compile;
|
|
167
|
-
var prefix = ":";
|
|
168
|
-
var frag = (tpl) => {
|
|
169
|
-
if (!tpl.nodeType) return tpl;
|
|
170
|
-
let content = tpl.content.cloneNode(true), attributes = [...tpl.attributes], ref = document.createTextNode(""), childNodes = (content.append(ref), [...content.childNodes]);
|
|
171
|
-
return {
|
|
172
|
-
// get parentNode() { return childNodes[0].parentNode },
|
|
173
|
-
childNodes,
|
|
174
|
-
content,
|
|
175
|
-
remove: () => content.append(...childNodes),
|
|
176
|
-
replaceWith(el) {
|
|
177
|
-
if (el === ref) return;
|
|
178
|
-
ref.before(el);
|
|
179
|
-
content.append(...childNodes);
|
|
180
|
-
},
|
|
181
|
-
attributes,
|
|
182
|
-
removeAttribute(name) {
|
|
183
|
-
attributes.splice(attributes.findIndex((a) => a.name === name), 1);
|
|
184
|
-
}
|
|
185
|
-
// setAttributeNode() { }
|
|
186
|
-
};
|
|
187
|
-
};
|
|
188
|
-
var core_default = sprae;
|
|
189
|
-
|
|
190
|
-
// directive/if.js
|
|
191
|
-
var _prevIf = Symbol("if");
|
|
192
|
-
dir("if", (el, state) => {
|
|
193
|
-
let holder = document.createTextNode("");
|
|
194
|
-
let nextEl = el.nextElementSibling, curEl, ifEl, elseEl;
|
|
195
|
-
el.replaceWith(holder);
|
|
196
|
-
ifEl = el.content ? frag(el) : el;
|
|
197
|
-
ifEl[_state] = null;
|
|
198
|
-
if (nextEl?.hasAttribute(":else")) {
|
|
199
|
-
nextEl.removeAttribute(":else");
|
|
200
|
-
if (!nextEl.hasAttribute(":if")) nextEl.remove(), elseEl = nextEl.content ? frag(nextEl) : nextEl, elseEl[_state] = null;
|
|
201
|
-
} else nextEl = null;
|
|
202
|
-
return (value, newEl = el[_prevIf] ? null : value ? ifEl : elseEl) => {
|
|
203
|
-
if (nextEl) nextEl[_prevIf] = el[_prevIf] || newEl == ifEl;
|
|
204
|
-
if (curEl != newEl) {
|
|
205
|
-
if (curEl) curEl.remove(), curEl[_off]?.();
|
|
206
|
-
if (curEl = newEl) {
|
|
207
|
-
holder.before(curEl.content || curEl);
|
|
208
|
-
curEl[_state] === null ? (delete curEl[_state], core_default(curEl, state)) : curEl[_on]();
|
|
209
|
-
}
|
|
210
|
-
}
|
|
211
|
-
};
|
|
212
|
-
});
|
|
213
|
-
|
|
214
|
-
// directive/each.js
|
|
215
|
-
dir(
|
|
216
|
-
"each",
|
|
217
|
-
(tpl, state, expr) => {
|
|
218
|
-
let [itemVar, idxVar = "$"] = expr.split(/\bin\b/)[0].trim().split(/\s*,\s*/);
|
|
219
|
-
let holder = document.createTextNode("");
|
|
220
|
-
let cur, keys2, items, prevl = 0;
|
|
221
|
-
let update = () => {
|
|
222
|
-
var _a, _b;
|
|
223
|
-
let i = 0, newItems = items, newl = newItems.length;
|
|
224
|
-
if (cur && !cur[_change]) {
|
|
225
|
-
for (let s of cur[_signals] || []) s[Symbol.dispose]();
|
|
226
|
-
cur = null, prevl = 0;
|
|
227
|
-
}
|
|
228
|
-
if (newl < prevl) cur.length = newl;
|
|
229
|
-
else {
|
|
230
|
-
if (!cur) cur = newItems;
|
|
231
|
-
else while (i < prevl) cur[i] = newItems[i++];
|
|
232
|
-
for (; i < newl; i++) {
|
|
233
|
-
cur[i] = newItems[i];
|
|
234
|
-
let idx = i, scope = store_default({
|
|
235
|
-
[itemVar]: cur[_signals]?.[idx] || cur[idx],
|
|
236
|
-
[idxVar]: keys2 ? keys2[idx] : idx
|
|
237
|
-
}, state), el = tpl.content ? frag(tpl) : tpl.cloneNode(true);
|
|
238
|
-
holder.before(el.content || el);
|
|
239
|
-
core_default(el, scope);
|
|
240
|
-
let _prev = ((_b = cur[_a = _signals] || (cur[_a] = []))[i] || (_b[i] = {}))[Symbol.dispose];
|
|
241
|
-
cur[_signals][i][Symbol.dispose] = () => {
|
|
242
|
-
_prev?.(), el[Symbol.dispose]?.(), el.remove();
|
|
243
|
-
};
|
|
244
|
-
}
|
|
245
|
-
}
|
|
246
|
-
prevl = newl;
|
|
247
|
-
};
|
|
248
|
-
tpl.replaceWith(holder);
|
|
249
|
-
tpl[_state] = null;
|
|
250
|
-
return (value) => {
|
|
251
|
-
keys2 = null;
|
|
252
|
-
if (typeof value === "number") items = Array.from({ length: value }, (_, i) => i + 1);
|
|
253
|
-
else if (value?.constructor === Object) keys2 = Object.keys(value), items = Object.values(value);
|
|
254
|
-
else items = value || [];
|
|
255
|
-
let planned = 0;
|
|
256
|
-
return effect(() => {
|
|
257
|
-
items[_change]?.value;
|
|
258
|
-
if (!planned++) update(), queueMicrotask(() => (planned > 1 && update(), planned = 0));
|
|
259
|
-
});
|
|
260
|
-
};
|
|
261
|
-
},
|
|
262
|
-
// redefine evaluator to take second part of expression
|
|
263
|
-
(expr) => parse(expr.split(/\bin\b/)[1])
|
|
264
|
-
);
|
|
265
|
-
|
|
266
|
-
// directive/ref.js
|
|
267
|
-
dir("ref", (el, state, expr) => typeof parse(expr)(state) == "function" ? (v) => v.call(null, el) : (setter(expr)(state, el), (_) => _));
|
|
268
|
-
|
|
269
|
-
// directive/with.js
|
|
270
|
-
dir("with", (el, rootState, state) => (state = null, (values) => !state ? (
|
|
271
|
-
// NOTE: we force untracked because internal directives can eval outside of effects (like ref etc) that would cause unwanted subscribe
|
|
272
|
-
// FIXME: since this can be async effect, we should create & sprae it in advance.
|
|
273
|
-
untracked(() => core_default(el, state = store_default(values, rootState)))
|
|
274
|
-
) : core_default(el, values)));
|
|
275
|
-
|
|
276
|
-
// directive/text.js
|
|
277
|
-
dir("text", (el) => (
|
|
278
|
-
// <template :text="a"/> or previously initialized template
|
|
279
|
-
(el.content && el.replaceWith(el = frag(el).childNodes[0]), (value) => el.textContent = value == null ? "" : value)
|
|
280
|
-
));
|
|
281
|
-
|
|
282
|
-
// directive/class.js
|
|
283
|
-
dir(
|
|
284
|
-
"class",
|
|
285
|
-
(el, cur) => (cur = /* @__PURE__ */ new Set(), (v) => {
|
|
286
|
-
let clsx = /* @__PURE__ */ new Set();
|
|
287
|
-
if (v) {
|
|
288
|
-
if (typeof v === "string") v.split(" ").map((cls) => clsx.add(cls));
|
|
289
|
-
else if (Array.isArray(v)) v.map((v2) => v2 && clsx.add(v2));
|
|
290
|
-
else Object.entries(v).map(([k, v2]) => v2 && clsx.add(k));
|
|
291
|
-
}
|
|
292
|
-
for (let cls of cur) if (clsx.has(cls)) clsx.delete(cls);
|
|
293
|
-
else el.classList.remove(cls);
|
|
294
|
-
for (let cls of cur = clsx) el.classList.add(cls);
|
|
295
|
-
})
|
|
296
|
-
);
|
|
297
|
-
|
|
298
|
-
// directive/style.js
|
|
299
|
-
dir(
|
|
300
|
-
"style",
|
|
301
|
-
(el, initStyle) => (initStyle = el.getAttribute("style"), (v) => {
|
|
302
|
-
if (typeof v === "string") el.setAttribute("style", initStyle + (initStyle.endsWith(";") ? "" : "; ") + v);
|
|
303
|
-
else {
|
|
304
|
-
if (initStyle) el.setAttribute("style", initStyle);
|
|
305
|
-
for (let k in v) k[0] == "-" ? el.style.setProperty(k, v[k]) : el.style[k] = v[k];
|
|
306
|
-
}
|
|
307
|
-
})
|
|
308
|
-
);
|
|
309
|
-
|
|
310
|
-
// directive/default.js
|
|
311
|
-
dir("default", (target, state, expr, name) => {
|
|
312
|
-
if (!name.startsWith("on"))
|
|
313
|
-
return name ? (value) => attr(target, name, value) : (value) => {
|
|
314
|
-
for (let key in value) attr(target, dashcase(key), value[key]);
|
|
315
|
-
};
|
|
316
|
-
let ctxs = name.split("..").map((e) => {
|
|
317
|
-
let ctx = { evt: "", target, test: () => true };
|
|
318
|
-
ctx.evt = (e.startsWith("on") ? e.slice(2) : e).replace(
|
|
319
|
-
/\.(\w+)?-?([-\w]+)?/g,
|
|
320
|
-
(_, mod, param = "") => (ctx.test = mods[mod]?.(ctx, ...param.split("-")) || ctx.test, "")
|
|
321
|
-
);
|
|
322
|
-
return ctx;
|
|
323
|
-
});
|
|
324
|
-
let addListener = (fn, { evt, target: target2, test, defer, stop, prevent, immediate, ...opts }, cb) => {
|
|
325
|
-
if (defer) fn = defer(fn);
|
|
326
|
-
cb = (e) => {
|
|
327
|
-
try {
|
|
328
|
-
test(e) && (stop && (immediate ? e.stopImmediatePropagation() : e.stopPropagation()), prevent && e.preventDefault(), fn?.call(state, e));
|
|
329
|
-
} catch (error) {
|
|
330
|
-
err(error, `:on${evt}`, fn);
|
|
331
|
-
}
|
|
332
|
-
};
|
|
333
|
-
target2.addEventListener(evt, cb, opts);
|
|
334
|
-
return () => target2.removeEventListener(evt, cb, opts);
|
|
335
|
-
};
|
|
336
|
-
if (ctxs.length == 1) return (v) => addListener(v, ctxs[0]);
|
|
337
|
-
let startFn, nextFn, off, idx = 0;
|
|
338
|
-
let nextListener = (fn) => {
|
|
339
|
-
off = addListener((e) => (off(), nextFn = fn?.(e), (idx = ++idx % ctxs.length) ? nextListener(nextFn) : startFn && nextListener(startFn)), ctxs[idx]);
|
|
340
|
-
};
|
|
341
|
-
return (value) => (startFn = value, !off && nextListener(startFn), () => startFn = null);
|
|
342
|
-
});
|
|
343
|
-
var mods = {
|
|
344
|
-
// actions
|
|
345
|
-
prevent(ctx) {
|
|
346
|
-
ctx.prevent = true;
|
|
347
|
-
},
|
|
348
|
-
stop(ctx) {
|
|
349
|
-
ctx.stop = true;
|
|
350
|
-
},
|
|
351
|
-
immediate(ctx) {
|
|
352
|
-
ctx.immediate = true;
|
|
353
|
-
},
|
|
354
|
-
// options
|
|
355
|
-
once(ctx) {
|
|
356
|
-
ctx.once = true;
|
|
357
|
-
},
|
|
358
|
-
passive(ctx) {
|
|
359
|
-
ctx.passive = true;
|
|
360
|
-
},
|
|
361
|
-
capture(ctx) {
|
|
362
|
-
ctx.capture = true;
|
|
363
|
-
},
|
|
364
|
-
// target
|
|
365
|
-
window(ctx) {
|
|
366
|
-
ctx.target = window;
|
|
367
|
-
},
|
|
368
|
-
document(ctx) {
|
|
369
|
-
ctx.target = document;
|
|
370
|
-
},
|
|
371
|
-
parent(ctx) {
|
|
372
|
-
ctx.target = ctx.target.parentNode;
|
|
373
|
-
},
|
|
374
|
-
throttle(ctx, limit = 108) {
|
|
375
|
-
ctx.defer = (fn) => throttle(fn, limit);
|
|
376
|
-
},
|
|
377
|
-
debounce(ctx, wait = 108) {
|
|
378
|
-
ctx.defer = (fn) => debounce(fn, wait);
|
|
379
|
-
},
|
|
380
|
-
// test
|
|
381
|
-
outside: (ctx) => (e) => {
|
|
382
|
-
let target = ctx.target;
|
|
383
|
-
if (target.contains(e.target)) return false;
|
|
384
|
-
if (e.target.isConnected === false) return false;
|
|
385
|
-
if (target.offsetWidth < 1 && target.offsetHeight < 1) return false;
|
|
386
|
-
return true;
|
|
387
|
-
},
|
|
388
|
-
self: (ctx) => (e) => e.target === ctx.target,
|
|
389
|
-
// keyboard
|
|
390
|
-
ctrl: (_, ...param) => (e) => keys.ctrl(e) && param.every((p) => keys[p] ? keys[p](e) : e.key === p),
|
|
391
|
-
shift: (_, ...param) => (e) => keys.shift(e) && param.every((p) => keys[p] ? keys[p](e) : e.key === p),
|
|
392
|
-
alt: (_, ...param) => (e) => keys.alt(e) && param.every((p) => keys[p] ? keys[p](e) : e.key === p),
|
|
393
|
-
meta: (_, ...param) => (e) => keys.meta(e) && param.every((p) => keys[p] ? keys[p](e) : e.key === p),
|
|
394
|
-
// NOTE: we don't expose up/left/right/down as too verbose: can and better be handled/differentiated at once
|
|
395
|
-
arrow: () => keys.arrow,
|
|
396
|
-
enter: () => keys.enter,
|
|
397
|
-
esc: () => keys.esc,
|
|
398
|
-
tab: () => keys.tab,
|
|
399
|
-
space: () => keys.space,
|
|
400
|
-
delete: () => keys.delete,
|
|
401
|
-
digit: () => keys.digit,
|
|
402
|
-
letter: () => keys.letter,
|
|
403
|
-
char: () => keys.char
|
|
404
|
-
};
|
|
405
|
-
var keys = {
|
|
406
|
-
ctrl: (e) => e.ctrlKey || e.key === "Control" || e.key === "Ctrl",
|
|
407
|
-
shift: (e) => e.shiftKey || e.key === "Shift",
|
|
408
|
-
alt: (e) => e.altKey || e.key === "Alt",
|
|
409
|
-
meta: (e) => e.metaKey || e.key === "Meta" || e.key === "Command",
|
|
410
|
-
arrow: (e) => e.key.startsWith("Arrow"),
|
|
411
|
-
enter: (e) => e.key === "Enter",
|
|
412
|
-
esc: (e) => e.key.startsWith("Esc"),
|
|
413
|
-
tab: (e) => e.key === "Tab",
|
|
414
|
-
space: (e) => e.key === "\xA0" || e.key === "Space" || e.key === " ",
|
|
415
|
-
delete: (e) => e.key === "Delete" || e.key === "Backspace",
|
|
416
|
-
digit: (e) => /^\d$/.test(e.key),
|
|
417
|
-
letter: (e) => /^\p{L}$/gu.test(e.key),
|
|
418
|
-
char: (e) => /^\S$/.test(e.key)
|
|
419
|
-
};
|
|
420
|
-
var throttle = (fn, limit) => {
|
|
421
|
-
let pause, planned, block = (e) => {
|
|
422
|
-
pause = true;
|
|
423
|
-
setTimeout(() => {
|
|
424
|
-
pause = false;
|
|
425
|
-
if (planned) return planned = false, block(e), fn(e);
|
|
426
|
-
}, limit);
|
|
427
|
-
};
|
|
428
|
-
return (e) => {
|
|
429
|
-
if (pause) return planned = true;
|
|
430
|
-
block(e);
|
|
431
|
-
return fn(e);
|
|
432
|
-
};
|
|
433
|
-
};
|
|
434
|
-
var debounce = (fn, wait) => {
|
|
435
|
-
let timeout;
|
|
436
|
-
return (e) => {
|
|
437
|
-
clearTimeout(timeout);
|
|
438
|
-
timeout = setTimeout(() => {
|
|
439
|
-
timeout = null;
|
|
440
|
-
fn(e);
|
|
441
|
-
}, wait);
|
|
442
|
-
};
|
|
443
|
-
};
|
|
444
|
-
var attr = (el, name, v) => {
|
|
445
|
-
if (v == null || v === false) el.removeAttribute(name);
|
|
446
|
-
else el.setAttribute(name, v === true ? "" : typeof v === "number" || typeof v === "string" ? v : "");
|
|
447
|
-
};
|
|
448
|
-
var dashcase = (str) => {
|
|
449
|
-
return str.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g, (match, i) => (i ? "-" : "") + match.toLowerCase());
|
|
450
|
-
};
|
|
451
|
-
|
|
452
|
-
// directive/value.js
|
|
453
|
-
dir("value", (el, state, expr) => {
|
|
454
|
-
const update = el.type === "text" || el.type === "" ? (value) => el.setAttribute("value", el.value = value == null ? "" : value) : el.tagName === "TEXTAREA" || el.type === "text" || el.type === "" ? (value, from, to) => (
|
|
455
|
-
// we retain selection in input
|
|
456
|
-
(from = el.selectionStart, to = el.selectionEnd, el.setAttribute("value", el.value = value == null ? "" : value), from && el.setSelectionRange(from, to))
|
|
457
|
-
) : el.type === "checkbox" ? (value) => (el.checked = value, attr(el, "checked", value)) : el.type === "radio" ? (value) => el.value === value && (el.checked = value, attr(el, "checked", value)) : el.type === "select-one" ? (value) => {
|
|
458
|
-
for (let o of el.options)
|
|
459
|
-
o.value == value ? o.setAttribute("selected", "") : o.removeAttribute("selected");
|
|
460
|
-
el.value = value;
|
|
461
|
-
} : el.type === "select-multiple" ? (value) => {
|
|
462
|
-
for (let o of el.options) o.removeAttribute("selected");
|
|
463
|
-
for (let v of value) el.querySelector(`[value="${v}"]`).setAttribute("selected", "");
|
|
464
|
-
} : (value) => el.value = value;
|
|
465
|
-
try {
|
|
466
|
-
const set2 = setter(expr);
|
|
467
|
-
const handleChange = el.type === "checkbox" ? () => set2(state, el.checked) : el.type === "select-multiple" ? () => set2(state, [...el.selectedOptions].map((o) => o.value)) : () => set2(state, el.selectedIndex < 0 ? null : el.value);
|
|
468
|
-
el.oninput = el.onchange = handleChange;
|
|
469
|
-
if (el.type?.startsWith("select")) {
|
|
470
|
-
new MutationObserver(handleChange).observe(el, { childList: true, subtree: true, attributes: true });
|
|
471
|
-
core_default(el, state);
|
|
472
|
-
}
|
|
473
|
-
parse(expr)(state) ?? handleChange();
|
|
474
|
-
} catch {
|
|
475
|
-
}
|
|
476
|
-
return update;
|
|
477
|
-
});
|
|
478
|
-
|
|
479
|
-
// directive/fx.js
|
|
480
|
-
dir("fx", (_) => (_2) => _2);
|
|
481
|
-
|
|
482
|
-
// directive/aria.js
|
|
483
|
-
dir("aria", (el) => (value) => {
|
|
484
|
-
for (let key in value) attr(el, "aria-" + dashcase(key), value[key] == null ? null : value[key] + "");
|
|
485
|
-
});
|
|
486
|
-
|
|
487
|
-
// directive/data.js
|
|
488
|
-
dir("data", (el) => (value) => {
|
|
489
|
-
for (let key in value) el.dataset[key] = value[key];
|
|
490
|
-
});
|
|
491
|
-
|
|
492
|
-
// sprae.js
|
|
493
|
-
core_default.use({ compile: (expr) => core_default.constructor(`with (arguments[0]) { return ${expr} };`) });
|
|
494
|
-
var sprae_default = core_default;
|
|
495
|
-
export {
|
|
496
|
-
sprae_default as default
|
|
497
|
-
};
|
|
5
|
+
${N+G}="${e}"`)}}};S.cache={};var oe=(e,r)=>{for(;r.length;){let[t,...o]=r.pop().split("-");e=Te(F[t]?.(e,...o)??e,e)}return e},Te=(e,r)=>{if(e!=r)for(let t in r)e[t]??(e[t]=r[t]);return e},O=e=>{if(!e.nodeType)return e;let r=e.content.cloneNode(!0),t=[...e.attributes],o=document.createTextNode(""),n=(r.append(o),[...r.childNodes]);return{childNodes:n,content:r,remove:()=>r.append(...n),replaceWith(s){s!==o&&(o.before(s),r.append(...n))},attributes:t,removeAttribute(s){t.splice(t.findIndex(i=>i.name===s),1)}}},y=(e,r)=>typeof e=="function"?e(r):e,ae=e=>e.replace(/[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g,(r,t)=>(t?"-":"")+r.toLowerCase()),b=(e,r,t)=>t==null||t===!1?e.removeAttribute(r):e.setAttribute(r,t===!0?"":t),Y=(e,r=[])=>e?typeof e=="string"?e:(Array.isArray(e)?e.map(Y):Object.entries(e).reduce((t,[o,n])=>n?[...t,o]:t,[])).join(" "):"",w=(e,r=queueMicrotask)=>{let t=0,o=n=>{t++||(e(n),r((s=t>1)=>(t=0,s&&o(n))))};return o},ce=(e,r=queueMicrotask,t=0)=>(o,n=++t)=>r(()=>n==t&&e(o)),p=ne;var T=Symbol("signals"),A=Symbol("change"),v=Symbol("set"),D=(e,r=globalThis)=>{if(!e||e[Symbol.toStringTag]||e[T])return e;if(e.constructor!==Object)return Array.isArray(e)?Ce(e):e;let t=Object.keys(e).length,o={},n=new Proxy(Object.assign(o,{[A]:$(t),[T]:o}),{get:(i,c)=>c in o?o[c]?o[c].valueOf():o[c]:r[c],set:(i,c,a,f)=>(c in o?le(o,c,a):(Z(o,c,a),o[A].value=++t),1),deleteProperty:(i,c)=>(c in o&&(c[0]!="_"&&o[c]?.[Symbol.dispose]?.(),delete o[c],o[A].value=--t),1),ownKeys:()=>(o[A].value,Reflect.ownKeys(o)),has:i=>1}),s=Object.getOwnPropertyDescriptors(e);for(let i in e)s[i]?.get?(o[i]=Q(s[i].get.bind(n)))[v]=s[i].set?.bind(n):Z(o,i,e[i]);return n};var Ce=(e,r=globalThis)=>{let t=Array(e.length).fill(null),o=!1,n=c=>function(){return o=!0,c.apply(this,arguments)},s=$(e.length),i=new Proxy(Object.assign(t,{[A]:s,[T]:t,push:n(t.push),pop:n(t.pop),shift:n(t.shift),unshift:n(t.unshift),splice:n(t.splice)}),{get(c,a){return a==="length"?o?(o=!1,t.length):s.value:typeof a=="symbol"||isNaN(a)?t[a]?.valueOf()??r[a]:(t[a]??(t[a]=$(D(e[a])))).valueOf()},set(c,a,f){if(a==="length"){for(let d=f;d<t.length;d++)delete i[d];s.value=t.length=f}else a>=t.length?(Z(t,a,f),i.length=+a+1):t[a]?le(t,a,f):Z(t,a,f);return 1},deleteProperty:(c,a)=>(t[a]?.[Symbol.dispose]?.(),delete t[a],1)});return i},Z=(e,r,t)=>e[r]=r[0]=="_"||t?.peek?t:$(D(t)),le=(e,r,t,o,n)=>r[0]==="_"?e[r]=t:t!==(n=(o=e[r]).peek())&&(o[v]?o[v](t):Array.isArray(t)&&Array.isArray(n)?A in n?R(()=>X(()=>{for(let s=0;s<t.length;s++)n[s]=t[s];n.length=t.length})):o.value=t:o.value=D(t)),J=D;var k,ue=0,E,_=(e,r,t=new Set,o=()=>r.value)=>r={get value(){return k?.deps.push(t.add(k)),e},set value(n){if(n!==e){e=n;for(let s of t)E?E.add(s):s()}},peek(){return e},toJSON:o,then:o,toString:o,valueOf:o},ee=(e,r,t,o,n)=>(t=s=>{if(n=r,r=null,n?.call?.(),s=k,k=t,ue++>10)throw"Cycle detected";try{r=e()}finally{k=s,ue--}},o=t.deps=[],t(),s=>{for(r?.call?.();s=o.pop();)s.delete(t)}),fe=(e,r=_(),t,o,n=()=>t.value)=>t={get value(){return o||(o=ee(()=>r.value=e())),r.value},peek:r.peek,toJSON:n,then:n,toString:n,valueOf:n},pe=(e,r=!E)=>{E??(E=new Set);try{e()}finally{if(r){for(let t of E)t();E=null}}},de=(e,r,t)=>(r=k,k=null,t=e(),k=r,t);var me=(e,r,t,o,n)=>{var s;return e._holder?p(o=e,r):(e[s=u]??(e[s]=null),o=e.content?O(e):e,e.replaceWith(t=document.createTextNode("")),o._holder=t._holder=t,t._clauses=[o._clause=[o,!1]],t.update=w(()=>{let i=t._clauses.find(([,c])=>c);i!=n&&(n?.[0].remove(),n?.[0][K]?.(),(n=i)&&(t.before(n[0].content||n[0]),n[0][u]?n[0][H]?.():(delete n[0][u],p(n[0],r))))})),i=>{o._clause[1]=i,o._holder.update()}};var ye=(e,r,t,o,n=e)=>{for(t=e.content?O(e):e;n&&!(t._holder=n._holder);)n=n.previousSibling;return e.remove(),e[u]=null,t._holder._clauses.push(t._clause=[t,!0]),()=>{t._holder.update()}};var he=e=>(e.content&&e.replaceWith(e=O(e).childNodes[0]),r=>(r=y(r,e.textContent),e.textContent=r??""));var be=(e,r,t)=>(r=new Set,o=>{t=new Set,o&&Y(y(o,e.className)).split(" ").map(n=>n&&t.add(n));for(let n of r)t.has(n)?t.delete(n):e.classList.remove(n);for(let n of r=t)e.classList.add(n)});var ge=(e,r)=>(r=e.getAttribute("style"),t=>{if(t=y(t,e.style),typeof t=="string")b(e,"style",r+"; "+t);else{r&&b(e,"style",r);for(let o in t)o[0]=="-"?e.style.setProperty(o,t[o]):o[0]>"A"&&(e.style[o]=t[o])}});var xe=()=>e=>y(e);var We=(e,r=S(`${e}=__`))=>(t,o)=>{t.__=o,r(t),delete t.__},Se=(e,r,t,o)=>{try{let n=We(t),s=e.type==="checkbox"?()=>n(r,e.checked):e.type==="select-multiple"?()=>n(r,[...e.selectedOptions].map(i=>i.value)):()=>n(r,e.selectedIndex<0?null:e.value);e.oninput=e.onchange=s,e.type?.startsWith("select")&&(new MutationObserver(s).observe(e,{childList:!0,subtree:!0,attributes:!0}),p(e,r)),S(t)(r)??s()}catch{}return e.type==="text"||e.type===""?n=>e.setAttribute("value",e.value=n??""):e.tagName==="TEXTAREA"||e.type==="text"||e.type===""?(n,s,i)=>(s=e.selectionStart,i=e.selectionEnd,e.setAttribute("value",e.value=n??""),s&&e.setSelectionRange(s,i)):e.type==="checkbox"?n=>(e.checked=n,b(e,"checked",n)):e.type==="radio"?n=>e.value===n&&(e.checked=n,b(e,"checked",n)):e.type==="select-one"?n=>{for(let s of e.options)s.value==n?s.setAttribute("selected",""):s.removeAttribute("selected");e.value=n}:e.type==="select-multiple"?n=>{for(let s of e.options)s.removeAttribute("selected");for(let s of n)e.querySelector(`[value="${s}"]`).setAttribute("selected","")}:n=>e.value=n};var Ae=(e,r,t,o,n,s)=>typeof S(t)(r)=="function"?i=>i(e):(Object.defineProperty(r,t,{value:e,configurable:!0}),()=>{});var Oe=(e,r,t)=>(e[u]=null,t=D({},r),o=>{let n=y(o,t);for(let s in n)t[s]=typeof n[s]=="function"?n[s].bind(t):n[s];return e[u]??(delete e[u],R(()=>p(e,t)))});var ke=(e,r,t)=>{let[o,n="$"]=t.split(/\bin\b/)[0].trim().replace(/\(|\)/g,"").split(/\s*,\s*/),s=document.createTextNode(""),i,c,a,f=0,d=w(()=>{var C,j;let l=0,m=a,h=m.length;if(i&&!i[A]){for(let g of i[T]||[])g[Symbol.dispose]();i=null,f=0}if(h<f)i.length=h;else{if(!i)i=m;else for(;l<f;)i[l]=m[l++];for(;l<h;l++){i[l]=m[l];let g=l,W=Object.create(r,{[o]:{get:()=>i[g]},[n]:{value:c?c[g]:g}}),x=e.content?O(e):e.cloneNode(!0);s.before(x.content||x),p(x,W);let V=((j=i[C=T]||(i[C]=[]))[l]||(j[l]={}))[Symbol.dispose];i[T][l][Symbol.dispose]=()=>{V?.(),x[Symbol.dispose]?.(),x.remove()}}}f=h});return e.replaceWith(s),e[u]=null,l=>(c=null,typeof l=="number"?a=Array.from({length:l},(m,h)=>h+1):l?.constructor===Object?(c=Object.keys(l),a=Object.values(l)):a=l||[],I(()=>{a[A]?.value,d()}))};ke.parse=e=>e.split(/\bin\b/)[1].trim();var je=ke;var Ne=(e,r,t,o)=>n=>b(e,o,y(n,e.getAttribute(o)));var $e=e=>r=>{for(let t in r)b(e,ae(t),r[t])};Object.assign(q,{"*":Ne,"":$e,class:be,text:he,style:ge,fx:xe,value:Se,ref:Ae,scope:Oe,if:me,else:ye,each:je});Object.assign(F,{debounce:(e,r=250,t=r==="tick"?queueMicrotask:r==="raf"?requestAnimationFrame:r==="idle"?requestIdleCallback:n=>setTimeout(n,r),o=0)=>ce(e,t),throttle:(e,r=250,t=r==="tick"?queueMicrotask:r==="raf"?requestAnimationFrame:o=>setTimeout(o,r))=>w(e,t),once:(e,r,t)=>Object.assign(o=>!r&&(r=1,e(o)),{once:!0}),prevent:e=>r=>(r?.preventDefault(),e(r)),stop:e=>r=>(r?.stopPropagation(),e(r)),immediate:e=>r=>(r?.stopImmediatePropagation(),e(r)),passive:e=>(e.passive=!0,e),capture:e=>(e.capture=!0,e),window:e=>(e.target=window,e),document:e=>(e.target=document,e),parent:e=>(e.target=e.target.parentNode,e),self:e=>r=>r.target===e.target&&e(r),outside:e=>(r,t)=>(t=e.target,!t.contains(r.target)&&r.target.isConnected&&(t.offsetWidth||t.offsetHeight))});var te={ctrl:e=>e.ctrlKey||e.key==="Control"||e.key==="Ctrl",shift:e=>e.shiftKey||e.key==="Shift",alt:e=>e.altKey||e.key==="Alt",meta:e=>e.metaKey||e.key==="Meta"||e.key==="Command",arrow:e=>e.key.startsWith("Arrow"),enter:e=>e.key==="Enter",esc:e=>e.key.startsWith("Esc"),tab:e=>e.key==="Tab",space:e=>e.key==="\xA0"||e.key==="Space"||e.key===" ",delete:e=>e.key==="Delete"||e.key==="Backspace",digit:e=>/^\d$/.test(e.key),letter:e=>/^\p{L}$/gu.test(e.key),char:e=>/^\S$/.test(e.key)};for(let e in te)F[e]=(r,...t)=>o=>te[e](o)&&t.every(n=>te[n]?.(o)??o.key===n)&&r(o);U({compile:e=>p.constructor(`with (arguments[0]) { ${e} }`),signal:_,effect:ee,computed:fe,batch:pe,untracked:de});p.use=U;p.store=J;p.directive=q;p.modifier=F;p.start=se;var qt=p;export{pe as batch,fe as computed,qt as default,ee as effect,_ as signal,p as sprae,se as start,J as store,de as untracked,U as use};
|