@ryupold/vode 1.1.4 → 1.1.5
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/README.md +52 -33
- package/dist/vode.js +6 -6
- package/dist/vode.min.js +1 -1
- package/dist/vode.min.mjs +1 -1
- package/dist/vode.mjs +7 -6
- package/package.json +2 -2
- package/src/vode.ts +8 -8
package/README.md
CHANGED
|
@@ -213,14 +213,16 @@ expressed as **"vode"** it would look like this:
|
|
|
213
213
|
]
|
|
214
214
|
```
|
|
215
215
|
|
|
216
|
-
Viewed alone it does not provide an obvious benefit (apart from looking better imho),
|
|
216
|
+
Viewed alone it does not provide an obvious benefit (apart from looking better imho),
|
|
217
|
+
but as the result of a function of state, it can become very useful to express conditional UI this way.
|
|
217
218
|
|
|
218
219
|
### Component
|
|
219
220
|
```ts
|
|
220
221
|
type Component<S> = (s: S) => ChildVode<S>;
|
|
221
222
|
```
|
|
222
223
|
|
|
223
|
-
A `Component<State>` is a function that takes a state object and returns a `Vode<State>`.
|
|
224
|
+
A `Component<State>` is a function that takes a state object and returns a `Vode<State>`.
|
|
225
|
+
It is used to render the UI based on the current state.
|
|
224
226
|
|
|
225
227
|
```ts
|
|
226
228
|
// A full vode has a tag, properties, and children. props and children are optional.
|
|
@@ -315,35 +317,41 @@ const state = {
|
|
|
315
317
|
};
|
|
316
318
|
const patch = app(containerNode, state, (s) => CompFooBar(s));
|
|
317
319
|
```
|
|
318
|
-
It will analyse the current structure of the given `containerNode` and adjust its structure in the first render.
|
|
320
|
+
It will analyse the current structure of the given `containerNode` and adjust its structure in the first render.
|
|
321
|
+
When render-patches are applied to the `patch` function or via yield/return of events,
|
|
322
|
+
the `containerNode` is updated to match the vode structure 1:1.
|
|
319
323
|
|
|
320
324
|
#### isolated state
|
|
321
|
-
You can have multiple isolated vode app instances on a page, each with its own state and render function.
|
|
325
|
+
You can have multiple isolated vode app instances on a page, each with its own state and render function.
|
|
326
|
+
The returned patch function from `app` can be used to synchronize the state between them.
|
|
322
327
|
|
|
323
328
|
#### isolated app
|
|
324
|
-
It is possible to nest vode-apps inside vode-apps, but the library is not opionated on how you do that.
|
|
329
|
+
It is possible to nest vode-apps inside vode-apps, but the library is not opionated on how you do that.
|
|
330
|
+
One can imagine this type of component:
|
|
325
331
|
|
|
326
332
|
```ts
|
|
327
333
|
export function IsolatedVodeApp<OuterState, InnerState>(
|
|
328
334
|
tag: Tag,
|
|
329
335
|
props: Props<OuterState>,
|
|
330
336
|
state: InnerState,
|
|
331
|
-
View: (ins:InnerState) => Vode<InnerState>,
|
|
337
|
+
View: (ins: InnerState) => Vode<InnerState>,
|
|
332
338
|
...initialPatches: Patch<InnerState>[]
|
|
333
339
|
): ChildVode<OuterState> {
|
|
334
340
|
return memo<OuterState>([],
|
|
335
341
|
() => [tag,
|
|
336
342
|
{
|
|
337
343
|
...props,
|
|
338
|
-
onMount: (
|
|
344
|
+
onMount: (s: OuterState, container: Element) => {
|
|
339
345
|
app<InnerState>(container, state, View, ...initialPatches);
|
|
346
|
+
if (props.onMount) props.onMount(s, container);
|
|
340
347
|
}
|
|
341
348
|
}
|
|
342
349
|
]
|
|
343
350
|
);
|
|
344
351
|
}
|
|
345
352
|
```
|
|
346
|
-
The `empty memo` prevents further render calls from the outer app
|
|
353
|
+
The `empty memo` prevents further render calls from the outer app
|
|
354
|
+
so rendering of the subtree inside is controlled by the inner app.
|
|
347
355
|
|
|
348
356
|
### state & patch
|
|
349
357
|
The state object you pass to [`app`](#app) can be updated directly or via `patch`.
|
|
@@ -407,42 +415,53 @@ const ComponentEwww = (s) => {
|
|
|
407
415
|
```
|
|
408
416
|
|
|
409
417
|
### memoization
|
|
410
|
-
To optimize performance, you can use `memo(Array, Component | PropsFactory)` to cache the result of a component function.
|
|
418
|
+
To optimize performance, you can use `memo(Array, Component | PropsFactory)` to cache the result of a component function.
|
|
419
|
+
This is useful when the component does not depend on the state or when the creation of the vode is expensive.
|
|
420
|
+
You can also pass a function that returns the Props object to memoize the attributes.
|
|
411
421
|
|
|
412
422
|
```ts
|
|
413
|
-
const CompMemoFooBar = (s) =>
|
|
414
|
-
[
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
423
|
+
const CompMemoFooBar = (s) =>
|
|
424
|
+
[DIV, { class: "container" },
|
|
425
|
+
[H1, "Hello World"],
|
|
426
|
+
[BR],
|
|
427
|
+
[P, "This is a paragraph."],
|
|
428
|
+
|
|
429
|
+
// expensive component to render
|
|
430
|
+
memo(
|
|
431
|
+
// this array is shallow compared to the previous render
|
|
432
|
+
[s.title, s.body],
|
|
433
|
+
// this is the component function that will be
|
|
434
|
+
// called only when the array changes
|
|
435
|
+
(s) => {
|
|
436
|
+
const list = [UL];
|
|
437
|
+
for (let i = 0; i < 1000; i++) {
|
|
438
|
+
list.push([LI, `Item ${i}`]);
|
|
439
|
+
}
|
|
440
|
+
return list;
|
|
441
|
+
},
|
|
442
|
+
)
|
|
443
|
+
];
|
|
433
444
|
```
|
|
434
445
|
|
|
435
|
-
###
|
|
446
|
+
### Access to DOM elements
|
|
447
|
+
|
|
448
|
+
You can use the `hydrate(Element | Text)` function to convert existing DOM tree into a vode structure.
|
|
436
449
|
|
|
437
|
-
Additionally to the standard HTML attributes, you can define 2 special event attributes:
|
|
450
|
+
Additionally to the standard HTML attributes, you can define 2 special event attributes:
|
|
451
|
+
`onMount(State, Element)` and `onUnmount(State, Element)` in the vode props.
|
|
452
|
+
These are called when the element is created or removed during rendering.
|
|
453
|
+
They receive the `State` as the first argument and the DOM element as the second argument.
|
|
454
|
+
Like the other events they can be patches too.
|
|
438
455
|
|
|
439
456
|
## Contributing
|
|
440
457
|
|
|
441
|
-
I was delighted by the simplicity of [hyperapp](https://github.com/jorgebucaran/hyperapp),
|
|
458
|
+
I was delighted by the simplicity of [hyperapp](https://github.com/jorgebucaran/hyperapp),
|
|
459
|
+
which inspired me to create this library.
|
|
442
460
|
|
|
443
461
|
Not planning to add more features, just keeping it simple and easy.
|
|
444
462
|
|
|
445
|
-
But if you find bugs or have suggestions,
|
|
463
|
+
But if you find bugs or have suggestions,
|
|
464
|
+
feel free to open an [issue](https://github.com/ryupold/vode/issues) or a pull request.
|
|
446
465
|
|
|
447
466
|
## License
|
|
448
467
|
[](./LICENSE)
|
package/dist/vode.js
CHANGED
|
@@ -335,7 +335,7 @@ var V = (() => {
|
|
|
335
335
|
_vode.patch,
|
|
336
336
|
container.parentElement,
|
|
337
337
|
Array.from(container.parentElement.children).indexOf(container),
|
|
338
|
-
hydrate(container),
|
|
338
|
+
hydrate(container, true),
|
|
339
339
|
dom(state)
|
|
340
340
|
);
|
|
341
341
|
for (const effect of initialPatches) {
|
|
@@ -343,17 +343,17 @@ var V = (() => {
|
|
|
343
343
|
}
|
|
344
344
|
return _vode.patch;
|
|
345
345
|
}
|
|
346
|
-
function hydrate(element) {
|
|
346
|
+
function hydrate(element, prepareForRender) {
|
|
347
347
|
if (element?.nodeType === Node.TEXT_NODE) {
|
|
348
348
|
if (element.nodeValue?.trim() !== "")
|
|
349
|
-
return element;
|
|
349
|
+
return prepareForRender ? element : element.nodeValue;
|
|
350
350
|
return void 0;
|
|
351
351
|
} else if (element.nodeType === Node.COMMENT_NODE) {
|
|
352
352
|
return void 0;
|
|
353
353
|
} else if (element.nodeType === Node.ELEMENT_NODE) {
|
|
354
354
|
const tag2 = element.tagName.toLowerCase();
|
|
355
355
|
const root = [tag2];
|
|
356
|
-
root.node = element;
|
|
356
|
+
if (prepareForRender) root.node = element;
|
|
357
357
|
if (element?.hasAttributes()) {
|
|
358
358
|
const props2 = {};
|
|
359
359
|
const attr = element.attributes;
|
|
@@ -365,9 +365,9 @@ var V = (() => {
|
|
|
365
365
|
if (element.hasChildNodes()) {
|
|
366
366
|
const remove = [];
|
|
367
367
|
for (let child2 of element.childNodes) {
|
|
368
|
-
const wet = child2 && hydrate(child2);
|
|
368
|
+
const wet = child2 && hydrate(child2, prepareForRender);
|
|
369
369
|
if (wet) root.push(wet);
|
|
370
|
-
else if (child2) remove.push(child2);
|
|
370
|
+
else if (child2 && prepareForRender) remove.push(child2);
|
|
371
371
|
}
|
|
372
372
|
for (let child2 of remove) {
|
|
373
373
|
child2.remove();
|
package/dist/vode.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var V=(()=>{var N=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var k=(t,o)=>{for(var r in o)N(t,r,{get:o[r],enumerable:!0})},U=(t,o,r,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of G(o))!H.call(t,e)&&e!==r&&N(t,e,{get:()=>o[e],enumerable:!(a=v(o,e))||a.enumerable});return t};var V=t=>U(N({},"__esModule",{value:!0}),t);var Hn={};k(Hn,{A:()=>z,ABBR:()=>Z,ADDRESS:()=>w,ANIMATE:()=>we,ANIMATEMOTION:()=>to,ANIMATETRANSFORM:()=>eo,ANNOTATION:()=>sn,ANNOTATION_XML:()=>an,AREA:()=>tt,ARTICLE:()=>et,ASIDE:()=>ot,AUDIO:()=>nt,B:()=>rt,BASE:()=>st,BDI:()=>at,BDO:()=>ct,BLOCKQUOTE:()=>it,BODY:()=>pt,BR:()=>Tt,BUTTON:()=>ft,CANVAS:()=>lt,CAPTION:()=>St,CIRCLE:()=>oo,CITE:()=>dt,CLIPPATH:()=>no,CODE:()=>gt,COL:()=>xt,COLGROUP:()=>ut,DATA:()=>yt,DATALIST:()=>Et,DD:()=>mt,DEFS:()=>ro,DEL:()=>ht,DESC:()=>so,DETAILS:()=>At,DFN:()=>Pt,DIALOG:()=>Ct,DIV:()=>Mt,DL:()=>Nt,DT:()=>Ot,ELLIPSE:()=>ao,EM:()=>Rt,EMBED:()=>Lt,FEBLEND:()=>co,FECOLORMATRIX:()=>io,FECOMPONENTTRANSFER:()=>po,FECOMPOSITE:()=>To,FECONVOLVEMATRIX:()=>fo,FEDIFFUSELIGHTING:()=>lo,FEDISPLACEMENTMAP:()=>So,FEDISTANTLIGHT:()=>go,FEDROPSHADOW:()=>xo,FEFLOOD:()=>uo,FEFUNCA:()=>yo,FEFUNCB:()=>Eo,FEFUNCG:()=>mo,FEFUNCR:()=>ho,FEGAUSSIANBLUR:()=>Ao,FEIMAGE:()=>Po,FEMERGE:()=>Co,FEMERGENODE:()=>Mo,FEMORPHOLOGY:()=>No,FEOFFSET:()=>Oo,FEPOINTLIGHT:()=>Ro,FESPECULARLIGHTING:()=>Lo,FESPOTLIGHT:()=>bo,FETILE:()=>Do,FETURBULENCE:()=>Io,FIELDSET:()=>bt,FIGCAPTION:()=>Dt,FIGURE:()=>It,FILTER:()=>Fo,FOOTER:()=>Ft,FOREIGNOBJECT:()=>vo,FORM:()=>vt,G:()=>Go,H1:()=>Gt,H2:()=>Ht,H3:()=>kt,H4:()=>Ut,H5:()=>Vt,H6:()=>Bt,HEAD:()=>jt,HEADER:()=>_t,HGROUP:()=>Kt,HR:()=>Xt,HTML:()=>qt,I:()=>Yt,IFRAME:()=>Wt,IMAGE:()=>Ho,IMG:()=>$t,INPUT:()=>Jt,INS:()=>Qt,KBD:()=>zt,LABEL:()=>Zt,LEGEND:()=>wt,LI:()=>te,LINE:()=>ko,LINEARGRADIENT:()=>Uo,LINK:()=>ee,MACTION:()=>cn,MAIN:()=>oe,MAP:()=>ne,MARK:()=>re,MARKER:()=>Vo,MASK:()=>Bo,MATH:()=>pn,MENU:()=>se,MERROR:()=>Tn,META:()=>ae,METADATA:()=>jo,METER:()=>ce,MFRAC:()=>fn,MI:()=>ln,MMULTISCRIPTS:()=>Sn,MN:()=>dn,MO:()=>gn,MOVER:()=>xn,MPADDED:()=>un,MPATH:()=>_o,MPHANTOM:()=>yn,MPRESCRIPTS:()=>En,MROOT:()=>mn,MROW:()=>hn,MS:()=>An,MSPACE:()=>Pn,MSQRT:()=>Cn,MSTYLE:()=>Mn,MSUB:()=>Nn,MSUBSUP:()=>On,MSUP:()=>Rn,MTABLE:()=>Ln,MTD:()=>bn,MTEXT:()=>Dn,MTR:()=>In,MUNDER:()=>Fn,MUNDEROVER:()=>vn,NAV:()=>ie,NOSCRIPT:()=>pe,OBJECT:()=>Te,OL:()=>fe,OPTGROUP:()=>le,OPTION:()=>Se,OUTPUT:()=>de,P:()=>ge,PATH:()=>Ko,PATTERN:()=>Xo,PICTURE:()=>xe,POLYGON:()=>qo,POLYLINE:()=>Yo,PRE:()=>ue,PROGRESS:()=>ye,Q:()=>Ee,RADIALGRADIENT:()=>Wo,RECT:()=>$o,RP:()=>me,RT:()=>he,RUBY:()=>Ae,S:()=>Pe,SAMP:()=>Ce,SCRIPT:()=>Me,SECTION:()=>Ne,SELECT:()=>Oe,SEMANTICS:()=>Gn,SET:()=>Jo,SLOT:()=>Re,SMALL:()=>Le,SOURCE:()=>be,SPAN:()=>De,STOP:()=>Qo,STRONG:()=>Ie,STYLE:()=>Fe,SUB:()=>ve,SUMMARY:()=>Ge,SUP:()=>He,SVG:()=>zo,SWITCH:()=>Zo,SYMBOL:()=>wo,TABLE:()=>ke,TBODY:()=>Ue,TD:()=>Ve,TEMPLATE:()=>Be,TEXT:()=>tn,TEXTAREA:()=>je,TEXTPATH:()=>en,TFOOT:()=>_e,TH:()=>Ke,THEAD:()=>Xe,TIME:()=>qe,TITLE:()=>Ye,TR:()=>We,TRACK:()=>$e,TSPAN:()=>on,U:()=>Je,UL:()=>Qe,USE:()=>nn,VIDEO:()=>ze,VIEW:()=>rn,WBR:()=>Ze,app:()=>j,child:()=>$,childCount:()=>W,children:()=>A,childrenStart:()=>C,createPatch:()=>X,createState:()=>K,hydrate:()=>b,memo:()=>_,mergeClass:()=>Y,props:()=>d,tag:()=>q,vode:()=>B});function B(t,o,...r){if(!t)throw new Error("tag must be a string or vode");return Array.isArray(t)?t:o?[t,o,...r]:[t,...r]}function j(t,o,r,...a){if(!t?.parentElement)throw new Error("container must be a valid HTMLElement inside the <html></html> document");if(!o||typeof o!="object")throw new Error("given state must be an object");if(typeof r!="function")throw new Error("dom must be a function that returns a vode");let e={};e.stats={lastRenderTime:0,renderCount:0,liveEffectCount:0,patchCount:0,renderPatchCount:0},Object.defineProperty(o,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async s=>{if(!(!s||typeof s!="function"&&typeof s!="object"))if(e.stats.patchCount++,s?.next){let i=s;e.stats.liveEffectCount++;try{let l=await i.next();for(;l.done===!1;){e.stats.liveEffectCount++;try{e.patch(l.value),l=await i.next()}finally{e.stats.liveEffectCount--}}e.patch(l.value)}finally{e.stats.liveEffectCount--}}else if(s.then){e.stats.liveEffectCount++;try{let i=await s;e.patch(i)}finally{e.stats.liveEffectCount--}}else Array.isArray(s)?typeof s[0]=="function"?s.length>1?e.patch(s[0](e.state,...s.slice(1))):e.patch(s[0](e.state)):e.stats.patchCount--:typeof s=="function"?e.patch(s(e.state)):(e.stats.renderPatchCount++,e.q=u(e.q||{},s,!1),e.isRendering||e.render())}}),Object.defineProperty(e,"render",{enumerable:!1,configurable:!0,writable:!1,value:()=>requestAnimationFrame(()=>{if(e.isRendering||!e.q)return;e.isRendering=!0;let s=Date.now();try{e.state=u(e.state,e.q,!0),e.q=null;let i=r(e.state);e.vode=P(e.state,e.patch,t.parentElement,0,e.vode,i),t.tagName.toUpperCase()!==i[0].toUpperCase()&&(t=e.vode.node,t._vode=e)}finally{e.isRendering=!1,e.stats.renderCount++,e.stats.lastRenderTime=Date.now()-s,e.q&&e.render()}})}),e.patch=o.patch,e.state=o,e.q=null;let n=t;n._vode=e,e.vode=P(o,e.patch,t.parentElement,Array.from(t.parentElement.children).indexOf(t),b(t),r(o));for(let s of a)e.patch(s);return e.patch}function b(t){if(t?.nodeType===Node.TEXT_NODE)return t.nodeValue?.trim()!==""?t:void 0;if(t.nodeType===Node.COMMENT_NODE)return;if(t.nodeType===Node.ELEMENT_NODE){let r=[t.tagName.toLowerCase()];if(r.node=t,t?.hasAttributes()){let a={},e=t.attributes;for(let n of e)a[n.name]=n.value;r.push(a)}if(t.hasChildNodes()){let a=[];for(let e of t.childNodes){let n=e&&b(e);n?r.push(n):e&&a.push(e)}for(let e of a)e.remove()}return r}else return}function _(t,o){return o.__memo=t,o}function K(t){return t}function X(t){return t}function q(t){return t?Array.isArray(t)?t[0]:typeof t=="string"||t.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function d(t){if(Array.isArray(t)&&t.length>1&&t[1]&&!Array.isArray(t[1])&&typeof t[1]=="object"&&t[1].nodeType!==Node.TEXT_NODE)return t[1]}function Y(t,o){if(!t)return o;if(!o)return t;if(typeof t=="string"&&typeof o=="string"){let r=t.split(" "),a=o.split(" "),e=new Set([...r,...a]);return Array.from(e).join(" ").trim()}else if(typeof t=="string"&&Array.isArray(o)){let r=new Set([...o,...t.split(" ")]);return Array.from(r).join(" ").trim()}else if(Array.isArray(t)&&typeof o=="string"){let r=new Set([...t,...o.split(" ")]);return Array.from(r).join(" ").trim()}else if(Array.isArray(t)&&Array.isArray(o)){let r=new Set([...t,...o]);return Array.from(r).join(" ").trim()}else{if(typeof t=="string"&&typeof o=="object")return{[t]:!0,...o};if(typeof t=="object"&&typeof o=="string")return{...t,[o]:!0};if(typeof t=="object"&&typeof o=="object")return{...t,...o};if(typeof t=="object"&&Array.isArray(o)){let r={...t};for(let a of o)r[a]=!0;return r}else if(Array.isArray(t)&&typeof o=="object"){let r={};for(let a of t)r[a]=!0;for(let a of Object.keys(o))r[a]=o[a];return r}}throw new Error(`cannot merge classes of ${t} (${typeof t}) and ${o} (${typeof o})`)}function A(t){let o=C(t);return o>0?t.slice(o):null}function W(t){return t.length-C(t)}function $(t,o){return t[o+C(t)]}function C(t){return d(t)?2:1}function u(t,o,r){if(!o)return t;for(let a in o){let e=o[a];if(e&&typeof e=="object"){let n=t[a];n?Array.isArray(e)?t[a]=[...e]:e instanceof Date&&n!==e?t[a]=new Date(e):Array.isArray(n)?t[a]=u({},e,r):typeof n=="object"?u(t[a],e,r):t[a]=u({},e,r):Array.isArray(e)?t[a]=[...e]:e instanceof Date?t[a]=new Date(e):t[a]=u({},e,r)}else e===void 0&&r?delete t[a]:t[a]=e}return t}function P(t,o,r,a,e,n,s){n=O(t,n,e);let i=!n||typeof n=="number"||typeof n=="boolean";if(n===e||!e&&i)return e;let l=e?.nodeType===Node.TEXT_NODE,p=l?e:e?.node;if(i){p?.onUnmount&&o(p.onUnmount(p)),p?.remove();return}let E=!i&&Q(n),m=!i&&J(n),M=!!n&&typeof n!="string"&&!!(n?.node||n?.nodeType===Node.TEXT_NODE);if(!E&&!m&&!M&&!e)throw new Error("Invalid vode: "+typeof n+" "+JSON.stringify(n));if(M&&E?n=n.wholeText:M&&m&&(n=[...n]),l&&E)return p.nodeValue!==n&&(p.nodeValue=n),e;if(E&&(!p||!l)){let T=document.createTextNode(n);return p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):r.childNodes[a]?r.insertBefore(T,r.childNodes[a]):r.appendChild(T),T}if(m&&(!p||l||e[0]!==n[0])){s=s||n[0]==="svg";let T=s?document.createElementNS("http://www.w3.org/2000/svg",n[0]):document.createElement(n[0]);n.node=T;let y=n;1 in y&&(y[1]=O(t,y[1],void 0));let g=d(n);R(o,T,void 0,g,s),p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):r.childNodes[a]?r.insertBefore(T,r.childNodes[a]):r.appendChild(T);let S=A(n);if(S)for(let f=0;f<S.length;f++){let c=S[f],x=P(t,o,T,f,void 0,c,s);n[g?f+2:f+1]=x}return T.onMount&&o(T.onMount(T)),n}if(!l&&m&&e[0]===n[0]){s=s||n[0]==="svg",n.node=p;let T=n,y=e,g=!1;if(T[1]?.__memo){let c=T[1];if(T[1]=O(t,T[1],y[1]),c!==T[1]){let x=d(n);R(o,p,d(e),x,s),g=!!x}}else{let c=d(n);R(o,p,d(e),c,s),g=!!c}let S=A(n),f=A(e);if(S){for(let c=0;c<S.length;c++){let x=S[c],F=f&&f[c],D=P(t,o,p,c,F,x,s);D&&(n[g?c+2:c+1]=D)}for(let c=S.length;f&&c<f.length;c++)f[c]?.node?f[c].node.remove():f[c]?.nodeType===Node.TEXT_NODE&&f[c].remove()}for(let c=S?.length||0;c<f?.length;c++)f[c]?.node?f[c].node.remove():f[c]?.nodeType===Node.TEXT_NODE&&f[c].remove();return n}}function J(t){return Array.isArray(t)&&t.length>0&&typeof t[0]=="string"}function Q(t){return typeof t=="string"||t?.nodeType===Node.TEXT_NODE}function O(t,o,r){if(typeof o!="function")return o;let a=o?.__memo,e=r?.__memo;if(Array.isArray(a)&&Array.isArray(e)&&a.length===e.length){let s=!0;for(let i=0;i<a.length;i++)if(a[i]!==e[i]){s=!1;break}if(s)return r}let n=I(o,t);return typeof n=="object"&&(n.__memo=o?.__memo),n}function I(t,o){return typeof t=="function"?I(t(o),o):t}function R(t,o,r,a,e){if(!(!a&&!r)){if(r)for(let n in r){let s=r[n],i=a?.[n];s!==i&&(a?a[n]=h(t,o,n,s,i,e):h(t,o,n,s,void 0,e))}if(a&&r){for(let n in a)if(!(n in r)){let s=a[n];a[n]=h(t,o,n,void 0,s,e)}}else if(a)for(let n in a){let s=a[n];a[n]=h(t,o,n,void 0,s,e)}}}function h(t,o,r,a,e,n){if(r==="style")if(!e)o.style.cssText="";else if(typeof e=="string")a!==e&&(o.style.cssText=e);else if(a)for(let s in{...a,...e})!a||e[s]!==a[s]?o.style[s]=e[s]:a[s]&&!e[s]&&(o.style[s]=void 0);else for(let s in e)o.style[s]=e[s];else if(r==="class")if(n)if(e){let s=L(e);o.classList.value=s}else o.classList.value="";else if(e){let s=L(e);o.className=s}else o.className="";else if(r[0]==="o"&&r[1]==="n")if(e){let s=null;if(typeof e=="function"){let i=e;s=l=>t([i,l])}else if(Array.isArray(e)){let i=e,l=e[0];i.length>1?s=()=>t([l,...i.slice(1)]):s=p=>t([l,p])}else typeof e=="object"&&(s=()=>t(e));o[r]=s}else o[r]=null;else e!=null&&e!==!1?o.setAttribute(r,e):o.removeAttribute(r);return e}function L(t){return typeof t=="string"?t:Array.isArray(t)?t.map(L).join(" "):typeof t=="object"?Object.keys(t).filter(o=>t[o]).join(" "):""}var z="a",Z="abbr",w="address",tt="area",et="article",ot="aside",nt="audio",rt="b",st="base",at="bdi",ct="bdo",it="blockquote",pt="body",Tt="br",ft="button",lt="canvas",St="caption",dt="cite",gt="code",xt="col",ut="colgroup",yt="data",Et="datalist",mt="dd",ht="del",At="details",Pt="dfn",Ct="dialog",Mt="div",Nt="dl",Ot="dt",Rt="em",Lt="embed",bt="fieldset",Dt="figcaption",It="figure",Ft="footer",vt="form",Gt="h1",Ht="h2",kt="h3",Ut="h4",Vt="h5",Bt="h6",jt="head",_t="header",Kt="hgroup",Xt="hr",qt="html",Yt="i",Wt="iframe",$t="img",Jt="input",Qt="ins",zt="kbd",Zt="label",wt="legend",te="li",ee="link",oe="main",ne="map",re="mark",se="menu",ae="meta",ce="meter",ie="nav",pe="noscript",Te="object",fe="ol",le="optgroup",Se="option",de="output",ge="p",xe="picture",ue="pre",ye="progress",Ee="q",me="rp",he="rt",Ae="ruby",Pe="s",Ce="samp",Me="script",Ne="section",Oe="select",Re="slot",Le="small",be="source",De="span",Ie="strong",Fe="style",ve="sub",Ge="summary",He="sup",ke="table",Ue="tbody",Ve="td",Be="template",je="textarea",_e="tfoot",Ke="th",Xe="thead",qe="time",Ye="title",We="tr",$e="track",Je="u",Qe="ul",ze="video",Ze="wbr",we="animate",to="animateMotion",eo="animateTransform",oo="circle",no="clipPath",ro="defs",so="desc",ao="ellipse",co="feBlend",io="feColorMatrix",po="feComponentTransfer",To="feComposite",fo="feConvolveMatrix",lo="feDiffuseLighting",So="feDisplacementMap",go="feDistantLight",xo="feDropShadow",uo="feFlood",yo="feFuncA",Eo="feFuncB",mo="feFuncG",ho="feFuncR",Ao="feGaussianBlur",Po="feImage",Co="feMerge",Mo="feMergeNode",No="feMorphology",Oo="feOffset",Ro="fePointLight",Lo="feSpecularLighting",bo="feSpotLight",Do="feTile",Io="feTurbulence",Fo="filter",vo="foreignObject",Go="g",Ho="image",ko="line",Uo="linearGradient",Vo="marker",Bo="mask",jo="metadata",_o="mpath",Ko="path",Xo="pattern",qo="polygon",Yo="polyline",Wo="radialGradient",$o="rect",Jo="set",Qo="stop",zo="svg",Zo="switch",wo="symbol",tn="text",en="textPath",on="tspan",nn="use",rn="view",sn="annotation",an="annotation-xml",cn="maction",pn="math",Tn="merror",fn="mfrac",ln="mi",Sn="mmultiscripts",dn="mn",gn="mo",xn="mover",un="mpadded",yn="mphantom",En="mprescripts",mn="mroot",hn="mrow",An="ms",Pn="mspace",Cn="msqrt",Mn="mstyle",Nn="msub",On="msubsup",Rn="msup",Ln="mtable",bn="mtd",Dn="mtext",In="mtr",Fn="munder",vn="munderover",Gn="semantics";return V(Hn);})();
|
|
1
|
+
"use strict";var V=(()=>{var N=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var H=Object.prototype.hasOwnProperty;var k=(t,o)=>{for(var s in o)N(t,s,{get:o[s],enumerable:!0})},U=(t,o,s,a)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of G(o))!H.call(t,e)&&e!==s&&N(t,e,{get:()=>o[e],enumerable:!(a=v(o,e))||a.enumerable});return t};var V=t=>U(N({},"__esModule",{value:!0}),t);var Hn={};k(Hn,{A:()=>z,ABBR:()=>Z,ADDRESS:()=>w,ANIMATE:()=>we,ANIMATEMOTION:()=>to,ANIMATETRANSFORM:()=>eo,ANNOTATION:()=>sn,ANNOTATION_XML:()=>an,AREA:()=>tt,ARTICLE:()=>et,ASIDE:()=>ot,AUDIO:()=>nt,B:()=>rt,BASE:()=>st,BDI:()=>at,BDO:()=>ct,BLOCKQUOTE:()=>it,BODY:()=>pt,BR:()=>Tt,BUTTON:()=>ft,CANVAS:()=>lt,CAPTION:()=>St,CIRCLE:()=>oo,CITE:()=>dt,CLIPPATH:()=>no,CODE:()=>gt,COL:()=>xt,COLGROUP:()=>ut,DATA:()=>yt,DATALIST:()=>Et,DD:()=>mt,DEFS:()=>ro,DEL:()=>ht,DESC:()=>so,DETAILS:()=>At,DFN:()=>Pt,DIALOG:()=>Ct,DIV:()=>Mt,DL:()=>Nt,DT:()=>Ot,ELLIPSE:()=>ao,EM:()=>Rt,EMBED:()=>Lt,FEBLEND:()=>co,FECOLORMATRIX:()=>io,FECOMPONENTTRANSFER:()=>po,FECOMPOSITE:()=>To,FECONVOLVEMATRIX:()=>fo,FEDIFFUSELIGHTING:()=>lo,FEDISPLACEMENTMAP:()=>So,FEDISTANTLIGHT:()=>go,FEDROPSHADOW:()=>xo,FEFLOOD:()=>uo,FEFUNCA:()=>yo,FEFUNCB:()=>Eo,FEFUNCG:()=>mo,FEFUNCR:()=>ho,FEGAUSSIANBLUR:()=>Ao,FEIMAGE:()=>Po,FEMERGE:()=>Co,FEMERGENODE:()=>Mo,FEMORPHOLOGY:()=>No,FEOFFSET:()=>Oo,FEPOINTLIGHT:()=>Ro,FESPECULARLIGHTING:()=>Lo,FESPOTLIGHT:()=>bo,FETILE:()=>Do,FETURBULENCE:()=>Io,FIELDSET:()=>bt,FIGCAPTION:()=>Dt,FIGURE:()=>It,FILTER:()=>Fo,FOOTER:()=>Ft,FOREIGNOBJECT:()=>vo,FORM:()=>vt,G:()=>Go,H1:()=>Gt,H2:()=>Ht,H3:()=>kt,H4:()=>Ut,H5:()=>Vt,H6:()=>Bt,HEAD:()=>jt,HEADER:()=>_t,HGROUP:()=>Kt,HR:()=>Xt,HTML:()=>qt,I:()=>Yt,IFRAME:()=>Wt,IMAGE:()=>Ho,IMG:()=>$t,INPUT:()=>Jt,INS:()=>Qt,KBD:()=>zt,LABEL:()=>Zt,LEGEND:()=>wt,LI:()=>te,LINE:()=>ko,LINEARGRADIENT:()=>Uo,LINK:()=>ee,MACTION:()=>cn,MAIN:()=>oe,MAP:()=>ne,MARK:()=>re,MARKER:()=>Vo,MASK:()=>Bo,MATH:()=>pn,MENU:()=>se,MERROR:()=>Tn,META:()=>ae,METADATA:()=>jo,METER:()=>ce,MFRAC:()=>fn,MI:()=>ln,MMULTISCRIPTS:()=>Sn,MN:()=>dn,MO:()=>gn,MOVER:()=>xn,MPADDED:()=>un,MPATH:()=>_o,MPHANTOM:()=>yn,MPRESCRIPTS:()=>En,MROOT:()=>mn,MROW:()=>hn,MS:()=>An,MSPACE:()=>Pn,MSQRT:()=>Cn,MSTYLE:()=>Mn,MSUB:()=>Nn,MSUBSUP:()=>On,MSUP:()=>Rn,MTABLE:()=>Ln,MTD:()=>bn,MTEXT:()=>Dn,MTR:()=>In,MUNDER:()=>Fn,MUNDEROVER:()=>vn,NAV:()=>ie,NOSCRIPT:()=>pe,OBJECT:()=>Te,OL:()=>fe,OPTGROUP:()=>le,OPTION:()=>Se,OUTPUT:()=>de,P:()=>ge,PATH:()=>Ko,PATTERN:()=>Xo,PICTURE:()=>xe,POLYGON:()=>qo,POLYLINE:()=>Yo,PRE:()=>ue,PROGRESS:()=>ye,Q:()=>Ee,RADIALGRADIENT:()=>Wo,RECT:()=>$o,RP:()=>me,RT:()=>he,RUBY:()=>Ae,S:()=>Pe,SAMP:()=>Ce,SCRIPT:()=>Me,SECTION:()=>Ne,SELECT:()=>Oe,SEMANTICS:()=>Gn,SET:()=>Jo,SLOT:()=>Re,SMALL:()=>Le,SOURCE:()=>be,SPAN:()=>De,STOP:()=>Qo,STRONG:()=>Ie,STYLE:()=>Fe,SUB:()=>ve,SUMMARY:()=>Ge,SUP:()=>He,SVG:()=>zo,SWITCH:()=>Zo,SYMBOL:()=>wo,TABLE:()=>ke,TBODY:()=>Ue,TD:()=>Ve,TEMPLATE:()=>Be,TEXT:()=>tn,TEXTAREA:()=>je,TEXTPATH:()=>en,TFOOT:()=>_e,TH:()=>Ke,THEAD:()=>Xe,TIME:()=>qe,TITLE:()=>Ye,TR:()=>We,TRACK:()=>$e,TSPAN:()=>on,U:()=>Je,UL:()=>Qe,USE:()=>nn,VIDEO:()=>ze,VIEW:()=>rn,WBR:()=>Ze,app:()=>j,child:()=>$,childCount:()=>W,children:()=>A,childrenStart:()=>C,createPatch:()=>X,createState:()=>K,hydrate:()=>b,memo:()=>_,mergeClass:()=>Y,props:()=>d,tag:()=>q,vode:()=>B});function B(t,o,...s){if(!t)throw new Error("tag must be a string or vode");return Array.isArray(t)?t:o?[t,o,...s]:[t,...s]}function j(t,o,s,...a){if(!t?.parentElement)throw new Error("container must be a valid HTMLElement inside the <html></html> document");if(!o||typeof o!="object")throw new Error("given state must be an object");if(typeof s!="function")throw new Error("dom must be a function that returns a vode");let e={};e.stats={lastRenderTime:0,renderCount:0,liveEffectCount:0,patchCount:0,renderPatchCount:0},Object.defineProperty(o,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async r=>{if(!(!r||typeof r!="function"&&typeof r!="object"))if(e.stats.patchCount++,r?.next){let i=r;e.stats.liveEffectCount++;try{let l=await i.next();for(;l.done===!1;){e.stats.liveEffectCount++;try{e.patch(l.value),l=await i.next()}finally{e.stats.liveEffectCount--}}e.patch(l.value)}finally{e.stats.liveEffectCount--}}else if(r.then){e.stats.liveEffectCount++;try{let i=await r;e.patch(i)}finally{e.stats.liveEffectCount--}}else Array.isArray(r)?typeof r[0]=="function"?r.length>1?e.patch(r[0](e.state,...r.slice(1))):e.patch(r[0](e.state)):e.stats.patchCount--:typeof r=="function"?e.patch(r(e.state)):(e.stats.renderPatchCount++,e.q=u(e.q||{},r,!1),e.isRendering||e.render())}}),Object.defineProperty(e,"render",{enumerable:!1,configurable:!0,writable:!1,value:()=>requestAnimationFrame(()=>{if(e.isRendering||!e.q)return;e.isRendering=!0;let r=Date.now();try{e.state=u(e.state,e.q,!0),e.q=null;let i=s(e.state);e.vode=P(e.state,e.patch,t.parentElement,0,e.vode,i),t.tagName.toUpperCase()!==i[0].toUpperCase()&&(t=e.vode.node,t._vode=e)}finally{e.isRendering=!1,e.stats.renderCount++,e.stats.lastRenderTime=Date.now()-r,e.q&&e.render()}})}),e.patch=o.patch,e.state=o,e.q=null;let n=t;n._vode=e,e.vode=P(o,e.patch,t.parentElement,Array.from(t.parentElement.children).indexOf(t),b(t,!0),s(o));for(let r of a)e.patch(r);return e.patch}function b(t,o){if(t?.nodeType===Node.TEXT_NODE)return t.nodeValue?.trim()!==""?o?t:t.nodeValue:void 0;if(t.nodeType===Node.COMMENT_NODE)return;if(t.nodeType===Node.ELEMENT_NODE){let a=[t.tagName.toLowerCase()];if(o&&(a.node=t),t?.hasAttributes()){let e={},n=t.attributes;for(let r of n)e[r.name]=r.value;a.push(e)}if(t.hasChildNodes()){let e=[];for(let n of t.childNodes){let r=n&&b(n,o);r?a.push(r):n&&o&&e.push(n)}for(let n of e)n.remove()}return a}else return}function _(t,o){return o.__memo=t,o}function K(t){return t}function X(t){return t}function q(t){return t?Array.isArray(t)?t[0]:typeof t=="string"||t.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function d(t){if(Array.isArray(t)&&t.length>1&&t[1]&&!Array.isArray(t[1])&&typeof t[1]=="object"&&t[1].nodeType!==Node.TEXT_NODE)return t[1]}function Y(t,o){if(!t)return o;if(!o)return t;if(typeof t=="string"&&typeof o=="string"){let s=t.split(" "),a=o.split(" "),e=new Set([...s,...a]);return Array.from(e).join(" ").trim()}else if(typeof t=="string"&&Array.isArray(o)){let s=new Set([...o,...t.split(" ")]);return Array.from(s).join(" ").trim()}else if(Array.isArray(t)&&typeof o=="string"){let s=new Set([...t,...o.split(" ")]);return Array.from(s).join(" ").trim()}else if(Array.isArray(t)&&Array.isArray(o)){let s=new Set([...t,...o]);return Array.from(s).join(" ").trim()}else{if(typeof t=="string"&&typeof o=="object")return{[t]:!0,...o};if(typeof t=="object"&&typeof o=="string")return{...t,[o]:!0};if(typeof t=="object"&&typeof o=="object")return{...t,...o};if(typeof t=="object"&&Array.isArray(o)){let s={...t};for(let a of o)s[a]=!0;return s}else if(Array.isArray(t)&&typeof o=="object"){let s={};for(let a of t)s[a]=!0;for(let a of Object.keys(o))s[a]=o[a];return s}}throw new Error(`cannot merge classes of ${t} (${typeof t}) and ${o} (${typeof o})`)}function A(t){let o=C(t);return o>0?t.slice(o):null}function W(t){return t.length-C(t)}function $(t,o){return t[o+C(t)]}function C(t){return d(t)?2:1}function u(t,o,s){if(!o)return t;for(let a in o){let e=o[a];if(e&&typeof e=="object"){let n=t[a];n?Array.isArray(e)?t[a]=[...e]:e instanceof Date&&n!==e?t[a]=new Date(e):Array.isArray(n)?t[a]=u({},e,s):typeof n=="object"?u(t[a],e,s):t[a]=u({},e,s):Array.isArray(e)?t[a]=[...e]:e instanceof Date?t[a]=new Date(e):t[a]=u({},e,s)}else e===void 0&&s?delete t[a]:t[a]=e}return t}function P(t,o,s,a,e,n,r){n=O(t,n,e);let i=!n||typeof n=="number"||typeof n=="boolean";if(n===e||!e&&i)return e;let l=e?.nodeType===Node.TEXT_NODE,p=l?e:e?.node;if(i){p?.onUnmount&&o(p.onUnmount(p)),p?.remove();return}let E=!i&&Q(n),m=!i&&J(n),M=!!n&&typeof n!="string"&&!!(n?.node||n?.nodeType===Node.TEXT_NODE);if(!E&&!m&&!M&&!e)throw new Error("Invalid vode: "+typeof n+" "+JSON.stringify(n));if(M&&E?n=n.wholeText:M&&m&&(n=[...n]),l&&E)return p.nodeValue!==n&&(p.nodeValue=n),e;if(E&&(!p||!l)){let T=document.createTextNode(n);return p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):s.childNodes[a]?s.insertBefore(T,s.childNodes[a]):s.appendChild(T),T}if(m&&(!p||l||e[0]!==n[0])){r=r||n[0]==="svg";let T=r?document.createElementNS("http://www.w3.org/2000/svg",n[0]):document.createElement(n[0]);n.node=T;let y=n;1 in y&&(y[1]=O(t,y[1],void 0));let g=d(n);R(o,T,void 0,g,r),p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):s.childNodes[a]?s.insertBefore(T,s.childNodes[a]):s.appendChild(T);let S=A(n);if(S)for(let f=0;f<S.length;f++){let c=S[f],x=P(t,o,T,f,void 0,c,r);n[g?f+2:f+1]=x}return T.onMount&&o(T.onMount(T)),n}if(!l&&m&&e[0]===n[0]){r=r||n[0]==="svg",n.node=p;let T=n,y=e,g=!1;if(T[1]?.__memo){let c=T[1];if(T[1]=O(t,T[1],y[1]),c!==T[1]){let x=d(n);R(o,p,d(e),x,r),g=!!x}}else{let c=d(n);R(o,p,d(e),c,r),g=!!c}let S=A(n),f=A(e);if(S){for(let c=0;c<S.length;c++){let x=S[c],F=f&&f[c],D=P(t,o,p,c,F,x,r);D&&(n[g?c+2:c+1]=D)}for(let c=S.length;f&&c<f.length;c++)f[c]?.node?f[c].node.remove():f[c]?.nodeType===Node.TEXT_NODE&&f[c].remove()}for(let c=S?.length||0;c<f?.length;c++)f[c]?.node?f[c].node.remove():f[c]?.nodeType===Node.TEXT_NODE&&f[c].remove();return n}}function J(t){return Array.isArray(t)&&t.length>0&&typeof t[0]=="string"}function Q(t){return typeof t=="string"||t?.nodeType===Node.TEXT_NODE}function O(t,o,s){if(typeof o!="function")return o;let a=o?.__memo,e=s?.__memo;if(Array.isArray(a)&&Array.isArray(e)&&a.length===e.length){let r=!0;for(let i=0;i<a.length;i++)if(a[i]!==e[i]){r=!1;break}if(r)return s}let n=I(o,t);return typeof n=="object"&&(n.__memo=o?.__memo),n}function I(t,o){return typeof t=="function"?I(t(o),o):t}function R(t,o,s,a,e){if(!(!a&&!s)){if(s)for(let n in s){let r=s[n],i=a?.[n];r!==i&&(a?a[n]=h(t,o,n,r,i,e):h(t,o,n,r,void 0,e))}if(a&&s){for(let n in a)if(!(n in s)){let r=a[n];a[n]=h(t,o,n,void 0,r,e)}}else if(a)for(let n in a){let r=a[n];a[n]=h(t,o,n,void 0,r,e)}}}function h(t,o,s,a,e,n){if(s==="style")if(!e)o.style.cssText="";else if(typeof e=="string")a!==e&&(o.style.cssText=e);else if(a)for(let r in{...a,...e})!a||e[r]!==a[r]?o.style[r]=e[r]:a[r]&&!e[r]&&(o.style[r]=void 0);else for(let r in e)o.style[r]=e[r];else if(s==="class")if(n)if(e){let r=L(e);o.classList.value=r}else o.classList.value="";else if(e){let r=L(e);o.className=r}else o.className="";else if(s[0]==="o"&&s[1]==="n")if(e){let r=null;if(typeof e=="function"){let i=e;r=l=>t([i,l])}else if(Array.isArray(e)){let i=e,l=e[0];i.length>1?r=()=>t([l,...i.slice(1)]):r=p=>t([l,p])}else typeof e=="object"&&(r=()=>t(e));o[s]=r}else o[s]=null;else e!=null&&e!==!1?o.setAttribute(s,e):o.removeAttribute(s);return e}function L(t){return typeof t=="string"?t:Array.isArray(t)?t.map(L).join(" "):typeof t=="object"?Object.keys(t).filter(o=>t[o]).join(" "):""}var z="a",Z="abbr",w="address",tt="area",et="article",ot="aside",nt="audio",rt="b",st="base",at="bdi",ct="bdo",it="blockquote",pt="body",Tt="br",ft="button",lt="canvas",St="caption",dt="cite",gt="code",xt="col",ut="colgroup",yt="data",Et="datalist",mt="dd",ht="del",At="details",Pt="dfn",Ct="dialog",Mt="div",Nt="dl",Ot="dt",Rt="em",Lt="embed",bt="fieldset",Dt="figcaption",It="figure",Ft="footer",vt="form",Gt="h1",Ht="h2",kt="h3",Ut="h4",Vt="h5",Bt="h6",jt="head",_t="header",Kt="hgroup",Xt="hr",qt="html",Yt="i",Wt="iframe",$t="img",Jt="input",Qt="ins",zt="kbd",Zt="label",wt="legend",te="li",ee="link",oe="main",ne="map",re="mark",se="menu",ae="meta",ce="meter",ie="nav",pe="noscript",Te="object",fe="ol",le="optgroup",Se="option",de="output",ge="p",xe="picture",ue="pre",ye="progress",Ee="q",me="rp",he="rt",Ae="ruby",Pe="s",Ce="samp",Me="script",Ne="section",Oe="select",Re="slot",Le="small",be="source",De="span",Ie="strong",Fe="style",ve="sub",Ge="summary",He="sup",ke="table",Ue="tbody",Ve="td",Be="template",je="textarea",_e="tfoot",Ke="th",Xe="thead",qe="time",Ye="title",We="tr",$e="track",Je="u",Qe="ul",ze="video",Ze="wbr",we="animate",to="animateMotion",eo="animateTransform",oo="circle",no="clipPath",ro="defs",so="desc",ao="ellipse",co="feBlend",io="feColorMatrix",po="feComponentTransfer",To="feComposite",fo="feConvolveMatrix",lo="feDiffuseLighting",So="feDisplacementMap",go="feDistantLight",xo="feDropShadow",uo="feFlood",yo="feFuncA",Eo="feFuncB",mo="feFuncG",ho="feFuncR",Ao="feGaussianBlur",Po="feImage",Co="feMerge",Mo="feMergeNode",No="feMorphology",Oo="feOffset",Ro="fePointLight",Lo="feSpecularLighting",bo="feSpotLight",Do="feTile",Io="feTurbulence",Fo="filter",vo="foreignObject",Go="g",Ho="image",ko="line",Uo="linearGradient",Vo="marker",Bo="mask",jo="metadata",_o="mpath",Ko="path",Xo="pattern",qo="polygon",Yo="polyline",Wo="radialGradient",$o="rect",Jo="set",Qo="stop",zo="svg",Zo="switch",wo="symbol",tn="text",en="textPath",on="tspan",nn="use",rn="view",sn="annotation",an="annotation-xml",cn="maction",pn="math",Tn="merror",fn="mfrac",ln="mi",Sn="mmultiscripts",dn="mn",gn="mo",xn="mover",un="mpadded",yn="mphantom",En="mprescripts",mn="mroot",hn="mrow",An="ms",Pn="mspace",Cn="msqrt",Mn="mstyle",Nn="msub",On="msubsup",Rn="msup",Ln="mtable",bn="mtd",Dn="mtext",In="mtr",Fn="munder",vn="munderover",Gn="semantics";return V(Hn);})();
|
package/dist/vode.min.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
function P(f,z,...F){if(!f)throw Error("tag must be a string or vode");if(Array.isArray(f))return f;else if(z)return[f,z,...F];else return[f,...F]}function g(f,z,F,...G){if(!f?.parentElement)throw Error("container must be a valid HTMLElement inside the <html></html> document");if(!z||typeof z!=="object")throw Error("given state must be an object");if(typeof F!=="function")throw Error("dom must be a function that returns a vode");let q={};q.stats={lastRenderTime:0,renderCount:0,liveEffectCount:0,patchCount:0,renderPatchCount:0},Object.defineProperty(z,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async(E)=>{if(!E||typeof E!=="function"&&typeof E!=="object")return;if(q.stats.patchCount++,E?.next){let Q=E;q.stats.liveEffectCount++;try{let Y=await Q.next();while(Y.done===!1){q.stats.liveEffectCount++;try{q.patch(Y.value),Y=await Q.next()}finally{q.stats.liveEffectCount--}}q.patch(Y.value)}finally{q.stats.liveEffectCount--}}else if(E.then){q.stats.liveEffectCount++;try{let Q=await E;q.patch(Q)}finally{q.stats.liveEffectCount--}}else if(Array.isArray(E))if(typeof E[0]==="function")if(E.length>1)q.patch(E[0](q.state,...E.slice(1)));else q.patch(E[0](q.state));else q.stats.patchCount--;else if(typeof E==="function")q.patch(E(q.state));else if(q.stats.renderPatchCount++,q.q=A(q.q||{},E,!1),!q.isRendering)q.render()}}),Object.defineProperty(q,"render",{enumerable:!1,configurable:!0,writable:!1,value:()=>requestAnimationFrame(()=>{if(q.isRendering||!q.q)return;q.isRendering=!0;let E=Date.now();try{q.state=A(q.state,q.q,!0),q.q=null;let Q=F(q.state);if(q.vode=M(q.state,q.patch,f.parentElement,0,q.vode,Q),f.tagName.toUpperCase()!==Q[0].toUpperCase())f=q.vode.node,f._vode=q}finally{if(q.isRendering=!1,q.stats.renderCount++,q.stats.lastRenderTime=Date.now()-E,q.q)q.render()}})}),q.patch=z.patch,q.state=z,q.q=null;let B=f;B._vode=q,q.vode=M(z,q.patch,f.parentElement,Array.from(f.parentElement.children).indexOf(f),k(f),F(z));for(let E of G)q.patch(E);return q.patch}function k(f){if(f?.nodeType===Node.TEXT_NODE){if(f.nodeValue?.trim()!=="")return f;return}else if(f.nodeType===Node.COMMENT_NODE)return;else if(f.nodeType===Node.ELEMENT_NODE){let F=[f.tagName.toLowerCase()];if(F.node=f,f?.hasAttributes()){let G={},q=f.attributes;for(let B of q)G[B.name]=B.value;F.push(G)}if(f.hasChildNodes()){let G=[];for(let q of f.childNodes){let B=q&&k(q);if(B)F.push(B);else if(q)G.push(q)}for(let q of G)q.remove()}return F}else return}function h(f,z){return z.__memo=f,z}function u(f){return f}function v(f){return f}function c(f){return f?Array.isArray(f)?f[0]:typeof f==="string"||f.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function L(f){if(Array.isArray(f)&&f.length>1&&f[1]&&!Array.isArray(f[1])){if(typeof f[1]==="object"&&f[1].nodeType!==Node.TEXT_NODE)return f[1]}return}function i(f,z){if(!f)return z;if(!z)return f;if(typeof f==="string"&&typeof z==="string"){let F=f.split(" "),G=z.split(" "),q=new Set([...F,...G]);return Array.from(q).join(" ").trim()}else if(typeof f==="string"&&Array.isArray(z)){let F=new Set([...z,...f.split(" ")]);return Array.from(F).join(" ").trim()}else if(Array.isArray(f)&&typeof z==="string"){let F=new Set([...f,...z.split(" ")]);return Array.from(F).join(" ").trim()}else if(Array.isArray(f)&&Array.isArray(z)){let F=new Set([...f,...z]);return Array.from(F).join(" ").trim()}else if(typeof f==="string"&&typeof z==="object")return{[f]:!0,...z};else if(typeof f==="object"&&typeof z==="string")return{...f,[z]:!0};else if(typeof f==="object"&&typeof z==="object")return{...f,...z};else if(typeof f==="object"&&Array.isArray(z)){let F={...f};for(let G of z)F[G]=!0;return F}else if(Array.isArray(f)&&typeof z==="object"){let F={};for(let G of f)F[G]=!0;for(let G of Object.keys(z))F[G]=z[G];return F}throw Error(`cannot merge classes of ${f} (${typeof f}) and ${z} (${typeof z})`)}function T(f){let z=x(f);if(z>0)return f.slice(z);return null}function V(f){return f.length-x(f)}function p(f,z){return f[z+x(f)]}function x(f){return L(f)?2:1}function A(f,z,F){if(!z)return f;for(let G in z){let q=z[G];if(q&&typeof q==="object"){let B=f[G];if(B)if(Array.isArray(q))f[G]=[...q];else if(q instanceof Date&&B!==q)f[G]=new Date(q);else if(Array.isArray(B))f[G]=A({},q,F);else if(typeof B==="object")A(f[G],q,F);else f[G]=A({},q,F);else if(Array.isArray(q))f[G]=[...q];else if(q instanceof Date)f[G]=new Date(q);else f[G]=A({},q,F)}else if(q===void 0&&F)delete f[G];else f[G]=q}return f}function M(f,z,F,G,q,B,E){B=I(f,B,q);let Q=!B||typeof B==="number"||typeof B==="boolean";if(B===q||!q&&Q)return q;let Y=q?.nodeType===Node.TEXT_NODE,U=Y?q:q?.node;if(Q){U?.onUnmount&&z(U.onUnmount(U)),U?.remove();return}let O=!Q&&m(B),H=!Q&&y(B),D=!!B&&typeof B!=="string"&&!!(B?.node||B?.nodeType===Node.TEXT_NODE);if(!O&&!H&&!D&&!q)throw Error("Invalid vode: "+typeof B+" "+JSON.stringify(B));else if(D&&O)B=B.wholeText;else if(D&&H)B=[...B];if(Y&&O){if(U.nodeValue!==B)U.nodeValue=B;return q}if(O&&(!U||!Y)){let W=document.createTextNode(B);if(U)U.onUnmount&&z(U.onUnmount(U)),U.replaceWith(W);else if(F.childNodes[G])F.insertBefore(W,F.childNodes[G]);else F.appendChild(W);return W}if(H&&(!U||Y||q[0]!==B[0])){E=E||B[0]==="svg";let W=E?document.createElementNS("http://www.w3.org/2000/svg",B[0]):document.createElement(B[0]);B.node=W;let R=B;if(1 in R)R[1]=I(f,R[1],void 0);let $=L(B);if(K(z,W,void 0,$,E),U)U.onUnmount&&z(U.onUnmount(U)),U.replaceWith(W);else if(F.childNodes[G])F.insertBefore(W,F.childNodes[G]);else F.appendChild(W);let Z=T(B);if(Z)for(let X=0;X<Z.length;X++){let J=Z[X],j=M(f,z,W,X,void 0,J,E);B[$?X+2:X+1]=j}return W.onMount&&z(W.onMount(W)),B}if(!Y&&H&&q[0]===B[0]){E=E||B[0]==="svg",B.node=U;let W=B,R=q,$=!1;if(W[1]?.__memo){let J=W[1];if(W[1]=I(f,W[1],R[1]),J!==W[1]){let j=L(B);K(z,U,L(q),j,E),$=!!j}}else{let J=L(B);K(z,U,L(q),J,E),$=!!J}let Z=T(B),X=T(q);if(Z){for(let J=0;J<Z.length;J++){let j=Z[J],b=X&&X[J],N=M(f,z,U,J,b,j,E);if(N)B[$?J+2:J+1]=N}for(let J=Z.length;X&&J<X.length;J++)if(X[J]?.node)X[J].node.remove();else if(X[J]?.nodeType===Node.TEXT_NODE)X[J].remove()}for(let J=Z?.length||0;J<X?.length;J++)if(X[J]?.node)X[J].node.remove();else if(X[J]?.nodeType===Node.TEXT_NODE)X[J].remove();return B}return}function y(f){return Array.isArray(f)&&f.length>0&&typeof f[0]==="string"}function m(f){return typeof f==="string"||f?.nodeType===Node.TEXT_NODE}function I(f,z,F){if(typeof z!=="function")return z;let G=z?.__memo,q=F?.__memo;if(Array.isArray(G)&&Array.isArray(q)&&G.length===q.length){let E=!0;for(let Q=0;Q<G.length;Q++)if(G[Q]!==q[Q]){E=!1;break}if(E)return F}let B=_(z,f);if(typeof B==="object")B.__memo=z?.__memo;return B}function _(f,z){if(typeof f==="function")return _(f(z),z);else return f}function K(f,z,F,G,q){if(!G&&!F)return;if(F)for(let B in F){let E=F[B],Q=G?.[B];if(E!==Q)if(G)G[B]=C(f,z,B,E,Q,q);else C(f,z,B,E,void 0,q)}if(G&&F){for(let B in G)if(!(B in F)){let E=G[B];G[B]=C(f,z,B,void 0,E,q)}}else if(G)for(let B in G){let E=G[B];G[B]=C(f,z,B,void 0,E,q)}}function C(f,z,F,G,q,B){if(F==="style")if(!q)z.style.cssText="";else if(typeof q==="string"){if(G!==q)z.style.cssText=q}else if(G){for(let E in{...G,...q})if(!G||q[E]!==G[E])z.style[E]=q[E];else if(G[E]&&!q[E])z.style[E]=void 0}else for(let E in q)z.style[E]=q[E];else if(F==="class")if(B)if(q){let E=S(q);z.classList.value=E}else z.classList.value="";else if(q){let E=S(q);z.className=E}else z.className="";else if(F[0]==="o"&&F[1]==="n")if(q){let E=null;if(typeof q==="function"){let Q=q;E=(Y)=>f([Q,Y])}else if(Array.isArray(q)){let Q=q,Y=q[0];if(Q.length>1)E=()=>f([Y,...Q.slice(1)]);else E=(U)=>f([Y,U])}else if(typeof q==="object")E=()=>f(q);z[F]=E}else z[F]=null;else if(q!==null&&q!==void 0&&q!==!1)z.setAttribute(F,q);else z.removeAttribute(F);return q}function S(f){if(typeof f==="string")return f;else if(Array.isArray(f))return f.map(S).join(" ");else if(typeof f==="object")return Object.keys(f).filter((z)=>f[z]).join(" ");else return""}var s="a",r="abbr",l="address",t="area",n="article",a="aside",d="audio",o="b",e="base",ff="bdi",qf="bdo",zf="blockquote",Bf="body",Ef="br",Ff="button",Gf="canvas",Jf="caption",Qf="cite",Uf="code",Wf="col",Xf="colgroup",Yf="data",Zf="datalist",$f="dd",jf="del",Lf="details",Af="dfn",Rf="dialog",Of="div",Hf="dl",Cf="dt",Mf="em",Df="embed",Tf="fieldset",If="figcaption",Kf="figure",Sf="footer",xf="form",Nf="h1",kf="h2",_f="h3",bf="h4",yf="h5",mf="h6",Pf="head",gf="header",hf="hgroup",uf="hr",vf="html",cf="i",Vf="iframe",pf="img",wf="input",sf="ins",rf="kbd",lf="label",tf="legend",nf="li",af="link",df="main",of="map",ef="mark",fq="menu",qq="meta",zq="meter",Bq="nav",Eq="noscript",Fq="object",Gq="ol",Jq="optgroup",Qq="option",Uq="output",Wq="p",Xq="picture",Yq="pre",Zq="progress",$q="q",jq="rp",Lq="rt",Aq="ruby",Rq="s",Oq="samp",Hq="script",Cq="section",Mq="select",Dq="slot",Tq="small",Iq="source",Kq="span",Sq="strong",xq="style",Nq="sub",kq="summary",_q="sup",bq="table",yq="tbody",mq="td",Pq="template",gq="textarea",hq="tfoot",uq="th",vq="thead",cq="time",iq="title",Vq="tr",pq="track",wq="u",sq="ul",rq="video",lq="wbr",tq="animate",nq="animateMotion",aq="animateTransform",dq="circle",oq="clipPath",eq="defs",fz="desc",qz="ellipse",zz="feBlend",Bz="feColorMatrix",Ez="feComponentTransfer",Fz="feComposite",Gz="feConvolveMatrix",Jz="feDiffuseLighting",Qz="feDisplacementMap",Uz="feDistantLight",Wz="feDropShadow",Xz="feFlood",Yz="feFuncA",Zz="feFuncB",$z="feFuncG",jz="feFuncR",Lz="feGaussianBlur",Az="feImage",Rz="feMerge",Oz="feMergeNode",Hz="feMorphology",Cz="feOffset",Mz="fePointLight",Dz="feSpecularLighting",Tz="feSpotLight",Iz="feTile",Kz="feTurbulence",Sz="filter",xz="foreignObject",Nz="g",kz="image",_z="line",bz="linearGradient",yz="marker",mz="mask",Pz="metadata",gz="mpath",hz="path",uz="pattern",vz="polygon",cz="polyline",iz="radialGradient",Vz="rect",pz="set",wz="stop",sz="svg",rz="switch",lz="symbol",tz="text",nz="textPath",az="tspan",dz="use",oz="view",ez="annotation",fB="annotation-xml",qB="maction",zB="math",BB="merror",EB="mfrac",FB="mi",GB="mmultiscripts",JB="mn",QB="mo",UB="mover",WB="mpadded",XB="mphantom",YB="mprescripts",ZB="mroot",$B="mrow",jB="ms",LB="mspace",AB="msqrt",RB="mstyle",OB="msub",HB="msubsup",CB="msup",MB="mtable",DB="mtd",TB="mtext",IB="mtr",KB="munder",SB="munderover",xB="semantics";export{P as vode,c as tag,L as props,i as mergeClass,h as memo,k as hydrate,u as createState,v as createPatch,x as childrenStart,T as children,V as childCount,p as child,g as app,lq as WBR,oz as VIEW,rq as VIDEO,dz as USE,sq as UL,wq as U,az as TSPAN,pq as TRACK,Vq as TR,iq as TITLE,cq as TIME,vq as THEAD,uq as TH,hq as TFOOT,nz as TEXTPATH,gq as TEXTAREA,tz as TEXT,Pq as TEMPLATE,mq as TD,yq as TBODY,bq as TABLE,lz as SYMBOL,rz as SWITCH,sz as SVG,_q as SUP,kq as SUMMARY,Nq as SUB,xq as STYLE,Sq as STRONG,wz as STOP,Kq as SPAN,Iq as SOURCE,Tq as SMALL,Dq as SLOT,pz as SET,xB as SEMANTICS,Mq as SELECT,Cq as SECTION,Hq as SCRIPT,Oq as SAMP,Rq as S,Aq as RUBY,Lq as RT,jq as RP,Vz as RECT,iz as RADIALGRADIENT,$q as Q,Zq as PROGRESS,Yq as PRE,cz as POLYLINE,vz as POLYGON,Xq as PICTURE,uz as PATTERN,hz as PATH,Wq as P,Uq as OUTPUT,Qq as OPTION,Jq as OPTGROUP,Gq as OL,Fq as OBJECT,Eq as NOSCRIPT,Bq as NAV,SB as MUNDEROVER,KB as MUNDER,IB as MTR,TB as MTEXT,DB as MTD,MB as MTABLE,CB as MSUP,HB as MSUBSUP,OB as MSUB,RB as MSTYLE,AB as MSQRT,LB as MSPACE,jB as MS,$B as MROW,ZB as MROOT,YB as MPRESCRIPTS,XB as MPHANTOM,gz as MPATH,WB as MPADDED,UB as MOVER,QB as MO,JB as MN,GB as MMULTISCRIPTS,FB as MI,EB as MFRAC,zq as METER,Pz as METADATA,qq as META,BB as MERROR,fq as MENU,zB as MATH,mz as MASK,yz as MARKER,ef as MARK,of as MAP,df as MAIN,qB as MACTION,af as LINK,bz as LINEARGRADIENT,_z as LINE,nf as LI,tf as LEGEND,lf as LABEL,rf as KBD,sf as INS,wf as INPUT,pf as IMG,kz as IMAGE,Vf as IFRAME,cf as I,vf as HTML,uf as HR,hf as HGROUP,gf as HEADER,Pf as HEAD,mf as H6,yf as H5,bf as H4,_f as H3,kf as H2,Nf as H1,Nz as G,xf as FORM,xz as FOREIGNOBJECT,Sf as FOOTER,Sz as FILTER,Kf as FIGURE,If as FIGCAPTION,Tf as FIELDSET,Kz as FETURBULENCE,Iz as FETILE,Tz as FESPOTLIGHT,Dz as FESPECULARLIGHTING,Mz as FEPOINTLIGHT,Cz as FEOFFSET,Hz as FEMORPHOLOGY,Oz as FEMERGENODE,Rz as FEMERGE,Az as FEIMAGE,Lz as FEGAUSSIANBLUR,jz as FEFUNCR,$z as FEFUNCG,Zz as FEFUNCB,Yz as FEFUNCA,Xz as FEFLOOD,Wz as FEDROPSHADOW,Uz as FEDISTANTLIGHT,Qz as FEDISPLACEMENTMAP,Jz as FEDIFFUSELIGHTING,Gz as FECONVOLVEMATRIX,Fz as FECOMPOSITE,Ez as FECOMPONENTTRANSFER,Bz as FECOLORMATRIX,zz as FEBLEND,Df as EMBED,Mf as EM,qz as ELLIPSE,Cf as DT,Hf as DL,Of as DIV,Rf as DIALOG,Af as DFN,Lf as DETAILS,fz as DESC,jf as DEL,eq as DEFS,$f as DD,Zf as DATALIST,Yf as DATA,Xf as COLGROUP,Wf as COL,Uf as CODE,oq as CLIPPATH,Qf as CITE,dq as CIRCLE,Jf as CAPTION,Gf as CANVAS,Ff as BUTTON,Ef as BR,Bf as BODY,zf as BLOCKQUOTE,qf as BDO,ff as BDI,e as BASE,o as B,d as AUDIO,a as ASIDE,n as ARTICLE,t as AREA,fB as ANNOTATION_XML,ez as ANNOTATION,aq as ANIMATETRANSFORM,nq as ANIMATEMOTION,tq as ANIMATE,l as ADDRESS,r as ABBR,s as A};
|
|
1
|
+
function P(f,z,...J){if(!f)throw Error("tag must be a string or vode");if(Array.isArray(f))return f;else if(z)return[f,z,...J];else return[f,...J]}function g(f,z,J,...G){if(!f?.parentElement)throw Error("container must be a valid HTMLElement inside the <html></html> document");if(!z||typeof z!=="object")throw Error("given state must be an object");if(typeof J!=="function")throw Error("dom must be a function that returns a vode");let q={};q.stats={lastRenderTime:0,renderCount:0,liveEffectCount:0,patchCount:0,renderPatchCount:0},Object.defineProperty(z,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async(E)=>{if(!E||typeof E!=="function"&&typeof E!=="object")return;if(q.stats.patchCount++,E?.next){let U=E;q.stats.liveEffectCount++;try{let Z=await U.next();while(Z.done===!1){q.stats.liveEffectCount++;try{q.patch(Z.value),Z=await U.next()}finally{q.stats.liveEffectCount--}}q.patch(Z.value)}finally{q.stats.liveEffectCount--}}else if(E.then){q.stats.liveEffectCount++;try{let U=await E;q.patch(U)}finally{q.stats.liveEffectCount--}}else if(Array.isArray(E))if(typeof E[0]==="function")if(E.length>1)q.patch(E[0](q.state,...E.slice(1)));else q.patch(E[0](q.state));else q.stats.patchCount--;else if(typeof E==="function")q.patch(E(q.state));else if(q.stats.renderPatchCount++,q.q=O(q.q||{},E,!1),!q.isRendering)q.render()}}),Object.defineProperty(q,"render",{enumerable:!1,configurable:!0,writable:!1,value:()=>requestAnimationFrame(()=>{if(q.isRendering||!q.q)return;q.isRendering=!0;let E=Date.now();try{q.state=O(q.state,q.q,!0),q.q=null;let U=J(q.state);if(q.vode=D(q.state,q.patch,f.parentElement,0,q.vode,U),f.tagName.toUpperCase()!==U[0].toUpperCase())f=q.vode.node,f._vode=q}finally{if(q.isRendering=!1,q.stats.renderCount++,q.stats.lastRenderTime=Date.now()-E,q.q)q.render()}})}),q.patch=z.patch,q.state=z,q.q=null;let B=f;B._vode=q,q.vode=D(z,q.patch,f.parentElement,Array.from(f.parentElement.children).indexOf(f),k(f,!0),J(z));for(let E of G)q.patch(E);return q.patch}function k(f,z){if(f?.nodeType===Node.TEXT_NODE){if(f.nodeValue?.trim()!=="")return z?f:f.nodeValue;return}else if(f.nodeType===Node.COMMENT_NODE)return;else if(f.nodeType===Node.ELEMENT_NODE){let G=[f.tagName.toLowerCase()];if(z)G.node=f;if(f?.hasAttributes()){let q={},B=f.attributes;for(let E of B)q[E.name]=E.value;G.push(q)}if(f.hasChildNodes()){let q=[];for(let B of f.childNodes){let E=B&&k(B,z);if(E)G.push(E);else if(B&&z)q.push(B)}for(let B of q)B.remove()}return G}else return}function h(f,z){return z.__memo=f,z}function u(f){return f}function v(f){return f}function c(f){return f?Array.isArray(f)?f[0]:typeof f==="string"||f.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function A(f){if(Array.isArray(f)&&f.length>1&&f[1]&&!Array.isArray(f[1])){if(typeof f[1]==="object"&&f[1].nodeType!==Node.TEXT_NODE)return f[1]}return}function i(f,z){if(!f)return z;if(!z)return f;if(typeof f==="string"&&typeof z==="string"){let J=f.split(" "),G=z.split(" "),q=new Set([...J,...G]);return Array.from(q).join(" ").trim()}else if(typeof f==="string"&&Array.isArray(z)){let J=new Set([...z,...f.split(" ")]);return Array.from(J).join(" ").trim()}else if(Array.isArray(f)&&typeof z==="string"){let J=new Set([...f,...z.split(" ")]);return Array.from(J).join(" ").trim()}else if(Array.isArray(f)&&Array.isArray(z)){let J=new Set([...f,...z]);return Array.from(J).join(" ").trim()}else if(typeof f==="string"&&typeof z==="object")return{[f]:!0,...z};else if(typeof f==="object"&&typeof z==="string")return{...f,[z]:!0};else if(typeof f==="object"&&typeof z==="object")return{...f,...z};else if(typeof f==="object"&&Array.isArray(z)){let J={...f};for(let G of z)J[G]=!0;return J}else if(Array.isArray(f)&&typeof z==="object"){let J={};for(let G of f)J[G]=!0;for(let G of Object.keys(z))J[G]=z[G];return J}throw Error(`cannot merge classes of ${f} (${typeof f}) and ${z} (${typeof z})`)}function R(f){let z=x(f);if(z>0)return f.slice(z);return null}function V(f){return f.length-x(f)}function p(f,z){return f[z+x(f)]}function x(f){return A(f)?2:1}function O(f,z,J){if(!z)return f;for(let G in z){let q=z[G];if(q&&typeof q==="object"){let B=f[G];if(B)if(Array.isArray(q))f[G]=[...q];else if(q instanceof Date&&B!==q)f[G]=new Date(q);else if(Array.isArray(B))f[G]=O({},q,J);else if(typeof B==="object")O(f[G],q,J);else f[G]=O({},q,J);else if(Array.isArray(q))f[G]=[...q];else if(q instanceof Date)f[G]=new Date(q);else f[G]=O({},q,J)}else if(q===void 0&&J)delete f[G];else f[G]=q}return f}function D(f,z,J,G,q,B,E){B=I(f,B,q);let U=!B||typeof B==="number"||typeof B==="boolean";if(B===q||!q&&U)return q;let Z=q?.nodeType===Node.TEXT_NODE,W=Z?q:q?.node;if(U){W?.onUnmount&&z(W.onUnmount(W)),W?.remove();return}let C=!U&&m(B),F=!U&&y(B),T=!!B&&typeof B!=="string"&&!!(B?.node||B?.nodeType===Node.TEXT_NODE);if(!C&&!F&&!T&&!q)throw Error("Invalid vode: "+typeof B+" "+JSON.stringify(B));else if(T&&C)B=B.wholeText;else if(T&&F)B=[...B];if(Z&&C){if(W.nodeValue!==B)W.nodeValue=B;return q}if(C&&(!W||!Z)){let X=document.createTextNode(B);if(W)W.onUnmount&&z(W.onUnmount(W)),W.replaceWith(X);else if(J.childNodes[G])J.insertBefore(X,J.childNodes[G]);else J.appendChild(X);return X}if(F&&(!W||Z||q[0]!==B[0])){E=E||B[0]==="svg";let X=E?document.createElementNS("http://www.w3.org/2000/svg",B[0]):document.createElement(B[0]);B.node=X;let H=B;if(1 in H)H[1]=I(f,H[1],void 0);let j=A(B);if(K(z,X,void 0,j,E),W)W.onUnmount&&z(W.onUnmount(W)),W.replaceWith(X);else if(J.childNodes[G])J.insertBefore(X,J.childNodes[G]);else J.appendChild(X);let $=R(B);if($)for(let Y=0;Y<$.length;Y++){let Q=$[Y],L=D(f,z,X,Y,void 0,Q,E);B[j?Y+2:Y+1]=L}return X.onMount&&z(X.onMount(X)),B}if(!Z&&F&&q[0]===B[0]){E=E||B[0]==="svg",B.node=W;let X=B,H=q,j=!1;if(X[1]?.__memo){let Q=X[1];if(X[1]=I(f,X[1],H[1]),Q!==X[1]){let L=A(B);K(z,W,A(q),L,E),j=!!L}}else{let Q=A(B);K(z,W,A(q),Q,E),j=!!Q}let $=R(B),Y=R(q);if($){for(let Q=0;Q<$.length;Q++){let L=$[Q],b=Y&&Y[Q],N=D(f,z,W,Q,b,L,E);if(N)B[j?Q+2:Q+1]=N}for(let Q=$.length;Y&&Q<Y.length;Q++)if(Y[Q]?.node)Y[Q].node.remove();else if(Y[Q]?.nodeType===Node.TEXT_NODE)Y[Q].remove()}for(let Q=$?.length||0;Q<Y?.length;Q++)if(Y[Q]?.node)Y[Q].node.remove();else if(Y[Q]?.nodeType===Node.TEXT_NODE)Y[Q].remove();return B}return}function y(f){return Array.isArray(f)&&f.length>0&&typeof f[0]==="string"}function m(f){return typeof f==="string"||f?.nodeType===Node.TEXT_NODE}function I(f,z,J){if(typeof z!=="function")return z;let G=z?.__memo,q=J?.__memo;if(Array.isArray(G)&&Array.isArray(q)&&G.length===q.length){let E=!0;for(let U=0;U<G.length;U++)if(G[U]!==q[U]){E=!1;break}if(E)return J}let B=_(z,f);if(typeof B==="object")B.__memo=z?.__memo;return B}function _(f,z){if(typeof f==="function")return _(f(z),z);else return f}function K(f,z,J,G,q){if(!G&&!J)return;if(J)for(let B in J){let E=J[B],U=G?.[B];if(E!==U)if(G)G[B]=M(f,z,B,E,U,q);else M(f,z,B,E,void 0,q)}if(G&&J){for(let B in G)if(!(B in J)){let E=G[B];G[B]=M(f,z,B,void 0,E,q)}}else if(G)for(let B in G){let E=G[B];G[B]=M(f,z,B,void 0,E,q)}}function M(f,z,J,G,q,B){if(J==="style")if(!q)z.style.cssText="";else if(typeof q==="string"){if(G!==q)z.style.cssText=q}else if(G){for(let E in{...G,...q})if(!G||q[E]!==G[E])z.style[E]=q[E];else if(G[E]&&!q[E])z.style[E]=void 0}else for(let E in q)z.style[E]=q[E];else if(J==="class")if(B)if(q){let E=S(q);z.classList.value=E}else z.classList.value="";else if(q){let E=S(q);z.className=E}else z.className="";else if(J[0]==="o"&&J[1]==="n")if(q){let E=null;if(typeof q==="function"){let U=q;E=(Z)=>f([U,Z])}else if(Array.isArray(q)){let U=q,Z=q[0];if(U.length>1)E=()=>f([Z,...U.slice(1)]);else E=(W)=>f([Z,W])}else if(typeof q==="object")E=()=>f(q);z[J]=E}else z[J]=null;else if(q!==null&&q!==void 0&&q!==!1)z.setAttribute(J,q);else z.removeAttribute(J);return q}function S(f){if(typeof f==="string")return f;else if(Array.isArray(f))return f.map(S).join(" ");else if(typeof f==="object")return Object.keys(f).filter((z)=>f[z]).join(" ");else return""}var s="a",r="abbr",l="address",t="area",a="article",n="aside",d="audio",o="b",e="base",ff="bdi",qf="bdo",zf="blockquote",Bf="body",Ef="br",Gf="button",Jf="canvas",Qf="caption",Uf="cite",Wf="code",Xf="col",Yf="colgroup",Zf="data",$f="datalist",jf="dd",Lf="del",Af="details",Of="dfn",Hf="dialog",Cf="div",Ff="dl",Mf="dt",Df="em",Tf="embed",Rf="fieldset",If="figcaption",Kf="figure",Sf="footer",xf="form",Nf="h1",kf="h2",_f="h3",bf="h4",yf="h5",mf="h6",Pf="head",gf="header",hf="hgroup",uf="hr",vf="html",cf="i",Vf="iframe",pf="img",wf="input",sf="ins",rf="kbd",lf="label",tf="legend",af="li",nf="link",df="main",of="map",ef="mark",fq="menu",qq="meta",zq="meter",Bq="nav",Eq="noscript",Gq="object",Jq="ol",Qq="optgroup",Uq="option",Wq="output",Xq="p",Yq="picture",Zq="pre",$q="progress",jq="q",Lq="rp",Aq="rt",Oq="ruby",Hq="s",Cq="samp",Fq="script",Mq="section",Dq="select",Tq="slot",Rq="small",Iq="source",Kq="span",Sq="strong",xq="style",Nq="sub",kq="summary",_q="sup",bq="table",yq="tbody",mq="td",Pq="template",gq="textarea",hq="tfoot",uq="th",vq="thead",cq="time",iq="title",Vq="tr",pq="track",wq="u",sq="ul",rq="video",lq="wbr",tq="animate",aq="animateMotion",nq="animateTransform",dq="circle",oq="clipPath",eq="defs",fz="desc",qz="ellipse",zz="feBlend",Bz="feColorMatrix",Ez="feComponentTransfer",Gz="feComposite",Jz="feConvolveMatrix",Qz="feDiffuseLighting",Uz="feDisplacementMap",Wz="feDistantLight",Xz="feDropShadow",Yz="feFlood",Zz="feFuncA",$z="feFuncB",jz="feFuncG",Lz="feFuncR",Az="feGaussianBlur",Oz="feImage",Hz="feMerge",Cz="feMergeNode",Fz="feMorphology",Mz="feOffset",Dz="fePointLight",Tz="feSpecularLighting",Rz="feSpotLight",Iz="feTile",Kz="feTurbulence",Sz="filter",xz="foreignObject",Nz="g",kz="image",_z="line",bz="linearGradient",yz="marker",mz="mask",Pz="metadata",gz="mpath",hz="path",uz="pattern",vz="polygon",cz="polyline",iz="radialGradient",Vz="rect",pz="set",wz="stop",sz="svg",rz="switch",lz="symbol",tz="text",az="textPath",nz="tspan",dz="use",oz="view",ez="annotation",fB="annotation-xml",qB="maction",zB="math",BB="merror",EB="mfrac",GB="mi",JB="mmultiscripts",QB="mn",UB="mo",WB="mover",XB="mpadded",YB="mphantom",ZB="mprescripts",$B="mroot",jB="mrow",LB="ms",AB="mspace",OB="msqrt",HB="mstyle",CB="msub",FB="msubsup",MB="msup",DB="mtable",TB="mtd",RB="mtext",IB="mtr",KB="munder",SB="munderover",xB="semantics";export{P as vode,c as tag,A as props,i as mergeClass,h as memo,k as hydrate,u as createState,v as createPatch,x as childrenStart,R as children,V as childCount,p as child,g as app,lq as WBR,oz as VIEW,rq as VIDEO,dz as USE,sq as UL,wq as U,nz as TSPAN,pq as TRACK,Vq as TR,iq as TITLE,cq as TIME,vq as THEAD,uq as TH,hq as TFOOT,az as TEXTPATH,gq as TEXTAREA,tz as TEXT,Pq as TEMPLATE,mq as TD,yq as TBODY,bq as TABLE,lz as SYMBOL,rz as SWITCH,sz as SVG,_q as SUP,kq as SUMMARY,Nq as SUB,xq as STYLE,Sq as STRONG,wz as STOP,Kq as SPAN,Iq as SOURCE,Rq as SMALL,Tq as SLOT,pz as SET,xB as SEMANTICS,Dq as SELECT,Mq as SECTION,Fq as SCRIPT,Cq as SAMP,Hq as S,Oq as RUBY,Aq as RT,Lq as RP,Vz as RECT,iz as RADIALGRADIENT,jq as Q,$q as PROGRESS,Zq as PRE,cz as POLYLINE,vz as POLYGON,Yq as PICTURE,uz as PATTERN,hz as PATH,Xq as P,Wq as OUTPUT,Uq as OPTION,Qq as OPTGROUP,Jq as OL,Gq as OBJECT,Eq as NOSCRIPT,Bq as NAV,SB as MUNDEROVER,KB as MUNDER,IB as MTR,RB as MTEXT,TB as MTD,DB as MTABLE,MB as MSUP,FB as MSUBSUP,CB as MSUB,HB as MSTYLE,OB as MSQRT,AB as MSPACE,LB as MS,jB as MROW,$B as MROOT,ZB as MPRESCRIPTS,YB as MPHANTOM,gz as MPATH,XB as MPADDED,WB as MOVER,UB as MO,QB as MN,JB as MMULTISCRIPTS,GB as MI,EB as MFRAC,zq as METER,Pz as METADATA,qq as META,BB as MERROR,fq as MENU,zB as MATH,mz as MASK,yz as MARKER,ef as MARK,of as MAP,df as MAIN,qB as MACTION,nf as LINK,bz as LINEARGRADIENT,_z as LINE,af as LI,tf as LEGEND,lf as LABEL,rf as KBD,sf as INS,wf as INPUT,pf as IMG,kz as IMAGE,Vf as IFRAME,cf as I,vf as HTML,uf as HR,hf as HGROUP,gf as HEADER,Pf as HEAD,mf as H6,yf as H5,bf as H4,_f as H3,kf as H2,Nf as H1,Nz as G,xf as FORM,xz as FOREIGNOBJECT,Sf as FOOTER,Sz as FILTER,Kf as FIGURE,If as FIGCAPTION,Rf as FIELDSET,Kz as FETURBULENCE,Iz as FETILE,Rz as FESPOTLIGHT,Tz as FESPECULARLIGHTING,Dz as FEPOINTLIGHT,Mz as FEOFFSET,Fz as FEMORPHOLOGY,Cz as FEMERGENODE,Hz as FEMERGE,Oz as FEIMAGE,Az as FEGAUSSIANBLUR,Lz as FEFUNCR,jz as FEFUNCG,$z as FEFUNCB,Zz as FEFUNCA,Yz as FEFLOOD,Xz as FEDROPSHADOW,Wz as FEDISTANTLIGHT,Uz as FEDISPLACEMENTMAP,Qz as FEDIFFUSELIGHTING,Jz as FECONVOLVEMATRIX,Gz as FECOMPOSITE,Ez as FECOMPONENTTRANSFER,Bz as FECOLORMATRIX,zz as FEBLEND,Tf as EMBED,Df as EM,qz as ELLIPSE,Mf as DT,Ff as DL,Cf as DIV,Hf as DIALOG,Of as DFN,Af as DETAILS,fz as DESC,Lf as DEL,eq as DEFS,jf as DD,$f as DATALIST,Zf as DATA,Yf as COLGROUP,Xf as COL,Wf as CODE,oq as CLIPPATH,Uf as CITE,dq as CIRCLE,Qf as CAPTION,Jf as CANVAS,Gf as BUTTON,Ef as BR,Bf as BODY,zf as BLOCKQUOTE,qf as BDO,ff as BDI,e as BASE,o as B,d as AUDIO,n as ASIDE,a as ARTICLE,t as AREA,fB as ANNOTATION_XML,ez as ANNOTATION,nq as ANIMATETRANSFORM,aq as ANIMATEMOTION,tq as ANIMATE,l as ADDRESS,r as ABBR,s as A};
|
package/dist/vode.mjs
CHANGED
|
@@ -104,23 +104,24 @@ function app(container, state, dom, ...initialPatches) {
|
|
|
104
104
|
_vode.q = null;
|
|
105
105
|
const root = container;
|
|
106
106
|
root._vode = _vode;
|
|
107
|
-
_vode.vode = render(state, _vode.patch, container.parentElement, Array.from(container.parentElement.children).indexOf(container), hydrate(container), dom(state));
|
|
107
|
+
_vode.vode = render(state, _vode.patch, container.parentElement, Array.from(container.parentElement.children).indexOf(container), hydrate(container, true), dom(state));
|
|
108
108
|
for (const effect of initialPatches) {
|
|
109
109
|
_vode.patch(effect);
|
|
110
110
|
}
|
|
111
111
|
return _vode.patch;
|
|
112
112
|
}
|
|
113
|
-
function hydrate(element) {
|
|
113
|
+
function hydrate(element, prepareForRender) {
|
|
114
114
|
if (element?.nodeType === Node.TEXT_NODE) {
|
|
115
115
|
if (element.nodeValue?.trim() !== "")
|
|
116
|
-
return element;
|
|
116
|
+
return prepareForRender ? element : element.nodeValue;
|
|
117
117
|
return;
|
|
118
118
|
} else if (element.nodeType === Node.COMMENT_NODE) {
|
|
119
119
|
return;
|
|
120
120
|
} else if (element.nodeType === Node.ELEMENT_NODE) {
|
|
121
121
|
const tag = element.tagName.toLowerCase();
|
|
122
122
|
const root = [tag];
|
|
123
|
-
|
|
123
|
+
if (prepareForRender)
|
|
124
|
+
root.node = element;
|
|
124
125
|
if (element?.hasAttributes()) {
|
|
125
126
|
const props = {};
|
|
126
127
|
const attr = element.attributes;
|
|
@@ -132,10 +133,10 @@ function hydrate(element) {
|
|
|
132
133
|
if (element.hasChildNodes()) {
|
|
133
134
|
const remove = [];
|
|
134
135
|
for (let child of element.childNodes) {
|
|
135
|
-
const wet = child && hydrate(child);
|
|
136
|
+
const wet = child && hydrate(child, prepareForRender);
|
|
136
137
|
if (wet)
|
|
137
138
|
root.push(wet);
|
|
138
|
-
else if (child)
|
|
139
|
+
else if (child && prepareForRender)
|
|
139
140
|
remove.push(child);
|
|
140
141
|
}
|
|
141
142
|
for (let child of remove) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ryupold/vode",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.5",
|
|
4
4
|
"description": "Small web framework for minimal websites",
|
|
5
5
|
"author": "Michael Scherbakow (ryupold)",
|
|
6
6
|
"license": "MIT",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"watch": "tsc -b -w"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"bun": "1.2.
|
|
35
|
+
"bun": "1.2.23",
|
|
36
36
|
"esbuild": "0.25.10",
|
|
37
37
|
"typescript": "5.9.2"
|
|
38
38
|
}
|
package/src/vode.ts
CHANGED
|
@@ -209,7 +209,7 @@ export function app<S extends object | unknown>(container: Element, state: Omit<
|
|
|
209
209
|
_vode.patch!,
|
|
210
210
|
container.parentElement,
|
|
211
211
|
Array.from(container.parentElement.children).indexOf(container),
|
|
212
|
-
hydrate<S>(container)
|
|
212
|
+
hydrate<S>(container, true) as AttachedVode<S>,
|
|
213
213
|
dom(<S>state)
|
|
214
214
|
)!;
|
|
215
215
|
|
|
@@ -221,10 +221,10 @@ export function app<S extends object | unknown>(container: Element, state: Omit<
|
|
|
221
221
|
}
|
|
222
222
|
|
|
223
223
|
/** return vode representation of given DOM node */
|
|
224
|
-
export function hydrate<S = unknown>(element: Element | Text): AttachedVode<S> | undefined {
|
|
224
|
+
export function hydrate<S = unknown>(element: Element | Text, prepareForRender?: boolean): Vode<S> | string | AttachedVode<S> | undefined {
|
|
225
225
|
if ((element as Text)?.nodeType === Node.TEXT_NODE) {
|
|
226
226
|
if ((element as Text).nodeValue?.trim() !== "")
|
|
227
|
-
return element as Text
|
|
227
|
+
return prepareForRender ? element as Text : (element as Text).nodeValue!;
|
|
228
228
|
return undefined; //ignore (mostly html whitespace)
|
|
229
229
|
}
|
|
230
230
|
else if (element.nodeType === Node.COMMENT_NODE) {
|
|
@@ -234,7 +234,7 @@ export function hydrate<S = unknown>(element: Element | Text): AttachedVode<S> |
|
|
|
234
234
|
const tag: Tag = (<Element>element).tagName.toLowerCase();
|
|
235
235
|
const root: Vode<S> = [tag];
|
|
236
236
|
|
|
237
|
-
(<AttachedVode<S>>root).node = element;
|
|
237
|
+
if(prepareForRender) (<AttachedVode<S>>root).node = element;
|
|
238
238
|
if ((element as HTMLElement)?.hasAttributes()) {
|
|
239
239
|
const props: Props<S> = {};
|
|
240
240
|
const attr = (<HTMLElement>element).attributes;
|
|
@@ -246,15 +246,15 @@ export function hydrate<S = unknown>(element: Element | Text): AttachedVode<S> |
|
|
|
246
246
|
if (element.hasChildNodes()) {
|
|
247
247
|
const remove: ChildNode[] = [];
|
|
248
248
|
for (let child of element.childNodes) {
|
|
249
|
-
const wet = child && hydrate<S>(child as Element | Text)! as ChildVode<S>;
|
|
249
|
+
const wet = child && hydrate<S>(child as Element | Text, prepareForRender)! as ChildVode<S>;
|
|
250
250
|
if (wet) root.push(wet as any);
|
|
251
|
-
else if (child) remove.push(child);
|
|
251
|
+
else if (child && prepareForRender) remove.push(child);
|
|
252
252
|
}
|
|
253
253
|
for (let child of remove) {
|
|
254
254
|
child.remove();
|
|
255
255
|
}
|
|
256
256
|
}
|
|
257
|
-
return
|
|
257
|
+
return root;
|
|
258
258
|
} else {
|
|
259
259
|
return undefined;
|
|
260
260
|
}
|
|
@@ -642,7 +642,7 @@ function patchProperty<S>(patch: Dispatch<S>, node: ChildNode, key: string | key
|
|
|
642
642
|
if (!newValue) {
|
|
643
643
|
(node as HTMLElement).style.cssText = "";
|
|
644
644
|
} else if (typeof newValue === "string") {
|
|
645
|
-
if(oldValue !== newValue) (node as HTMLElement).style.cssText = newValue;
|
|
645
|
+
if (oldValue !== newValue) (node as HTMLElement).style.cssText = newValue;
|
|
646
646
|
} else if (oldValue) {
|
|
647
647
|
for (let k in { ...(oldValue as Props<S>), ...(newValue as Props<S>) }) {
|
|
648
648
|
if (!oldValue || newValue[k as keyof PropertyValue<S>] !== oldValue[k as keyof PropertyValue<S>]) {
|