@ryupold/vode 1.1.5 → 1.1.7
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 +42 -16
- package/dist/vode.js +1 -1
- package/dist/vode.min.js +1 -1
- package/dist/vode.min.mjs +1 -1
- package/dist/vode.mjs +1 -1
- package/logo.svg +37 -32
- package/package.json +2 -2
- package/src/vode.ts +2 -2
package/README.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# 
|
|
2
2
|
|
|
3
|
+
[](https://www.typescriptlang.org/)
|
|
4
|
+
[](package.json)
|
|
5
|
+
[](https://www.npmjs.com/package/@ryupold/vode)
|
|
6
|
+
[](https://www.npmjs.com/package/@ryupold/vode)
|
|
7
|
+
[](./LICENSE)
|
|
8
|
+
|
|
3
9
|
A small web framework for a minimalistic development flow. Zero dependencies, no build step except for typescript compilation, and a simple virtual DOM implementation that is easy to understand and use. Autocompletion out of the box due to binding to `lib.dom.d.ts`.
|
|
4
10
|
|
|
5
11
|
It can be used to create single page applications or isolated components with complex state. The usage of arrays gives flexibility in composition and makes refactoring easy.
|
|
@@ -101,7 +107,7 @@ index.html
|
|
|
101
107
|
```
|
|
102
108
|
|
|
103
109
|
main.ts
|
|
104
|
-
```
|
|
110
|
+
```typescript
|
|
105
111
|
import { app, createState, BR, DIV, INPUT, SPAN } from '@ryupold/vode';
|
|
106
112
|
|
|
107
113
|
const state = createState({
|
|
@@ -177,7 +183,7 @@ Imagine this HTML:
|
|
|
177
183
|
|
|
178
184
|
expressed as **"vode"** it would look like this:
|
|
179
185
|
|
|
180
|
-
```
|
|
186
|
+
```javascript
|
|
181
187
|
[DIV, { class: 'card' },
|
|
182
188
|
[DIV, { class: 'card-image' },
|
|
183
189
|
[FIGURE, { class: 'image is-4by3' },
|
|
@@ -217,14 +223,14 @@ Viewed alone it does not provide an obvious benefit (apart from looking better i
|
|
|
217
223
|
but as the result of a function of state, it can become very useful to express conditional UI this way.
|
|
218
224
|
|
|
219
225
|
### Component
|
|
220
|
-
```
|
|
226
|
+
```typescript
|
|
221
227
|
type Component<S> = (s: S) => ChildVode<S>;
|
|
222
228
|
```
|
|
223
229
|
|
|
224
230
|
A `Component<State>` is a function that takes a state object and returns a `Vode<State>`.
|
|
225
231
|
It is used to render the UI based on the current state.
|
|
226
232
|
|
|
227
|
-
```
|
|
233
|
+
```typescript
|
|
228
234
|
// A full vode has a tag, properties, and children. props and children are optional.
|
|
229
235
|
const CompFoo = (s) => [SPAN, { class: "foo" }, s.isAuthenticated ? "foo" : "bar"];
|
|
230
236
|
|
|
@@ -306,8 +312,8 @@ const CompBar = (s) => [DIV, { class: "container" },
|
|
|
306
312
|
### app
|
|
307
313
|
|
|
308
314
|
`app` is a function that takes a HTML node, a state object, and a render function (`Component<State>`).
|
|
309
|
-
```
|
|
310
|
-
const containerNode = document.getElementById('
|
|
315
|
+
```typescript
|
|
316
|
+
const containerNode = document.getElementById('ANY-ELEMENT');
|
|
311
317
|
const state = {
|
|
312
318
|
counter: 0,
|
|
313
319
|
pointing: false,
|
|
@@ -317,6 +323,7 @@ const state = {
|
|
|
317
323
|
};
|
|
318
324
|
const patch = app(containerNode, state, (s) => CompFooBar(s));
|
|
319
325
|
```
|
|
326
|
+
|
|
320
327
|
It will analyse the current structure of the given `containerNode` and adjust its structure in the first render.
|
|
321
328
|
When render-patches are applied to the `patch` function or via yield/return of events,
|
|
322
329
|
the `containerNode` is updated to match the vode structure 1:1.
|
|
@@ -325,24 +332,21 @@ the `containerNode` is updated to match the vode structure 1:1.
|
|
|
325
332
|
You can have multiple isolated vode app instances on a page, each with its own state and render function.
|
|
326
333
|
The returned patch function from `app` can be used to synchronize the state between them.
|
|
327
334
|
|
|
328
|
-
####
|
|
335
|
+
#### nested vode-app
|
|
329
336
|
It is possible to nest vode-apps inside vode-apps, but the library is not opionated on how you do that.
|
|
330
337
|
One can imagine this type of component:
|
|
331
338
|
|
|
332
|
-
```
|
|
339
|
+
```typescript
|
|
333
340
|
export function IsolatedVodeApp<OuterState, InnerState>(
|
|
334
341
|
tag: Tag,
|
|
335
|
-
props: Props<OuterState>,
|
|
336
342
|
state: InnerState,
|
|
337
343
|
View: (ins: InnerState) => Vode<InnerState>,
|
|
338
|
-
...initialPatches: Patch<InnerState>[]
|
|
339
344
|
): ChildVode<OuterState> {
|
|
340
345
|
return memo<OuterState>([],
|
|
341
346
|
() => [tag,
|
|
342
347
|
{
|
|
343
|
-
...props,
|
|
344
348
|
onMount: (s: OuterState, container: Element) => {
|
|
345
|
-
app<InnerState>(container, state, View
|
|
349
|
+
app<InnerState>(container, state, View);
|
|
346
350
|
if (props.onMount) props.onMount(s, container);
|
|
347
351
|
}
|
|
348
352
|
}
|
|
@@ -352,6 +356,7 @@ export function IsolatedVodeApp<OuterState, InnerState>(
|
|
|
352
356
|
```
|
|
353
357
|
The `empty memo` prevents further render calls from the outer app
|
|
354
358
|
so rendering of the subtree inside is controlled by the inner app.
|
|
359
|
+
Take note of the fact that the top-level element of the inner app refers to the surrounding element and will change its state accordingly.
|
|
355
360
|
|
|
356
361
|
### state & patch
|
|
357
362
|
The state object you pass to [`app`](#app) can be updated directly or via `patch`.
|
|
@@ -405,7 +410,7 @@ s.patch(null);
|
|
|
405
410
|
// setting a property in a patch to undefined deletes it from the state object
|
|
406
411
|
s.patch({ pointing: undefined });
|
|
407
412
|
|
|
408
|
-
|
|
413
|
+
// ❌ it is discouraged to patch inside the render step 💩
|
|
409
414
|
const ComponentEwww = (s) => {
|
|
410
415
|
if(!s.isLoading)
|
|
411
416
|
s.patch(() => startLoading());
|
|
@@ -419,7 +424,7 @@ To optimize performance, you can use `memo(Array, Component | PropsFactory)` to
|
|
|
419
424
|
This is useful when the component does not depend on the state or when the creation of the vode is expensive.
|
|
420
425
|
You can also pass a function that returns the Props object to memoize the attributes.
|
|
421
426
|
|
|
422
|
-
```
|
|
427
|
+
```typescript
|
|
423
428
|
const CompMemoFooBar = (s) =>
|
|
424
429
|
[DIV, { class: "container" },
|
|
425
430
|
[H1, "Hello World"],
|
|
@@ -443,15 +448,36 @@ const CompMemoFooBar = (s) =>
|
|
|
443
448
|
];
|
|
444
449
|
```
|
|
445
450
|
|
|
446
|
-
###
|
|
451
|
+
### helper functions
|
|
452
|
+
|
|
453
|
+
The library provides some helper functions to help with certain situations.
|
|
454
|
+
|
|
455
|
+
```typescript
|
|
456
|
+
import { tag, props, children, mergeClass, hydrate } from '@ryupold/vode';
|
|
447
457
|
|
|
448
|
-
|
|
458
|
+
// Merge class props intelligently
|
|
459
|
+
mergeClass('foo', ['baz', 'bar']); // 'foo bar baz'
|
|
460
|
+
mergeClass(['foo'], { bar: true }); // { foo: true, bar: true }
|
|
461
|
+
|
|
462
|
+
const myVode = [DIV, { class: 'foo' }, [SPAN, 'hello'], [STRONG, 'world']];
|
|
463
|
+
|
|
464
|
+
// access parts of a vode
|
|
465
|
+
tag(myVode); // 'div'
|
|
466
|
+
props(myVode); // { class: 'foo' }
|
|
467
|
+
children(myVode); // [[SPAN, 'hello'], [STRONG, 'world']]
|
|
468
|
+
|
|
469
|
+
// get existing DOM element as a vode (can be helpful for analyzing/debugging)
|
|
470
|
+
const asVode = hydrate(document.getElementById('my-element'));
|
|
471
|
+
```
|
|
449
472
|
|
|
450
473
|
Additionally to the standard HTML attributes, you can define 2 special event attributes:
|
|
451
474
|
`onMount(State, Element)` and `onUnmount(State, Element)` in the vode props.
|
|
452
475
|
These are called when the element is created or removed during rendering.
|
|
453
476
|
They receive the `State` as the first argument and the DOM element as the second argument.
|
|
454
477
|
Like the other events they can be patches too.
|
|
478
|
+
> Be aware that `onMount/onUnmount` are only called when a element
|
|
479
|
+
> is actually created/removed which might not always be the case during
|
|
480
|
+
> rendering, as only a diff of the virtual DOM is applied.
|
|
455
481
|
|
|
456
482
|
## Contributing
|
|
457
483
|
|
package/dist/vode.js
CHANGED
|
@@ -674,7 +674,7 @@ var V = (() => {
|
|
|
674
674
|
node.style.cssText = "";
|
|
675
675
|
} else if (typeof newValue === "string") {
|
|
676
676
|
if (oldValue !== newValue) node.style.cssText = newValue;
|
|
677
|
-
} else if (oldValue) {
|
|
677
|
+
} else if (oldValue && typeof oldValue === "object") {
|
|
678
678
|
for (let k in { ...oldValue, ...newValue }) {
|
|
679
679
|
if (!oldValue || newValue[k] !== oldValue[k]) {
|
|
680
680
|
node.style[k] = newValue[k];
|
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 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);})();
|
|
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 a in o)N(t,a,{get:o[a],enumerable:!0})},U=(t,o,a,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of G(o))!H.call(t,e)&&e!==a&&N(t,e,{get:()=>o[e],enumerable:!(s=v(o,e))||s.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:()=>jt,HEAD:()=>Bt,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:()=>jo,MATH:()=>pn,MENU:()=>se,MERROR:()=>Tn,META:()=>ae,METADATA:()=>Bo,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:()=>je,TEXT:()=>tn,TEXTAREA:()=>Be,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:()=>B,child:()=>$,childCount:()=>W,children:()=>A,childrenStart:()=>C,createPatch:()=>X,createState:()=>K,hydrate:()=>b,memo:()=>_,mergeClass:()=>Y,props:()=>d,tag:()=>q,vode:()=>j});function j(t,o,...a){if(!t)throw new Error("tag must be a string or vode");return Array.isArray(t)?t:o?[t,o,...a]:[t,...a]}function B(t,o,a,...s){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 a!="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=a(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),a(o));for(let r of s)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 s=[t.tagName.toLowerCase()];if(o&&(s.node=t),t?.hasAttributes()){let e={},n=t.attributes;for(let r of n)e[r.name]=r.value;s.push(e)}if(t.hasChildNodes()){let e=[];for(let n of t.childNodes){let r=n&&b(n,o);r?s.push(r):n&&o&&e.push(n)}for(let n of e)n.remove()}return s}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 a=t.split(" "),s=o.split(" "),e=new Set([...a,...s]);return Array.from(e).join(" ").trim()}else if(typeof t=="string"&&Array.isArray(o)){let a=new Set([...o,...t.split(" ")]);return Array.from(a).join(" ").trim()}else if(Array.isArray(t)&&typeof o=="string"){let a=new Set([...t,...o.split(" ")]);return Array.from(a).join(" ").trim()}else if(Array.isArray(t)&&Array.isArray(o)){let a=new Set([...t,...o]);return Array.from(a).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 a={...t};for(let s of o)a[s]=!0;return a}else if(Array.isArray(t)&&typeof o=="object"){let a={};for(let s of t)a[s]=!0;for(let s of Object.keys(o))a[s]=o[s];return a}}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,a){if(!o)return t;for(let s in o){let e=o[s];if(e&&typeof e=="object"){let n=t[s];n?Array.isArray(e)?t[s]=[...e]:e instanceof Date&&n!==e?t[s]=new Date(e):Array.isArray(n)?t[s]=u({},e,a):typeof n=="object"?u(t[s],e,a):t[s]=u({},e,a):Array.isArray(e)?t[s]=[...e]:e instanceof Date?t[s]=new Date(e):t[s]=u({},e,a)}else e===void 0&&a?delete t[s]:t[s]=e}return t}function P(t,o,a,s,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)):a.childNodes[s]?a.insertBefore(T,a.childNodes[s]):a.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)):a.childNodes[s]?a.insertBefore(T,a.childNodes[s]):a.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,a){if(typeof o!="function")return o;let s=o?.__memo,e=a?.__memo;if(Array.isArray(s)&&Array.isArray(e)&&s.length===e.length){let r=!0;for(let i=0;i<s.length;i++)if(s[i]!==e[i]){r=!1;break}if(r)return a}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,a,s,e){if(!(!s&&!a)){if(a)for(let n in a){let r=a[n],i=s?.[n];r!==i&&(s?s[n]=h(t,o,n,r,i,e):h(t,o,n,r,void 0,e))}if(s&&a){for(let n in s)if(!(n in a)){let r=s[n];s[n]=h(t,o,n,void 0,r,e)}}else if(s)for(let n in s){let r=s[n];s[n]=h(t,o,n,void 0,r,e)}}}function h(t,o,a,s,e,n){if(a==="style")if(!e)o.style.cssText="";else if(typeof e=="string")s!==e&&(o.style.cssText=e);else if(s&&typeof s=="object")for(let r in{...s,...e})!s||e[r]!==s[r]?o.style[r]=e[r]:s[r]&&!e[r]&&(o.style[r]=void 0);else for(let r in e)o.style[r]=e[r];else if(a==="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(a[0]==="o"&&a[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[a]=r}else o[a]=null;else e!=null&&e!==!1?o.setAttribute(a,e):o.removeAttribute(a);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",jt="h6",Bt="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",je="template",Be="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",jo="mask",Bo="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,...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};
|
|
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&&typeof G==="object"){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",n="article",a="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",nf="li",af="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",nq="animateMotion",aq="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",nz="textPath",az="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,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,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,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,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,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};
|
package/dist/vode.mjs
CHANGED
|
@@ -455,7 +455,7 @@ function patchProperty(patch, node, key, oldValue, newValue, isSvg) {
|
|
|
455
455
|
} else if (typeof newValue === "string") {
|
|
456
456
|
if (oldValue !== newValue)
|
|
457
457
|
node.style.cssText = newValue;
|
|
458
|
-
} else if (oldValue) {
|
|
458
|
+
} else if (oldValue && typeof oldValue === "object") {
|
|
459
459
|
for (let k in { ...oldValue, ...newValue }) {
|
|
460
460
|
if (!oldValue || newValue[k] !== oldValue[k]) {
|
|
461
461
|
node.style[k] = newValue[k];
|
package/logo.svg
CHANGED
|
@@ -1,50 +1,55 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 35">
|
|
2
2
|
<style>
|
|
3
3
|
text {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
font-weight: bold;
|
|
5
|
+
font-family: "Consolas", monospace;
|
|
6
|
+
fill: #2d3748;
|
|
7
|
+
dominant-baseline: central;
|
|
8
|
+
text-anchor: middle;
|
|
8
9
|
}
|
|
9
10
|
|
|
10
11
|
.braces-text {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
font-size: 36px;
|
|
13
|
+
opacity: 0.65;
|
|
14
|
+
stroke: #aaa;
|
|
15
|
+
stroke-width: 0.8px;
|
|
16
|
+
paint-order: stroke;
|
|
15
17
|
}
|
|
16
18
|
|
|
17
19
|
.item-text {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
20
|
+
paint-order: stroke;
|
|
21
|
+
stroke: #aaa;
|
|
22
|
+
stroke-width: 0.8px;
|
|
21
23
|
}
|
|
22
24
|
|
|
23
25
|
.comma-text {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
stroke-linejoin: miter;
|
|
30
|
-
opacity: 0.333;
|
|
26
|
+
font-size: 12px;
|
|
27
|
+
paint-order: stroke;
|
|
28
|
+
stroke: #fff;
|
|
29
|
+
stroke-width: 0.4px;
|
|
30
|
+
opacity: 0.3;
|
|
31
31
|
}
|
|
32
32
|
</style>
|
|
33
|
-
<text x="-5%" y="76%" class="braces-text">[</text>
|
|
34
33
|
|
|
35
|
-
|
|
36
|
-
<text x="
|
|
37
|
-
|
|
38
|
-
<g transform="translate(32, -3)">
|
|
39
|
-
<text x="0" y="76%" font-size="20" class="item-text" >{</text>
|
|
40
|
-
<text x="12" y="76%" font-size="20" class="item-text">}</text>
|
|
41
|
-
</g>
|
|
42
|
-
<text x="50" y="76%" class="comma-text">,</text>
|
|
34
|
+
<!-- Opening bracket -->
|
|
35
|
+
<text x="5" y="14.6" class="braces-text">[</text>
|
|
43
36
|
|
|
44
|
-
|
|
45
|
-
<text x="
|
|
37
|
+
<!-- V -->
|
|
38
|
+
<text x="18" y="17" font-size="32" class="item-text">V</text>
|
|
39
|
+
<text x="26" y="23" class="comma-text">,</text>
|
|
46
40
|
|
|
47
|
-
|
|
41
|
+
<!-- {} -->
|
|
42
|
+
<text x="36" y="17" font-size="20" class="item-text">{</text>
|
|
43
|
+
<text x="47.5" y="17" font-size="20" class="item-text">}</text>
|
|
44
|
+
<text x="53" y="23" class="comma-text">,</text>
|
|
48
45
|
|
|
49
|
-
|
|
46
|
+
<!-- d -->
|
|
47
|
+
<text x="66" y="19" font-size="24" class="item-text">d</text>
|
|
48
|
+
<text x="75" y="23" class="comma-text">,</text>
|
|
49
|
+
|
|
50
|
+
<!-- e -->
|
|
51
|
+
<text x="86" y="19" font-size="24" class="item-text">e</text>
|
|
52
|
+
|
|
53
|
+
<!-- Closing bracket -->
|
|
54
|
+
<text x="95.6" y="14.6" class="braces-text">]</text>
|
|
50
55
|
</svg>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ryupold/vode",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.7",
|
|
4
4
|
"description": "Small web framework for minimal websites",
|
|
5
5
|
"author": "Michael Scherbakow (ryupold)",
|
|
6
6
|
"license": "MIT",
|
|
@@ -34,6 +34,6 @@
|
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"bun": "1.2.23",
|
|
36
36
|
"esbuild": "0.25.10",
|
|
37
|
-
"typescript": "5.9.
|
|
37
|
+
"typescript": "5.9.3"
|
|
38
38
|
}
|
|
39
39
|
}
|
package/src/vode.ts
CHANGED
|
@@ -234,7 +234,7 @@ export function hydrate<S = unknown>(element: Element | Text, prepareForRender?:
|
|
|
234
234
|
const tag: Tag = (<Element>element).tagName.toLowerCase();
|
|
235
235
|
const root: Vode<S> = [tag];
|
|
236
236
|
|
|
237
|
-
if(prepareForRender) (<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;
|
|
@@ -643,7 +643,7 @@ function patchProperty<S>(patch: Dispatch<S>, node: ChildNode, key: string | key
|
|
|
643
643
|
(node as HTMLElement).style.cssText = "";
|
|
644
644
|
} else if (typeof newValue === "string") {
|
|
645
645
|
if (oldValue !== newValue) (node as HTMLElement).style.cssText = newValue;
|
|
646
|
-
} else if (oldValue) {
|
|
646
|
+
} else if (oldValue && typeof oldValue === "object") {
|
|
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>]) {
|
|
649
649
|
(node as HTMLElement).style[k as keyof PropertyValue<S>] = newValue[k as keyof PropertyValue<S>];
|