@ryupold/vode 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +177 -155
- package/dist/vode.js +8 -8
- package/dist/vode.min.js +1 -1
- package/dist/vode.min.mjs +1 -1
- package/dist/vode.mjs +8 -8
- package/package.json +1 -1
- package/src/vode.ts +12 -12
package/README.md
CHANGED
|
@@ -2,6 +2,124 @@
|
|
|
2
2
|
|
|
3
3
|
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
4
|
|
|
5
|
+
## Usage
|
|
6
|
+
|
|
7
|
+
### ESM
|
|
8
|
+
```html
|
|
9
|
+
<!DOCTYPE html>
|
|
10
|
+
<html>
|
|
11
|
+
<head>
|
|
12
|
+
<title>ESM Example</title>
|
|
13
|
+
</head>
|
|
14
|
+
<body>
|
|
15
|
+
<div id="app"></div>
|
|
16
|
+
<script type="module">
|
|
17
|
+
import { app, createState, BR, DIV, INPUT, SPAN } from 'https://unpkg.com/@ryupold/vode/dist/vode.min.mjs';
|
|
18
|
+
|
|
19
|
+
const appNode = document.getElementById('app');
|
|
20
|
+
|
|
21
|
+
const state = { counter: 0 };
|
|
22
|
+
|
|
23
|
+
app(appNode, state,
|
|
24
|
+
(s) => [DIV,
|
|
25
|
+
[INPUT, {
|
|
26
|
+
type: 'button',
|
|
27
|
+
onclick: { counter: s.counter + 1 },
|
|
28
|
+
value: 'Click me',
|
|
29
|
+
}],
|
|
30
|
+
[BR],
|
|
31
|
+
[SPAN, { style: { color: 'red' } }, `${s.counter}`],
|
|
32
|
+
]
|
|
33
|
+
);
|
|
34
|
+
</script>
|
|
35
|
+
</body>
|
|
36
|
+
</html>
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### Classic
|
|
40
|
+
Binds the library to the global `V` variable.
|
|
41
|
+
|
|
42
|
+
```html
|
|
43
|
+
<!DOCTYPE html>
|
|
44
|
+
<html>
|
|
45
|
+
<head>
|
|
46
|
+
<title>Classic Script Example</title>
|
|
47
|
+
<script src="https://unpkg.com/@ryupold/vode/dist/vode.min.js"></script>
|
|
48
|
+
</head>
|
|
49
|
+
<body>
|
|
50
|
+
<div id="app"></div>
|
|
51
|
+
<script>
|
|
52
|
+
var appNode = document.getElementById('app');
|
|
53
|
+
|
|
54
|
+
var state = { counter: 0 };
|
|
55
|
+
|
|
56
|
+
V.app(appNode, state,
|
|
57
|
+
(s) => ["DIV",
|
|
58
|
+
["INPUT", {
|
|
59
|
+
type: 'button',
|
|
60
|
+
onclick: { counter: s.counter + 1 },
|
|
61
|
+
value: 'Click me',
|
|
62
|
+
}
|
|
63
|
+
],
|
|
64
|
+
["BR"],
|
|
65
|
+
["SPAN", { style: { color: 'red' } }, `${s.counter}`],
|
|
66
|
+
]);
|
|
67
|
+
</script>
|
|
68
|
+
</body>
|
|
69
|
+
</html>
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
### NPM
|
|
73
|
+
|
|
74
|
+
```bash
|
|
75
|
+
# npm
|
|
76
|
+
npm install @ryupold/vode --save
|
|
77
|
+
|
|
78
|
+
# yarn
|
|
79
|
+
yarn add @ryupold/vode
|
|
80
|
+
|
|
81
|
+
# bun
|
|
82
|
+
bun add @ryupold/vode
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
index.html
|
|
86
|
+
```html
|
|
87
|
+
<html>
|
|
88
|
+
<head>
|
|
89
|
+
<title>Vode Example</title>
|
|
90
|
+
<script type="module" src="main.js"></script>
|
|
91
|
+
</head>
|
|
92
|
+
<body>
|
|
93
|
+
<div id="app"></div>
|
|
94
|
+
</body>
|
|
95
|
+
</html>
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
main.ts
|
|
99
|
+
```ts
|
|
100
|
+
import { app, createState, BR, DIV, INPUT, SPAN } from '@ryupold/vode';
|
|
101
|
+
|
|
102
|
+
const state = createState({
|
|
103
|
+
counter: 0,
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
type State = typeof state;
|
|
107
|
+
|
|
108
|
+
const appNode = document.getElementById('app');
|
|
109
|
+
|
|
110
|
+
app<State>(appNode, state,
|
|
111
|
+
(s: State) => [DIV,
|
|
112
|
+
[INPUT, {
|
|
113
|
+
type: 'button',
|
|
114
|
+
onclick: { counter: s.counter + 1 },
|
|
115
|
+
value: 'Click me',
|
|
116
|
+
}],
|
|
117
|
+
[BR],
|
|
118
|
+
[SPAN, { style: { color: 'red' } }, `${s.counter}`],
|
|
119
|
+
]
|
|
120
|
+
);
|
|
121
|
+
```
|
|
122
|
+
|
|
5
123
|
## vode
|
|
6
124
|
|
|
7
125
|
A `vode` is a representation of a virtual DOM node, which is a tree structure of HTML elements. It is written as tuple:
|
|
@@ -49,24 +167,24 @@ const CompFooBar = (s) => [DIV, { class: "container" },
|
|
|
49
167
|
},
|
|
50
168
|
|
|
51
169
|
// you can set the patch object directly for events
|
|
52
|
-
onmouseenter: {pointing: true},
|
|
53
|
-
onmouseleave: {pointing: false},
|
|
170
|
+
onmouseenter: { pointing: true },
|
|
171
|
+
onmouseleave: { pointing: false },
|
|
54
172
|
|
|
55
173
|
// a patch can be an async function
|
|
56
174
|
onmouseup: async (state, evt) => {
|
|
57
|
-
state.patch(loading: true);
|
|
175
|
+
state.patch({ loading: true });
|
|
58
176
|
const result = await apiCall();
|
|
59
177
|
return { title: result.data.title, loading: false };
|
|
60
178
|
},
|
|
61
179
|
|
|
62
180
|
// you can also use a generator function that yields patches
|
|
63
|
-
onmousedown: async function* (state, evt)
|
|
181
|
+
onmousedown: async function* (state, evt) {
|
|
64
182
|
yield { loading: true };
|
|
65
183
|
const result = await apiCall();
|
|
66
184
|
yield {
|
|
67
|
-
body: result.data.body,
|
|
68
|
-
loading: false
|
|
185
|
+
body: result.data.body,
|
|
69
186
|
};
|
|
187
|
+
return { loading: false };
|
|
70
188
|
},
|
|
71
189
|
|
|
72
190
|
class: { bar: s.pointing }
|
|
@@ -79,195 +197,99 @@ const CompFooBar = (s) => [DIV, { class: "container" },
|
|
|
79
197
|
`app` is a function that takes a HTML node, an initial state object, and a render function (`Component<State>`).
|
|
80
198
|
```ts
|
|
81
199
|
const appNode = document.getElementById('APP-ID');
|
|
82
|
-
const
|
|
200
|
+
const state = {
|
|
83
201
|
counter: 0,
|
|
84
202
|
pointing: false,
|
|
85
203
|
loading: false,
|
|
86
204
|
title: '',
|
|
87
205
|
body: '',
|
|
88
206
|
};
|
|
89
|
-
const patch = app<State>(appNode,
|
|
207
|
+
const patch = app<State>(appNode, state, (s) => CompFooBar(s));
|
|
90
208
|
```
|
|
91
|
-
It will render the initial state and update the DOM when patches are applied to the patch function or via events. All elements
|
|
209
|
+
It will render the initial state and update the DOM when patches are applied to the patch function or via events. All elements returned by the render function are placed under `appNode`.
|
|
92
210
|
|
|
93
211
|
You can have multiple isolated `app` instances on a page, each with its own state and render function. The returned patch function from `app` can be used to synchronize the state between them.
|
|
94
212
|
|
|
95
|
-
### memoization
|
|
96
|
-
To optimize performance, you can use `memo(Array, Component)` to cache the result of a component function. This is useful when the component does not depend on the state or when the state does not change frequently.
|
|
97
|
-
|
|
98
|
-
```ts
|
|
99
|
-
const CompMemoFooBar = (s) => [DIV, { class: "container" },
|
|
100
|
-
[H1, "Hello World"],
|
|
101
|
-
[BR],
|
|
102
|
-
[P, "This is a paragraph."],
|
|
103
|
-
|
|
104
|
-
// expensive component to render
|
|
105
|
-
memo(
|
|
106
|
-
// this array is shallow compared to the previous render
|
|
107
|
-
[s.title, s.body],
|
|
108
|
-
// this is the component function that will be
|
|
109
|
-
// called only when the array changes
|
|
110
|
-
(s) => {
|
|
111
|
-
const list = [UL];
|
|
112
|
-
for (let i = 0; i < 1000; i++) {
|
|
113
|
-
list.push([LI, `Item ${i}`]);
|
|
114
|
-
}
|
|
115
|
-
return list;
|
|
116
|
-
},
|
|
117
|
-
)
|
|
118
|
-
];
|
|
119
|
-
```
|
|
120
|
-
|
|
121
213
|
### state
|
|
122
214
|
The state is a singleton object that can be updated. A re-render happens when a patch object is supplied to the patch function or via event.
|
|
123
215
|
|
|
124
|
-
```
|
|
216
|
+
```js
|
|
125
217
|
// type safe way to create the state object
|
|
126
|
-
const s =
|
|
218
|
+
const s = {
|
|
127
219
|
counter: 0,
|
|
128
220
|
pointing: false,
|
|
129
221
|
loading: false,
|
|
130
222
|
title: 'foo',
|
|
131
223
|
body: '',
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
type State = typeof s;
|
|
224
|
+
};
|
|
135
225
|
|
|
136
|
-
app(appNode, s,
|
|
226
|
+
app(appNode, s, s => AppView(s));
|
|
227
|
+
// after calling app(), the state object is bound to the appNode
|
|
137
228
|
|
|
229
|
+
// update state directly as it is a singleton (silent patch)
|
|
230
|
+
s.title = 'Hello World';
|
|
138
231
|
|
|
139
|
-
|
|
232
|
+
// render patch
|
|
233
|
+
s.patch({});
|
|
140
234
|
|
|
141
|
-
|
|
235
|
+
// render patch with a change that is applied to the state
|
|
236
|
+
s.patch({ title: 'bar' });
|
|
142
237
|
|
|
143
|
-
|
|
238
|
+
// patch with a function that receives the state
|
|
239
|
+
s.patch((s) => ({body: s.body + ' baz'}));
|
|
144
240
|
|
|
145
|
-
|
|
241
|
+
// patch with an async function that receives the state
|
|
242
|
+
s.patch(async (s) => {
|
|
243
|
+
s.loading = true; // sometimes it is easier to combine a silent patch
|
|
244
|
+
s.patch({}); // with an empty render patch
|
|
245
|
+
const result = await apiCall();
|
|
246
|
+
return { title: result.title, body: result.body, loading: false };
|
|
247
|
+
});
|
|
146
248
|
|
|
249
|
+
// patch with a generator function that yields patches
|
|
147
250
|
s.patch(async function*(s){
|
|
148
|
-
// you can also use a generator function that yields patches
|
|
149
251
|
yield { loading: true };
|
|
150
252
|
const result = await apiCall();
|
|
151
253
|
yield { title: result.title, body: result.body };
|
|
152
254
|
return { loading: false };
|
|
153
255
|
});
|
|
154
256
|
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
s.patch({ pointing: undefined }); // deletes the property from the state
|
|
158
|
-
```
|
|
159
|
-
|
|
160
|
-
## Install
|
|
161
|
-
|
|
162
|
-
### ESM
|
|
163
|
-
```html
|
|
164
|
-
<!DOCTYPE html>
|
|
165
|
-
<html>
|
|
166
|
-
<head>
|
|
167
|
-
<title>ESM Example</title>
|
|
168
|
-
</head>
|
|
169
|
-
<body>
|
|
170
|
-
<div id="app"></div>
|
|
171
|
-
<script type="module">
|
|
172
|
-
import { app, createState, BR, DIV, INPUT, SPAN } from 'https://cdn.jsdelivr.net/npm/@ryupold/vode/dist/vode.min.mjs';
|
|
173
|
-
|
|
174
|
-
const appNode = document.getElementById('app');
|
|
175
|
-
|
|
176
|
-
app(appNode, { counter: 0 },
|
|
177
|
-
(s) => [DIV,
|
|
178
|
-
[INPUT, {
|
|
179
|
-
type: 'button',
|
|
180
|
-
onclick: { counter: s.counter + 1 },
|
|
181
|
-
value: 'Click me',
|
|
182
|
-
}],
|
|
183
|
-
[BR],
|
|
184
|
-
[SPAN, { style: { color: 'red' } }, `${s.counter}`],
|
|
185
|
-
]
|
|
186
|
-
);
|
|
187
|
-
</script>
|
|
188
|
-
</body>
|
|
189
|
-
</html>
|
|
190
|
-
```
|
|
191
|
-
|
|
192
|
-
### Classic
|
|
193
|
-
```html
|
|
194
|
-
<!DOCTYPE html>
|
|
195
|
-
<html>
|
|
196
|
-
<head>
|
|
197
|
-
<title>Classic Script Example</title>
|
|
198
|
-
<script src="https://cdn.jsdelivr.net/npm/@ryupold/vode/dist/vode.min.js"></script>
|
|
199
|
-
</head>
|
|
200
|
-
<body>
|
|
201
|
-
<div id="app"></div>
|
|
202
|
-
<script>
|
|
203
|
-
const appNode = document.getElementById('app');
|
|
204
|
-
V.app(appNode, { counter: 0 },
|
|
205
|
-
(s) => ["DIV",
|
|
206
|
-
["INPUT", {
|
|
207
|
-
type: 'button',
|
|
208
|
-
onclick: { counter: s.counter + 1 },
|
|
209
|
-
value: 'Click me',
|
|
210
|
-
}
|
|
211
|
-
],
|
|
212
|
-
["BR"],
|
|
213
|
-
["SPAN", { style: { color: 'red' } }, `${s.counter}`],
|
|
214
|
-
]);
|
|
215
|
-
</script>
|
|
216
|
-
</body>
|
|
217
|
-
</html>
|
|
218
|
-
```
|
|
219
|
-
|
|
220
|
-
### NPM
|
|
221
|
-
|
|
222
|
-
```bash
|
|
223
|
-
# npm
|
|
224
|
-
npm install @ryupold/vode --save
|
|
225
|
-
|
|
226
|
-
# yarn
|
|
227
|
-
yarn add @ryupold/vode
|
|
257
|
+
// ignored, also: undefined, number, string, boolean, void
|
|
258
|
+
s.patch(null);
|
|
228
259
|
|
|
229
|
-
|
|
230
|
-
|
|
260
|
+
// setting a property in a patch to undefined deletes it from the state object
|
|
261
|
+
s.patch({ pointing: undefined });
|
|
231
262
|
```
|
|
232
263
|
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
<html>
|
|
236
|
-
<head>
|
|
237
|
-
<title>Vode Example</title>
|
|
238
|
-
<script type="module" src="main.js"></script>
|
|
239
|
-
</head>
|
|
240
|
-
<body>
|
|
241
|
-
<div id="app"></div>
|
|
242
|
-
</body>
|
|
243
|
-
</html>
|
|
244
|
-
```
|
|
264
|
+
### memoization
|
|
265
|
+
To optimize performance, you can use `memo(Array, Component | PropsFactory)` to cache the result of a component function. This is useful when the component does not depend on the state or when the creation of the vode is expensive. You can also pass a function that returns the Props object to memoize the attributes.
|
|
245
266
|
|
|
246
|
-
main.ts
|
|
247
267
|
```ts
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
268
|
+
const CompMemoFooBar = (s) => [DIV, { class: "container" },
|
|
269
|
+
[H1, "Hello World"],
|
|
270
|
+
[BR],
|
|
271
|
+
[P, "This is a paragraph."],
|
|
272
|
+
|
|
273
|
+
// expensive component to render
|
|
274
|
+
memo(
|
|
275
|
+
// this array is shallow compared to the previous render
|
|
276
|
+
[s.title, s.body],
|
|
277
|
+
// this is the component function that will be
|
|
278
|
+
// called only when the array changes
|
|
279
|
+
(s) => {
|
|
280
|
+
const list = [UL];
|
|
281
|
+
for (let i = 0; i < 1000; i++) {
|
|
282
|
+
list.push([LI, `Item ${i}`]);
|
|
283
|
+
}
|
|
284
|
+
return list;
|
|
285
|
+
},
|
|
286
|
+
)
|
|
287
|
+
];
|
|
288
|
+
```
|
|
256
289
|
|
|
257
|
-
|
|
290
|
+
### Direct access to DOM elements
|
|
258
291
|
|
|
259
|
-
|
|
260
|
-
(s: State) => [DIV,
|
|
261
|
-
[INPUT, {
|
|
262
|
-
type: 'button',
|
|
263
|
-
onclick: { counter: s.counter + 1 },
|
|
264
|
-
value: 'Click me',
|
|
265
|
-
}],
|
|
266
|
-
[BR],
|
|
267
|
-
[SPAN, { style: { color: 'red' } }, `${s.counter}`],
|
|
268
|
-
]
|
|
269
|
-
);
|
|
270
|
-
```
|
|
292
|
+
Additionally to the standard HTML attributes, you can define 2 special event attributes: `onMount(State, Element)` and `onUnmount(State, Element)` in the vode props. These are called when the element is created or removed during rendering. They receive the `State` as the first argument and the DOM element as the second argument. Like the other events they can be patches too.
|
|
271
293
|
|
|
272
294
|
## Contributing
|
|
273
295
|
|
package/dist/vode.js
CHANGED
|
@@ -299,7 +299,7 @@ var V = (() => {
|
|
|
299
299
|
_vode.patch(action(_vode.state));
|
|
300
300
|
} else {
|
|
301
301
|
_vode.stats.renderPatchCount++;
|
|
302
|
-
_vode.q = mergeState(_vode.q || {}, action);
|
|
302
|
+
_vode.q = mergeState(_vode.q || {}, action, false);
|
|
303
303
|
if (!_vode.isRendering) _vode.render();
|
|
304
304
|
}
|
|
305
305
|
}
|
|
@@ -313,7 +313,7 @@ var V = (() => {
|
|
|
313
313
|
_vode.isRendering = true;
|
|
314
314
|
const sw = Date.now();
|
|
315
315
|
try {
|
|
316
|
-
_vode.state = mergeState(_vode.state, _vode.q);
|
|
316
|
+
_vode.state = mergeState(_vode.state, _vode.q, true);
|
|
317
317
|
_vode.q = null;
|
|
318
318
|
_vode.vode = render(_vode.state, _vode.patch, container, 0, _vode.vode, dom(_vode.state));
|
|
319
319
|
} finally {
|
|
@@ -411,7 +411,7 @@ var V = (() => {
|
|
|
411
411
|
function childrenStart(vode2) {
|
|
412
412
|
return props(vode2) ? 2 : 1;
|
|
413
413
|
}
|
|
414
|
-
function mergeState(target, source) {
|
|
414
|
+
function mergeState(target, source, allowDeletion) {
|
|
415
415
|
if (!source) return target;
|
|
416
416
|
for (const key in source) {
|
|
417
417
|
const value = source[key];
|
|
@@ -423,18 +423,18 @@ var V = (() => {
|
|
|
423
423
|
} else if (value instanceof Date && targetValue !== value) {
|
|
424
424
|
target[key] = new Date(value);
|
|
425
425
|
} else {
|
|
426
|
-
if (Array.isArray(targetValue)) target[key] = mergeState({}, value);
|
|
427
|
-
else if (typeof targetValue === "object") mergeState(target[key], value);
|
|
428
|
-
else target[key] = mergeState({}, value);
|
|
426
|
+
if (Array.isArray(targetValue)) target[key] = mergeState({}, value, allowDeletion);
|
|
427
|
+
else if (typeof targetValue === "object") mergeState(target[key], value, allowDeletion);
|
|
428
|
+
else target[key] = mergeState({}, value, allowDeletion);
|
|
429
429
|
}
|
|
430
430
|
} else if (Array.isArray(value)) {
|
|
431
431
|
target[key] = [...value];
|
|
432
432
|
} else if (value instanceof Date) {
|
|
433
433
|
target[key] = new Date(value);
|
|
434
434
|
} else {
|
|
435
|
-
target[key] = mergeState({}, value);
|
|
435
|
+
target[key] = mergeState({}, value, allowDeletion);
|
|
436
436
|
}
|
|
437
|
-
} else if (value === void 0) {
|
|
437
|
+
} else if (value === void 0 && allowDeletion) {
|
|
438
438
|
delete target[key];
|
|
439
439
|
} else {
|
|
440
440
|
target[key] = value;
|
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 V=Object.prototype.hasOwnProperty;var k=(t,o)=>{for(var n in o)N(t,n,{get:o[n],enumerable:!0})},H=(t,o,n,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of G(o))!V.call(t,e)&&e!==n&&N(t,e,{get:()=>o[e],enumerable:!(r=v(o,e))||r.enumerable});return t};var U=t=>H(N({},"__esModule",{value:!0}),t);var kn={};k(kn,{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:()=>Do,FETILE:()=>bo,FETURBULENCE:()=>Io,FIELDSET:()=>Dt,FIGCAPTION:()=>bt,FIGURE:()=>It,FILTER:()=>Fo,FOOTER:()=>Ft,FOREIGNOBJECT:()=>vo,FORM:()=>vt,G:()=>Go,H1:()=>Gt,H2:()=>Vt,H3:()=>kt,H4:()=>Ht,H5:()=>Ut,H6:()=>jt,HEAD:()=>Bt,HEADER:()=>_t,HGROUP:()=>Kt,HR:()=>Xt,HTML:()=>qt,I:()=>Yt,IFRAME:()=>Wt,IMAGE:()=>Vo,IMG:()=>$t,INPUT:()=>Jt,INS:()=>Qt,KBD:()=>zt,LABEL:()=>Zt,LEGEND:()=>wt,LI:()=>te,LINE:()=>ko,LINEARGRADIENT:()=>Ho,LINK:()=>ee,MACTION:()=>cn,MAIN:()=>oe,MAP:()=>ne,MARK:()=>re,MARKER:()=>Uo,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:()=>Dn,MTEXT:()=>bn,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:()=>De,SPAN:()=>be,STOP:()=>Qo,STRONG:()=>Ie,STYLE:()=>Fe,SUB:()=>ve,SUMMARY:()=>Ge,SUP:()=>Ve,SVG:()=>zo,SWITCH:()=>Zo,SYMBOL:()=>wo,TABLE:()=>ke,TBODY:()=>He,TD:()=>Ue,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:()=>K,child:()=>$,childCount:()=>W,children:()=>A,childrenStart:()=>C,createPatch:()=>B,createState:()=>j,htmlToVode:()=>Vn,memo:()=>X,mergeClass:()=>Y,props:()=>d,tag:()=>q,vode:()=>_});function j(t){return t}function B(t){return t}function _(t,o,...n){if(!t)throw new Error("tag must be a string or vode");return Array.isArray(t)?t:o?[t,o,...n]:[t,...n]}function K(t,o,n,...r){if(!t)throw new Error("container must be a valid HTMLElement");if(!o||typeof o!="object")throw new Error("initialState must be an object");if(typeof n!="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 c=>{if(!(!c||typeof c!="function"&&typeof c!="object"))if(e.stats.patchCount++,c?.next){let l=c;e.stats.liveEffectCount++;try{let i=await l.next();for(;i.done===!1;){e.stats.liveEffectCount++;try{e.patch(i.value),i=await l.next()}finally{e.stats.liveEffectCount--}}e.patch(i.value)}finally{e.stats.liveEffectCount--}}else if(c.then){e.stats.liveEffectCount++;try{let l=await c;e.patch(l)}finally{e.stats.liveEffectCount--}}else Array.isArray(c)?typeof c[0]=="function"?c.length>1?e.patch(c[0](e.state,...c.slice(1))):e.patch(c[0](e.state)):e.stats.patchCount--:typeof c=="function"?e.patch(c(e.state)):(e.stats.renderPatchCount++,e.q=u(e.q||{},c),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 c=Date.now();try{e.state=u(e.state,e.q),e.q=null,e.vode=P(e.state,e.patch,t,0,e.vode,n(e.state))}finally{e.isRendering=!1,e.stats.renderCount++,e.stats.lastRenderTime=Date.now()-c,e.q&&e.render()}})}),e.patch=o.patch,e.state=o,e.q=null;let s=t;s._vode=e;let a=n(o);e.vode=a,e.vode=P(o,e.patch,t,0,void 0,a);for(let c of r)e.patch(c);return e.patch}function X(t,o){return o.__memo=t,o}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 n=t.split(" "),r=o.split(" "),e=new Set([...n,...r]);return Array.from(e).join(" ").trim()}else if(typeof t=="string"&&Array.isArray(o)){let n=new Set([...o,...t.split(" ")]);return Array.from(n).join(" ").trim()}else if(Array.isArray(t)&&typeof o=="string"){let n=new Set([...t,...o.split(" ")]);return Array.from(n).join(" ").trim()}else if(Array.isArray(t)&&Array.isArray(o)){let n=new Set([...t,...o]);return Array.from(n).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 n={...t};for(let r of o)n[r]=!0;return n}else if(Array.isArray(t)&&typeof o=="object"){let n={};for(let r of t)n[r]=!0;for(let r of Object.keys(o))n[r]=o[r];return n}}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){if(!o)return t;for(let n in o){let r=o[n];if(r&&typeof r=="object"){let e=t[n];e?Array.isArray(r)?t[n]=[...r]:r instanceof Date&&e!==r?t[n]=new Date(r):Array.isArray(e)?t[n]=u({},r):typeof e=="object"?u(t[n],r):t[n]=u({},r):Array.isArray(r)?t[n]=[...r]:r instanceof Date?t[n]=new Date(r):t[n]=u({},r)}else r===void 0?delete t[n]:t[n]=r}return t}function P(t,o,n,r,e,s,a){s=O(t,s,e);let c=!s||typeof s=="number"||typeof s=="boolean";if(s===e||!e&&c)return e;let l=e?.nodeType===Node.TEXT_NODE,i=l?e:e?.node;if(c){i?.onUnmount&&o(i.onUnmount(i)),i?.remove();return}let E=!c&&Q(s),m=!c&&J(s),M=!!s&&typeof s!="string"&&!!(s?.node||s?.nodeType===Node.TEXT_NODE);if(!E&&!m&&!M&&!e)throw new Error("Invalid vode: "+typeof s+" "+JSON.stringify(s));if(M&&E?s=s.wholeText:M&&m&&(s=[...s]),l&&E)return i.nodeValue!==s&&(i.nodeValue=s),e;if(E&&(!i||!l)){let T=document.createTextNode(s);return i?(i.onUnmount&&o(i.onUnmount(i)),i.replaceWith(T)):n.childNodes[r]?n.insertBefore(T,n.childNodes[r]):n.appendChild(T),T}if(m&&(!i||l||e[0]!==s[0])){a=a||s[0]==="svg";let T=a?document.createElementNS("http://www.w3.org/2000/svg",s[0]):document.createElement(s[0]);s.node=T;let y=s;1 in y&&(y[1]=O(t,y[1],void 0));let g=d(s);R(o,T,void 0,g,a),i?(i.onUnmount&&o(i.onUnmount(i)),i.replaceWith(T)):n.childNodes[r]?n.insertBefore(T,n.childNodes[r]):n.appendChild(T);let S=A(s);if(S)for(let f=0;f<S.length;f++){let p=S[f],x=P(t,o,T,f,void 0,p,a);s[g?f+2:f+1]=x}return T.onMount&&o(T.onMount(T)),s}if(!l&&m&&e[0]===s[0]){a=a||s[0]==="svg",s.node=i;let T=s,y=e,g=!1;if(T[1]?.__memo){let p=T[1];if(T[1]=O(t,T[1],y[1]),p!==T[1]){let x=d(s);R(o,i,d(e),x,a),g=!!x}}else{let p=d(s);R(o,i,d(e),p,a),g=!!p}let S=A(s),f=A(e);if(S){for(let p=0;p<S.length;p++){let x=S[p],F=f&&f[p],D=P(t,o,i,p,F,x,a);D&&(s[g?p+2:p+1]=D)}for(let p=S.length;f&&p<f.length;p++)f[p]?.node?f[p].node.remove():f[p]?.nodeType===Node.TEXT_NODE&&f[p].remove()}for(let p=S?.length||0;p<f?.length;p++)f[p]?.node?f[p].node.remove():f[p]?.nodeType===Node.TEXT_NODE&&f[p].remove();return s}}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,n){if(typeof o!="function")return o;let r=o?.__memo,e=n?.__memo;if(Array.isArray(r)&&Array.isArray(e)&&r.length===e.length){let a=!0;for(let c=0;c<r.length;c++)if(r[c]!==e[c]){a=!1;break}if(a)return n}let s=b(o,t);return typeof s=="object"&&(s.__memo=o?.__memo),s}function b(t,o){return typeof t=="function"?b(t(o),o):t}function R(t,o,n,r,e){if(!(!r&&!n)){if(n)for(let s in n){let a=n[s],c=r?.[s];a!==c&&(r?r[s]=h(t,o,s,a,c,e):h(t,o,s,a,void 0,e))}if(r&&n){for(let s in r)if(!(s in n)){let a=r[s];r[s]=h(t,o,s,void 0,a,e)}}else if(r)for(let s in r){let a=r[s];r[s]=h(t,o,s,void 0,a,e)}}}function h(t,o,n,r,e,s){if(n==="style")if(!e)o.style.cssText="";else if(r)for(let a in{...r,...e})!r||e[a]!==r[a]?o.style[a]=e[a]:r[a]&&!e[a]&&(o.style[a]=void 0);else for(let a in e)o.style[a]=e[a];else if(n==="class")if(s)if(e){let a=L(e);o.classList.value=a}else o.classList.value="";else if(e){let a=L(e);o.className=a}else o.className="";else if(n[0]==="o"&&n[1]==="n")if(e){let a=null;if(typeof e=="function"){let c=e;a=l=>t([c,l])}else if(Array.isArray(e)){let c=e,l=e[0];c.length>1?a=()=>t([l,...c.slice(1)]):a=i=>t([l,i])}else typeof e=="object"&&(a=()=>t(e));o[n]=a}else o[n]=null;else e!=null&&e!==!1?o.setAttribute(n,e):o.removeAttribute(n);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",Dt="fieldset",bt="figcaption",It="figure",Ft="footer",vt="form",Gt="h1",Vt="h2",kt="h3",Ht="h4",Ut="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",De="source",be="span",Ie="strong",Fe="style",ve="sub",Ge="summary",Ve="sup",ke="table",He="tbody",Ue="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",Do="feSpotLight",bo="feTile",Io="feTurbulence",Fo="filter",vo="foreignObject",Go="g",Vo="image",ko="line",Ho="linearGradient",Uo="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",Dn="mtd",bn="mtext",In="mtr",Fn="munder",vn="munderover",Gn="semantics";function Vn(t){let o=document.createElement("div");o.innerHTML=t.trim();let n=[];for(let r of o.childNodes){let e=I(r);e!=null&&n.push(e)}return n}function I(t){if(t.nodeType===Node.TEXT_NODE)return t.textContent;if(t.nodeType!==Node.ELEMENT_NODE)return;let o=[t.tagName.toLowerCase()];if(t.hasAttributes()){let n={};for(let r of t.attributes)n[r.name]=r.value;o.push(n)}for(let n of t.childNodes){let r=I(n);r&&(typeof r!="string"||r.length>0)&&o.push(r)}return o}return U(kn);})();
|
|
1
|
+
"use strict";var V=(()=>{var N=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var V=Object.prototype.hasOwnProperty;var k=(t,o)=>{for(var n in o)N(t,n,{get:o[n],enumerable:!0})},H=(t,o,n,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of G(o))!V.call(t,e)&&e!==n&&N(t,e,{get:()=>o[e],enumerable:!(s=v(o,e))||s.enumerable});return t};var U=t=>H(N({},"__esModule",{value:!0}),t);var kn={};k(kn,{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:()=>pt,BODY:()=>it,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:()=>po,FECOMPONENTTRANSFER:()=>io,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:()=>Io,FETURBULENCE:()=>Do,FIELDSET:()=>bt,FIGCAPTION:()=>It,FIGURE:()=>Dt,FILTER:()=>Fo,FOOTER:()=>Ft,FOREIGNOBJECT:()=>vo,FORM:()=>vt,G:()=>Go,H1:()=>Gt,H2:()=>Vt,H3:()=>kt,H4:()=>Ht,H5:()=>Ut,H6:()=>jt,HEAD:()=>Bt,HEADER:()=>_t,HGROUP:()=>Kt,HR:()=>Xt,HTML:()=>qt,I:()=>Yt,IFRAME:()=>Wt,IMAGE:()=>Vo,IMG:()=>$t,INPUT:()=>Jt,INS:()=>Qt,KBD:()=>zt,LABEL:()=>Zt,LEGEND:()=>wt,LI:()=>te,LINE:()=>ko,LINEARGRADIENT:()=>Ho,LINK:()=>ee,MACTION:()=>cn,MAIN:()=>oe,MAP:()=>ne,MARK:()=>re,MARKER:()=>Uo,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:()=>In,MTR:()=>Dn,MUNDER:()=>Fn,MUNDEROVER:()=>vn,NAV:()=>pe,NOSCRIPT:()=>ie,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:()=>Ie,STOP:()=>Qo,STRONG:()=>De,STYLE:()=>Fe,SUB:()=>ve,SUMMARY:()=>Ge,SUP:()=>Ve,SVG:()=>zo,SWITCH:()=>Zo,SYMBOL:()=>wo,TABLE:()=>ke,TBODY:()=>He,TD:()=>Ue,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:()=>K,child:()=>$,childCount:()=>W,children:()=>A,childrenStart:()=>C,createPatch:()=>B,createState:()=>j,htmlToVode:()=>Vn,memo:()=>X,mergeClass:()=>Y,props:()=>d,tag:()=>q,vode:()=>_});function j(t){return t}function B(t){return t}function _(t,o,...n){if(!t)throw new Error("tag must be a string or vode");return Array.isArray(t)?t:o?[t,o,...n]:[t,...n]}function K(t,o,n,...s){if(!t)throw new Error("container must be a valid HTMLElement");if(!o||typeof o!="object")throw new Error("initialState must be an object");if(typeof n!="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 c=>{if(!(!c||typeof c!="function"&&typeof c!="object"))if(e.stats.patchCount++,c?.next){let l=c;e.stats.liveEffectCount++;try{let p=await l.next();for(;p.done===!1;){e.stats.liveEffectCount++;try{e.patch(p.value),p=await l.next()}finally{e.stats.liveEffectCount--}}e.patch(p.value)}finally{e.stats.liveEffectCount--}}else if(c.then){e.stats.liveEffectCount++;try{let l=await c;e.patch(l)}finally{e.stats.liveEffectCount--}}else Array.isArray(c)?typeof c[0]=="function"?c.length>1?e.patch(c[0](e.state,...c.slice(1))):e.patch(c[0](e.state)):e.stats.patchCount--:typeof c=="function"?e.patch(c(e.state)):(e.stats.renderPatchCount++,e.q=u(e.q||{},c,!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 c=Date.now();try{e.state=u(e.state,e.q,!0),e.q=null,e.vode=P(e.state,e.patch,t,0,e.vode,n(e.state))}finally{e.isRendering=!1,e.stats.renderCount++,e.stats.lastRenderTime=Date.now()-c,e.q&&e.render()}})}),e.patch=o.patch,e.state=o,e.q=null;let r=t;r._vode=e;let a=n(o);e.vode=a,e.vode=P(o,e.patch,t,0,void 0,a);for(let c of s)e.patch(c);return e.patch}function X(t,o){return o.__memo=t,o}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 n=t.split(" "),s=o.split(" "),e=new Set([...n,...s]);return Array.from(e).join(" ").trim()}else if(typeof t=="string"&&Array.isArray(o)){let n=new Set([...o,...t.split(" ")]);return Array.from(n).join(" ").trim()}else if(Array.isArray(t)&&typeof o=="string"){let n=new Set([...t,...o.split(" ")]);return Array.from(n).join(" ").trim()}else if(Array.isArray(t)&&Array.isArray(o)){let n=new Set([...t,...o]);return Array.from(n).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 n={...t};for(let s of o)n[s]=!0;return n}else if(Array.isArray(t)&&typeof o=="object"){let n={};for(let s of t)n[s]=!0;for(let s of Object.keys(o))n[s]=o[s];return n}}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,n){if(!o)return t;for(let s in o){let e=o[s];if(e&&typeof e=="object"){let r=t[s];r?Array.isArray(e)?t[s]=[...e]:e instanceof Date&&r!==e?t[s]=new Date(e):Array.isArray(r)?t[s]=u({},e,n):typeof r=="object"?u(t[s],e,n):t[s]=u({},e,n):Array.isArray(e)?t[s]=[...e]:e instanceof Date?t[s]=new Date(e):t[s]=u({},e,n)}else e===void 0&&n?delete t[s]:t[s]=e}return t}function P(t,o,n,s,e,r,a){r=O(t,r,e);let c=!r||typeof r=="number"||typeof r=="boolean";if(r===e||!e&&c)return e;let l=e?.nodeType===Node.TEXT_NODE,p=l?e:e?.node;if(c){p?.onUnmount&&o(p.onUnmount(p)),p?.remove();return}let E=!c&&Q(r),m=!c&&J(r),M=!!r&&typeof r!="string"&&!!(r?.node||r?.nodeType===Node.TEXT_NODE);if(!E&&!m&&!M&&!e)throw new Error("Invalid vode: "+typeof r+" "+JSON.stringify(r));if(M&&E?r=r.wholeText:M&&m&&(r=[...r]),l&&E)return p.nodeValue!==r&&(p.nodeValue=r),e;if(E&&(!p||!l)){let T=document.createTextNode(r);return p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):n.childNodes[s]?n.insertBefore(T,n.childNodes[s]):n.appendChild(T),T}if(m&&(!p||l||e[0]!==r[0])){a=a||r[0]==="svg";let T=a?document.createElementNS("http://www.w3.org/2000/svg",r[0]):document.createElement(r[0]);r.node=T;let y=r;1 in y&&(y[1]=O(t,y[1],void 0));let g=d(r);R(o,T,void 0,g,a),p?(p.onUnmount&&o(p.onUnmount(p)),p.replaceWith(T)):n.childNodes[s]?n.insertBefore(T,n.childNodes[s]):n.appendChild(T);let S=A(r);if(S)for(let f=0;f<S.length;f++){let i=S[f],x=P(t,o,T,f,void 0,i,a);r[g?f+2:f+1]=x}return T.onMount&&o(T.onMount(T)),r}if(!l&&m&&e[0]===r[0]){a=a||r[0]==="svg",r.node=p;let T=r,y=e,g=!1;if(T[1]?.__memo){let i=T[1];if(T[1]=O(t,T[1],y[1]),i!==T[1]){let x=d(r);R(o,p,d(e),x,a),g=!!x}}else{let i=d(r);R(o,p,d(e),i,a),g=!!i}let S=A(r),f=A(e);if(S){for(let i=0;i<S.length;i++){let x=S[i],F=f&&f[i],b=P(t,o,p,i,F,x,a);b&&(r[g?i+2:i+1]=b)}for(let i=S.length;f&&i<f.length;i++)f[i]?.node?f[i].node.remove():f[i]?.nodeType===Node.TEXT_NODE&&f[i].remove()}for(let i=S?.length||0;i<f?.length;i++)f[i]?.node?f[i].node.remove():f[i]?.nodeType===Node.TEXT_NODE&&f[i].remove();return r}}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,n){if(typeof o!="function")return o;let s=o?.__memo,e=n?.__memo;if(Array.isArray(s)&&Array.isArray(e)&&s.length===e.length){let a=!0;for(let c=0;c<s.length;c++)if(s[c]!==e[c]){a=!1;break}if(a)return n}let r=I(o,t);return typeof r=="object"&&(r.__memo=o?.__memo),r}function I(t,o){return typeof t=="function"?I(t(o),o):t}function R(t,o,n,s,e){if(!(!s&&!n)){if(n)for(let r in n){let a=n[r],c=s?.[r];a!==c&&(s?s[r]=h(t,o,r,a,c,e):h(t,o,r,a,void 0,e))}if(s&&n){for(let r in s)if(!(r in n)){let a=s[r];s[r]=h(t,o,r,void 0,a,e)}}else if(s)for(let r in s){let a=s[r];s[r]=h(t,o,r,void 0,a,e)}}}function h(t,o,n,s,e,r){if(n==="style")if(!e)o.style.cssText="";else if(s)for(let a in{...s,...e})!s||e[a]!==s[a]?o.style[a]=e[a]:s[a]&&!e[a]&&(o.style[a]=void 0);else for(let a in e)o.style[a]=e[a];else if(n==="class")if(r)if(e){let a=L(e);o.classList.value=a}else o.classList.value="";else if(e){let a=L(e);o.className=a}else o.className="";else if(n[0]==="o"&&n[1]==="n")if(e){let a=null;if(typeof e=="function"){let c=e;a=l=>t([c,l])}else if(Array.isArray(e)){let c=e,l=e[0];c.length>1?a=()=>t([l,...c.slice(1)]):a=p=>t([l,p])}else typeof e=="object"&&(a=()=>t(e));o[n]=a}else o[n]=null;else e!=null&&e!==!1?o.setAttribute(n,e):o.removeAttribute(n);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",pt="blockquote",it="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",It="figcaption",Dt="figure",Ft="footer",vt="form",Gt="h1",Vt="h2",kt="h3",Ht="h4",Ut="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",pe="nav",ie="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",Ie="span",De="strong",Fe="style",ve="sub",Ge="summary",Ve="sup",ke="table",He="tbody",Ue="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",po="feColorMatrix",io="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",Io="feTile",Do="feTurbulence",Fo="filter",vo="foreignObject",Go="g",Vo="image",ko="line",Ho="linearGradient",Uo="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",In="mtext",Dn="mtr",Fn="munder",vn="munderover",Gn="semantics";function Vn(t){let o=document.createElement("div");o.innerHTML=t.trim();let n=[];for(let s of o.childNodes){let e=D(s);e!=null&&n.push(e)}return n}function D(t){if(t.nodeType===Node.TEXT_NODE)return t.textContent;if(t.nodeType!==Node.ELEMENT_NODE)return;let o=[t.tagName.toLowerCase()];if(t.hasAttributes()){let n={};for(let s of t.attributes)n[s.name]=s.value;o.push(n)}for(let n of t.childNodes){let s=D(n);s&&(typeof s!="string"||s.length>0)&&o.push(s)}return o}return U(kn);})();
|
package/dist/vode.min.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
function P(f){return f}function h(f){return f}function g(f,D,...L){if(!f)throw new Error("tag must be a string or vode");if(Array.isArray(f))return f;else if(D)return[f,D,...L];else return[f,...L]}function u(f,D,L,...X){if(!f)throw new Error("container must be a valid HTMLElement");if(!D||typeof D!=="object")throw new Error("initialState must be an object");if(typeof L!=="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(D,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async(z)=>{if(!z||typeof z!=="function"&&typeof z!=="object")return;if(E.stats.patchCount++,z?.next){let Q=z;E.stats.liveEffectCount++;try{let B=await Q.next();while(B.done===!1){E.stats.liveEffectCount++;try{E.patch(B.value),B=await Q.next()}finally{E.stats.liveEffectCount--}}E.patch(B.value)}finally{E.stats.liveEffectCount--}}else if(z.then){E.stats.liveEffectCount++;try{let Q=await z;E.patch(Q)}finally{E.stats.liveEffectCount--}}else if(Array.isArray(z))if(typeof z[0]==="function")if(z.length>1)E.patch(z[0](E.state,...z.slice(1)));else E.patch(z[0](E.state));else E.stats.patchCount--;else if(typeof z==="function")E.patch(z(E.state));else if(E.stats.renderPatchCount++,E.q=$(E.q||{},z),!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 z=Date.now();try{E.state=$(E.state,E.q),E.q=null,E.vode=C(E.state,E.patch,f,0,E.vode,L(E.state))}finally{if(E.isRendering=!1,E.stats.renderCount++,E.stats.lastRenderTime=Date.now()-z,E.q)E.render()}})}),E.patch=D.patch,E.state=D,E.q=null;let j=f;j._vode=E;let q=L(D);E.vode=q,E.vode=C(D,E.patch,f,0,void 0,q);for(let z of X)E.patch(z);return E.patch}function c(f,D){return D.__memo=f,D}function v(f){return f?Array.isArray(f)?f[0]:typeof f==="string"||f.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function Z(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 p(f,D){if(!f)return D;if(!D)return f;if(typeof f==="string"&&typeof D==="string"){let L=f.split(" "),X=D.split(" "),E=new Set([...L,...X]);return Array.from(E).join(" ").trim()}else if(typeof f==="string"&&Array.isArray(D)){let L=new Set([...D,...f.split(" ")]);return Array.from(L).join(" ").trim()}else if(Array.isArray(f)&&typeof D==="string"){let L=new Set([...f,...D.split(" ")]);return Array.from(L).join(" ").trim()}else if(Array.isArray(f)&&Array.isArray(D)){let L=new Set([...f,...D]);return Array.from(L).join(" ").trim()}else if(typeof f==="string"&&typeof D==="object")return{[f]:!0,...D};else if(typeof f==="object"&&typeof D==="string")return{...f,[D]:!0};else if(typeof f==="object"&&typeof D==="object")return{...f,...D};else if(typeof f==="object"&&Array.isArray(D)){let L={...f};for(let X of D)L[X]=!0;return L}else if(Array.isArray(f)&&typeof D==="object"){let L={};for(let X of f)L[X]=!0;for(let X of Object.keys(D))L[X]=D[X];return L}throw new Error(`cannot merge classes of ${f} (${typeof f}) and ${D} (${typeof D})`)}function M(f){let D=x(f);if(D>0)return f.slice(D);return null}function V(f){return f.length-x(f)}function i(f,D){return f[D+x(f)]}function x(f){return Z(f)?2:1}function $(f,D){if(!D)return f;for(let L in D){let X=D[L];if(X&&typeof X==="object"){let E=f[L];if(E)if(Array.isArray(X))f[L]=[...X];else if(X instanceof Date&&E!==X)f[L]=new Date(X);else if(Array.isArray(E))f[L]=$({},X);else if(typeof E==="object")$(f[L],X);else f[L]=$({},X);else if(Array.isArray(X))f[L]=[...X];else if(X instanceof Date)f[L]=new Date(X);else f[L]=$({},X)}else if(X===void 0)delete f[L];else f[L]=X}return f}function C(f,D,L,X,E,j,q){j=I(f,j,E);let z=!j||typeof j==="number"||typeof j==="boolean";if(j===E||!E&&z)return E;let Q=E?.nodeType===Node.TEXT_NODE,B=Q?E:E?.node;if(z){B?.onUnmount&&D(B.onUnmount(B)),B?.remove();return}let O=!z&&k(j),T=!z&&b(j),H=!!j&&typeof j!=="string"&&!!(j?.node||j?.nodeType===Node.TEXT_NODE);if(!O&&!T&&!H&&!E)throw new Error("Invalid vode: "+typeof j+" "+JSON.stringify(j));else if(H&&O)j=j.wholeText;else if(H&&T)j=[...j];if(Q&&O){if(B.nodeValue!==j)B.nodeValue=j;return E}if(O&&(!B||!Q)){let G=document.createTextNode(j);if(B)B.onUnmount&&D(B.onUnmount(B)),B.replaceWith(G);else if(L.childNodes[X])L.insertBefore(G,L.childNodes[X]);else L.appendChild(G);return G}if(T&&(!B||Q||E[0]!==j[0])){q=q||j[0]==="svg";let G=q?document.createElementNS("http://www.w3.org/2000/svg",j[0]):document.createElement(j[0]);j.node=G;let A=j;if(1 in A)A[1]=I(f,A[1],void 0);let W=Z(j);if(K(D,G,void 0,W,q),B)B.onUnmount&&D(B.onUnmount(B)),B.replaceWith(G);else if(L.childNodes[X])L.insertBefore(G,L.childNodes[X]);else L.appendChild(G);let U=M(j);if(U)for(let J=0;J<U.length;J++){let F=U[J],Y=C(f,D,G,J,void 0,F,q);j[W?J+2:J+1]=Y}return G.onMount&&D(G.onMount(G)),j}if(!Q&&T&&E[0]===j[0]){q=q||j[0]==="svg",j.node=B;let G=j,A=E,W=!1;if(G[1]?.__memo){let F=G[1];if(G[1]=I(f,G[1],A[1]),F!==G[1]){let Y=Z(j);K(D,B,Z(E),Y,q),W=!!Y}}else{let F=Z(j);K(D,B,Z(E),F,q),W=!!F}let U=M(j),J=M(E);if(U){for(let F=0;F<U.length;F++){let Y=U[F],_=J&&J[F],N=C(f,D,B,F,_,Y,q);if(N)j[W?F+2:F+1]=N}for(let F=U.length;J&&F<J.length;F++)if(J[F]?.node)J[F].node.remove();else if(J[F]?.nodeType===Node.TEXT_NODE)J[F].remove()}for(let F=U?.length||0;F<J?.length;F++)if(J[F]?.node)J[F].node.remove();else if(J[F]?.nodeType===Node.TEXT_NODE)J[F].remove();return j}return}function b(f){return Array.isArray(f)&&f.length>0&&typeof f[0]==="string"}function k(f){return typeof f==="string"||f?.nodeType===Node.TEXT_NODE}function I(f,D,L){if(typeof D!=="function")return D;let X=D?.__memo,E=L?.__memo;if(Array.isArray(X)&&Array.isArray(E)&&X.length===E.length){let q=!0;for(let z=0;z<X.length;z++)if(X[z]!==E[z]){q=!1;break}if(q)return L}let j=S(D,f);if(typeof j==="object")j.__memo=D?.__memo;return j}function S(f,D){if(typeof f==="function")return S(f(D),D);else return f}function K(f,D,L,X,E){if(!X&&!L)return;if(L)for(let j in L){let q=L[j],z=X?.[j];if(q!==z)if(X)X[j]=R(f,D,j,q,z,E);else R(f,D,j,q,void 0,E)}if(X&&L){for(let j in X)if(!(j in L)){let q=X[j];X[j]=R(f,D,j,void 0,q,E)}}else if(X)for(let j in X){let q=X[j];X[j]=R(f,D,j,void 0,q,E)}}function R(f,D,L,X,E,j){if(L==="style")if(!E)D.style.cssText="";else if(X){for(let q in{...X,...E})if(!X||E[q]!==X[q])D.style[q]=E[q];else if(X[q]&&!E[q])D.style[q]=void 0}else for(let q in E)D.style[q]=E[q];else if(L==="class")if(j)if(E){let q=m(E);D.classList.value=q}else D.classList.value="";else if(E){let q=m(E);D.className=q}else D.className="";else if(L[0]==="o"&&L[1]==="n")if(E){let q=null;if(typeof E==="function"){let z=E;q=(Q)=>f([z,Q])}else if(Array.isArray(E)){let z=E,Q=E[0];if(z.length>1)q=()=>f([Q,...z.slice(1)]);else q=(B)=>f([Q,B])}else if(typeof E==="object")q=()=>f(E);D[L]=q}else D[L]=null;else if(E!==null&&E!==void 0&&E!==!1)D.setAttribute(L,E);else D.removeAttribute(L);return E}function m(f){if(typeof f==="string")return f;else if(Array.isArray(f))return f.map(m).join(" ");else if(typeof f==="object")return Object.keys(f).filter((D)=>f[D]).join(" ");else return""}var s="a",r="abbr",l="address",t="area",n="article",a="aside",d="audio",o="b",e="base",ff="bdi",Ef="bdo",Df="blockquote",Lf="body",Xf="br",jf="button",qf="canvas",zf="caption",Bf="cite",Ff="code",Gf="col",Jf="colgroup",Qf="data",Uf="datalist",Wf="dd",Yf="del",Zf="details",$f="dfn",Af="dialog",Of="div",Tf="dl",Rf="dt",Cf="em",Hf="embed",Mf="fieldset",If="figcaption",Kf="figure",mf="footer",xf="form",Nf="h1",Sf="h2",yf="h3",_f="h4",bf="h5",kf="h6",Pf="head",hf="header",gf="hgroup",uf="hr",cf="html",vf="i",pf="iframe",Vf="img",wf="input",sf="ins",rf="kbd",lf="label",tf="legend",nf="li",af="link",df="main",of="map",ef="mark",fE="menu",EE="meta",DE="meter",LE="nav",XE="noscript",jE="object",qE="ol",zE="optgroup",BE="option",FE="output",GE="p",JE="picture",QE="pre",UE="progress",WE="q",YE="rp",ZE="rt",$E="ruby",AE="s",OE="samp",TE="script",RE="section",CE="select",HE="slot",ME="small",IE="source",KE="span",mE="strong",xE="style",NE="sub",SE="summary",yE="sup",_E="table",bE="tbody",kE="td",PE="template",hE="textarea",gE="tfoot",uE="th",cE="thead",vE="time",pE="title",VE="tr",iE="track",wE="u",sE="ul",rE="video",lE="wbr",tE="animate",nE="animateMotion",aE="animateTransform",dE="circle",oE="clipPath",eE="defs",fD="desc",ED="ellipse",DD="feBlend",LD="feColorMatrix",XD="feComponentTransfer",jD="feComposite",qD="feConvolveMatrix",zD="feDiffuseLighting",BD="feDisplacementMap",FD="feDistantLight",GD="feDropShadow",JD="feFlood",QD="feFuncA",UD="feFuncB",WD="feFuncG",YD="feFuncR",ZD="feGaussianBlur",$D="feImage",AD="feMerge",OD="feMergeNode",TD="feMorphology",RD="feOffset",CD="fePointLight",HD="feSpecularLighting",MD="feSpotLight",ID="feTile",KD="feTurbulence",mD="filter",xD="foreignObject",ND="g",SD="image",yD="line",_D="linearGradient",bD="marker",kD="mask",PD="metadata",hD="mpath",gD="path",uD="pattern",cD="polygon",vD="polyline",pD="radialGradient",VD="rect",iD="set",wD="stop",sD="svg",rD="switch",lD="symbol",tD="text",nD="textPath",aD="tspan",dD="use",oD="view",eD="annotation",fL="annotation-xml",EL="maction",DL="math",LL="merror",XL="mfrac",jL="mi",qL="mmultiscripts",zL="mn",BL="mo",FL="mover",GL="mpadded",JL="mphantom",QL="mprescripts",UL="mroot",WL="mrow",YL="ms",ZL="mspace",$L="msqrt",AL="mstyle",OL="msub",TL="msubsup",RL="msup",CL="mtable",HL="mtd",ML="mtext",IL="mtr",KL="munder",mL="munderover",xL="semantics";function SL(f){let D=document.createElement("div");D.innerHTML=f.trim();let L=[];for(let X of D.childNodes){let E=y(X);if(E!=null)L.push(E)}return L}function y(f){if(f.nodeType===Node.TEXT_NODE)return f.textContent;if(f.nodeType!==Node.ELEMENT_NODE)return;let D=[f.tagName.toLowerCase()];if(f.hasAttributes()){let L={};for(let X of f.attributes)L[X.name]=X.value;D.push(L)}for(let L of f.childNodes){let X=y(L);if(X&&(typeof X!=="string"||X.length>0))D.push(X)}return D}export{g as vode,v as tag,Z as props,p as mergeClass,c as memo,SL as htmlToVode,P as createState,h as createPatch,x as childrenStart,M as children,V as childCount,i as child,u as app,lE as WBR,oD as VIEW,rE as VIDEO,dD as USE,sE as UL,wE as U,aD as TSPAN,iE as TRACK,VE as TR,pE as TITLE,vE as TIME,cE as THEAD,uE as TH,gE as TFOOT,nD as TEXTPATH,hE as TEXTAREA,tD as TEXT,PE as TEMPLATE,kE as TD,bE as TBODY,_E as TABLE,lD as SYMBOL,rD as SWITCH,sD as SVG,yE as SUP,SE as SUMMARY,NE as SUB,xE as STYLE,mE as STRONG,wD as STOP,KE as SPAN,IE as SOURCE,ME as SMALL,HE as SLOT,iD as SET,xL as SEMANTICS,CE as SELECT,RE as SECTION,TE as SCRIPT,OE as SAMP,AE as S,$E as RUBY,ZE as RT,YE as RP,VD as RECT,pD as RADIALGRADIENT,WE as Q,UE as PROGRESS,QE as PRE,vD as POLYLINE,cD as POLYGON,JE as PICTURE,uD as PATTERN,gD as PATH,GE as P,FE as OUTPUT,BE as OPTION,zE as OPTGROUP,qE as OL,jE as OBJECT,XE as NOSCRIPT,LE as NAV,mL as MUNDEROVER,KL as MUNDER,IL as MTR,ML as MTEXT,HL as MTD,CL as MTABLE,RL as MSUP,TL as MSUBSUP,OL as MSUB,AL as MSTYLE,$L as MSQRT,ZL as MSPACE,YL as MS,WL as MROW,UL as MROOT,QL as MPRESCRIPTS,JL as MPHANTOM,hD as MPATH,GL as MPADDED,FL as MOVER,BL as MO,zL as MN,qL as MMULTISCRIPTS,jL as MI,XL as MFRAC,DE as METER,PD as METADATA,EE as META,LL as MERROR,fE as MENU,DL as MATH,kD as MASK,bD as MARKER,ef as MARK,of as MAP,df as MAIN,EL as MACTION,af as LINK,_D as LINEARGRADIENT,yD as LINE,nf as LI,tf as LEGEND,lf as LABEL,rf as KBD,sf as INS,wf as INPUT,Vf as IMG,SD as IMAGE,pf as IFRAME,vf as I,cf as HTML,uf as HR,gf as HGROUP,hf as HEADER,Pf as HEAD,kf as H6,bf as H5,_f as H4,yf as H3,Sf as H2,Nf as H1,ND as G,xf as FORM,xD as FOREIGNOBJECT,mf as FOOTER,mD as FILTER,Kf as FIGURE,If as FIGCAPTION,Mf as FIELDSET,KD as FETURBULENCE,ID as FETILE,MD as FESPOTLIGHT,HD as FESPECULARLIGHTING,CD as FEPOINTLIGHT,RD as FEOFFSET,TD as FEMORPHOLOGY,OD as FEMERGENODE,AD as FEMERGE,$D as FEIMAGE,ZD as FEGAUSSIANBLUR,YD as FEFUNCR,WD as FEFUNCG,UD as FEFUNCB,QD as FEFUNCA,JD as FEFLOOD,GD as FEDROPSHADOW,FD as FEDISTANTLIGHT,BD as FEDISPLACEMENTMAP,zD as FEDIFFUSELIGHTING,qD as FECONVOLVEMATRIX,jD as FECOMPOSITE,XD as FECOMPONENTTRANSFER,LD as FECOLORMATRIX,DD as FEBLEND,Hf as EMBED,Cf as EM,ED as ELLIPSE,Rf as DT,Tf as DL,Of as DIV,Af as DIALOG,$f as DFN,Zf as DETAILS,fD as DESC,Yf as DEL,eE as DEFS,Wf as DD,Uf as DATALIST,Qf as DATA,Jf as COLGROUP,Gf as COL,Ff as CODE,oE as CLIPPATH,Bf as CITE,dE as CIRCLE,zf as CAPTION,qf as CANVAS,jf as BUTTON,Xf as BR,Lf as BODY,Df as BLOCKQUOTE,Ef as BDO,ff as BDI,e as BASE,o as B,d as AUDIO,a as ASIDE,n as ARTICLE,t as AREA,fL as ANNOTATION_XML,eD as ANNOTATION,aE as ANIMATETRANSFORM,nE as ANIMATEMOTION,tE as ANIMATE,l as ADDRESS,r as ABBR,s as A};
|
|
1
|
+
function P(f){return f}function h(f){return f}function g(f,L,...j){if(!f)throw new Error("tag must be a string or vode");if(Array.isArray(f))return f;else if(L)return[f,L,...j];else return[f,...j]}function u(f,L,j,...q){if(!f)throw new Error("container must be a valid HTMLElement");if(!L||typeof L!=="object")throw new Error("initialState must be an object");if(typeof j!=="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(L,"patch",{enumerable:!1,configurable:!0,writable:!1,value:async(B)=>{if(!B||typeof B!=="function"&&typeof B!=="object")return;if(E.stats.patchCount++,B?.next){let U=B;E.stats.liveEffectCount++;try{let F=await U.next();while(F.done===!1){E.stats.liveEffectCount++;try{E.patch(F.value),F=await U.next()}finally{E.stats.liveEffectCount--}}E.patch(F.value)}finally{E.stats.liveEffectCount--}}else if(B.then){E.stats.liveEffectCount++;try{let U=await B;E.patch(U)}finally{E.stats.liveEffectCount--}}else if(Array.isArray(B))if(typeof B[0]==="function")if(B.length>1)E.patch(B[0](E.state,...B.slice(1)));else E.patch(B[0](E.state));else E.stats.patchCount--;else if(typeof B==="function")E.patch(B(E.state));else if(E.stats.renderPatchCount++,E.q=A(E.q||{},B,!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 B=Date.now();try{E.state=A(E.state,E.q,!0),E.q=null,E.vode=H(E.state,E.patch,f,0,E.vode,j(E.state))}finally{if(E.isRendering=!1,E.stats.renderCount++,E.stats.lastRenderTime=Date.now()-B,E.q)E.render()}})}),E.patch=L.patch,E.state=L,E.q=null;let X=f;X._vode=E;let z=j(L);E.vode=z,E.vode=H(L,E.patch,f,0,void 0,z);for(let B of q)E.patch(B);return E.patch}function c(f,L){return L.__memo=f,L}function v(f){return f?Array.isArray(f)?f[0]:typeof f==="string"||f.nodeType===Node.TEXT_NODE?"#text":void 0:void 0}function $(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 p(f,L){if(!f)return L;if(!L)return f;if(typeof f==="string"&&typeof L==="string"){let j=f.split(" "),q=L.split(" "),E=new Set([...j,...q]);return Array.from(E).join(" ").trim()}else if(typeof f==="string"&&Array.isArray(L)){let j=new Set([...L,...f.split(" ")]);return Array.from(j).join(" ").trim()}else if(Array.isArray(f)&&typeof L==="string"){let j=new Set([...f,...L.split(" ")]);return Array.from(j).join(" ").trim()}else if(Array.isArray(f)&&Array.isArray(L)){let j=new Set([...f,...L]);return Array.from(j).join(" ").trim()}else if(typeof f==="string"&&typeof L==="object")return{[f]:!0,...L};else if(typeof f==="object"&&typeof L==="string")return{...f,[L]:!0};else if(typeof f==="object"&&typeof L==="object")return{...f,...L};else if(typeof f==="object"&&Array.isArray(L)){let j={...f};for(let q of L)j[q]=!0;return j}else if(Array.isArray(f)&&typeof L==="object"){let j={};for(let q of f)j[q]=!0;for(let q of Object.keys(L))j[q]=L[q];return j}throw new Error(`cannot merge classes of ${f} (${typeof f}) and ${L} (${typeof L})`)}function D(f){let L=x(f);if(L>0)return f.slice(L);return null}function V(f){return f.length-x(f)}function i(f,L){return f[L+x(f)]}function x(f){return $(f)?2:1}function A(f,L,j){if(!L)return f;for(let q in L){let E=L[q];if(E&&typeof E==="object"){let X=f[q];if(X)if(Array.isArray(E))f[q]=[...E];else if(E instanceof Date&&X!==E)f[q]=new Date(E);else if(Array.isArray(X))f[q]=A({},E,j);else if(typeof X==="object")A(f[q],E,j);else f[q]=A({},E,j);else if(Array.isArray(E))f[q]=[...E];else if(E instanceof Date)f[q]=new Date(E);else f[q]=A({},E,j)}else if(E===void 0&&j)delete f[q];else f[q]=E}return f}function H(f,L,j,q,E,X,z){X=I(f,X,E);let B=!X||typeof X==="number"||typeof X==="boolean";if(X===E||!E&&B)return E;let U=E?.nodeType===Node.TEXT_NODE,F=U?E:E?.node;if(B){F?.onUnmount&&L(F.onUnmount(F)),F?.remove();return}let T=!B&&k(X),R=!B&&b(X),M=!!X&&typeof X!=="string"&&!!(X?.node||X?.nodeType===Node.TEXT_NODE);if(!T&&!R&&!M&&!E)throw new Error("Invalid vode: "+typeof X+" "+JSON.stringify(X));else if(M&&T)X=X.wholeText;else if(M&&R)X=[...X];if(U&&T){if(F.nodeValue!==X)F.nodeValue=X;return E}if(T&&(!F||!U)){let J=document.createTextNode(X);if(F)F.onUnmount&&L(F.onUnmount(F)),F.replaceWith(J);else if(j.childNodes[q])j.insertBefore(J,j.childNodes[q]);else j.appendChild(J);return J}if(R&&(!F||U||E[0]!==X[0])){z=z||X[0]==="svg";let J=z?document.createElementNS("http://www.w3.org/2000/svg",X[0]):document.createElement(X[0]);X.node=J;let O=X;if(1 in O)O[1]=I(f,O[1],void 0);let Y=$(X);if(K(L,J,void 0,Y,z),F)F.onUnmount&&L(F.onUnmount(F)),F.replaceWith(J);else if(j.childNodes[q])j.insertBefore(J,j.childNodes[q]);else j.appendChild(J);let W=D(X);if(W)for(let Q=0;Q<W.length;Q++){let G=W[Q],Z=H(f,L,J,Q,void 0,G,z);X[Y?Q+2:Q+1]=Z}return J.onMount&&L(J.onMount(J)),X}if(!U&&R&&E[0]===X[0]){z=z||X[0]==="svg",X.node=F;let J=X,O=E,Y=!1;if(J[1]?.__memo){let G=J[1];if(J[1]=I(f,J[1],O[1]),G!==J[1]){let Z=$(X);K(L,F,$(E),Z,z),Y=!!Z}}else{let G=$(X);K(L,F,$(E),G,z),Y=!!G}let W=D(X),Q=D(E);if(W){for(let G=0;G<W.length;G++){let Z=W[G],_=Q&&Q[G],N=H(f,L,F,G,_,Z,z);if(N)X[Y?G+2:G+1]=N}for(let G=W.length;Q&&G<Q.length;G++)if(Q[G]?.node)Q[G].node.remove();else if(Q[G]?.nodeType===Node.TEXT_NODE)Q[G].remove()}for(let G=W?.length||0;G<Q?.length;G++)if(Q[G]?.node)Q[G].node.remove();else if(Q[G]?.nodeType===Node.TEXT_NODE)Q[G].remove();return X}return}function b(f){return Array.isArray(f)&&f.length>0&&typeof f[0]==="string"}function k(f){return typeof f==="string"||f?.nodeType===Node.TEXT_NODE}function I(f,L,j){if(typeof L!=="function")return L;let q=L?.__memo,E=j?.__memo;if(Array.isArray(q)&&Array.isArray(E)&&q.length===E.length){let z=!0;for(let B=0;B<q.length;B++)if(q[B]!==E[B]){z=!1;break}if(z)return j}let X=S(L,f);if(typeof X==="object")X.__memo=L?.__memo;return X}function S(f,L){if(typeof f==="function")return S(f(L),L);else return f}function K(f,L,j,q,E){if(!q&&!j)return;if(j)for(let X in j){let z=j[X],B=q?.[X];if(z!==B)if(q)q[X]=C(f,L,X,z,B,E);else C(f,L,X,z,void 0,E)}if(q&&j){for(let X in q)if(!(X in j)){let z=q[X];q[X]=C(f,L,X,void 0,z,E)}}else if(q)for(let X in q){let z=q[X];q[X]=C(f,L,X,void 0,z,E)}}function C(f,L,j,q,E,X){if(j==="style")if(!E)L.style.cssText="";else if(q){for(let z in{...q,...E})if(!q||E[z]!==q[z])L.style[z]=E[z];else if(q[z]&&!E[z])L.style[z]=void 0}else for(let z in E)L.style[z]=E[z];else if(j==="class")if(X)if(E){let z=m(E);L.classList.value=z}else L.classList.value="";else if(E){let z=m(E);L.className=z}else L.className="";else if(j[0]==="o"&&j[1]==="n")if(E){let z=null;if(typeof E==="function"){let B=E;z=(U)=>f([B,U])}else if(Array.isArray(E)){let B=E,U=E[0];if(B.length>1)z=()=>f([U,...B.slice(1)]);else z=(F)=>f([U,F])}else if(typeof E==="object")z=()=>f(E);L[j]=z}else L[j]=null;else if(E!==null&&E!==void 0&&E!==!1)L.setAttribute(j,E);else L.removeAttribute(j);return E}function m(f){if(typeof f==="string")return f;else if(Array.isArray(f))return f.map(m).join(" ");else if(typeof f==="object")return Object.keys(f).filter((L)=>f[L]).join(" ");else return""}var s="a",r="abbr",l="address",t="area",n="article",a="aside",d="audio",o="b",e="base",ff="bdi",Ef="bdo",Lf="blockquote",Xf="body",jf="br",qf="button",zf="canvas",Bf="caption",Ff="cite",Gf="code",Jf="col",Qf="colgroup",Uf="data",Wf="datalist",Yf="dd",Zf="del",$f="details",Af="dfn",Of="dialog",Tf="div",Rf="dl",Cf="dt",Hf="em",Mf="embed",Df="fieldset",If="figcaption",Kf="figure",mf="footer",xf="form",Nf="h1",Sf="h2",yf="h3",_f="h4",bf="h5",kf="h6",Pf="head",hf="header",gf="hgroup",uf="hr",cf="html",vf="i",pf="iframe",Vf="img",wf="input",sf="ins",rf="kbd",lf="label",tf="legend",nf="li",af="link",df="main",of="map",ef="mark",fE="menu",EE="meta",LE="meter",XE="nav",jE="noscript",qE="object",zE="ol",BE="optgroup",FE="option",GE="output",JE="p",QE="picture",UE="pre",WE="progress",YE="q",ZE="rp",$E="rt",AE="ruby",OE="s",TE="samp",RE="script",CE="section",HE="select",ME="slot",DE="small",IE="source",KE="span",mE="strong",xE="style",NE="sub",SE="summary",yE="sup",_E="table",bE="tbody",kE="td",PE="template",hE="textarea",gE="tfoot",uE="th",cE="thead",vE="time",pE="title",VE="tr",iE="track",wE="u",sE="ul",rE="video",lE="wbr",tE="animate",nE="animateMotion",aE="animateTransform",dE="circle",oE="clipPath",eE="defs",fL="desc",EL="ellipse",LL="feBlend",XL="feColorMatrix",jL="feComponentTransfer",qL="feComposite",zL="feConvolveMatrix",BL="feDiffuseLighting",FL="feDisplacementMap",GL="feDistantLight",JL="feDropShadow",QL="feFlood",UL="feFuncA",WL="feFuncB",YL="feFuncG",ZL="feFuncR",$L="feGaussianBlur",AL="feImage",OL="feMerge",TL="feMergeNode",RL="feMorphology",CL="feOffset",HL="fePointLight",ML="feSpecularLighting",DL="feSpotLight",IL="feTile",KL="feTurbulence",mL="filter",xL="foreignObject",NL="g",SL="image",yL="line",_L="linearGradient",bL="marker",kL="mask",PL="metadata",hL="mpath",gL="path",uL="pattern",cL="polygon",vL="polyline",pL="radialGradient",VL="rect",iL="set",wL="stop",sL="svg",rL="switch",lL="symbol",tL="text",nL="textPath",aL="tspan",dL="use",oL="view",eL="annotation",fX="annotation-xml",EX="maction",LX="math",XX="merror",jX="mfrac",qX="mi",zX="mmultiscripts",BX="mn",FX="mo",GX="mover",JX="mpadded",QX="mphantom",UX="mprescripts",WX="mroot",YX="mrow",ZX="ms",$X="mspace",AX="msqrt",OX="mstyle",TX="msub",RX="msubsup",CX="msup",HX="mtable",MX="mtd",DX="mtext",IX="mtr",KX="munder",mX="munderover",xX="semantics";function SX(f){let L=document.createElement("div");L.innerHTML=f.trim();let j=[];for(let q of L.childNodes){let E=y(q);if(E!=null)j.push(E)}return j}function y(f){if(f.nodeType===Node.TEXT_NODE)return f.textContent;if(f.nodeType!==Node.ELEMENT_NODE)return;let L=[f.tagName.toLowerCase()];if(f.hasAttributes()){let j={};for(let q of f.attributes)j[q.name]=q.value;L.push(j)}for(let j of f.childNodes){let q=y(j);if(q&&(typeof q!=="string"||q.length>0))L.push(q)}return L}export{g as vode,v as tag,$ as props,p as mergeClass,c as memo,SX as htmlToVode,P as createState,h as createPatch,x as childrenStart,D as children,V as childCount,i as child,u as app,lE as WBR,oL as VIEW,rE as VIDEO,dL as USE,sE as UL,wE as U,aL as TSPAN,iE as TRACK,VE as TR,pE as TITLE,vE as TIME,cE as THEAD,uE as TH,gE as TFOOT,nL as TEXTPATH,hE as TEXTAREA,tL as TEXT,PE as TEMPLATE,kE as TD,bE as TBODY,_E as TABLE,lL as SYMBOL,rL as SWITCH,sL as SVG,yE as SUP,SE as SUMMARY,NE as SUB,xE as STYLE,mE as STRONG,wL as STOP,KE as SPAN,IE as SOURCE,DE as SMALL,ME as SLOT,iL as SET,xX as SEMANTICS,HE as SELECT,CE as SECTION,RE as SCRIPT,TE as SAMP,OE as S,AE as RUBY,$E as RT,ZE as RP,VL as RECT,pL as RADIALGRADIENT,YE as Q,WE as PROGRESS,UE as PRE,vL as POLYLINE,cL as POLYGON,QE as PICTURE,uL as PATTERN,gL as PATH,JE as P,GE as OUTPUT,FE as OPTION,BE as OPTGROUP,zE as OL,qE as OBJECT,jE as NOSCRIPT,XE as NAV,mX as MUNDEROVER,KX as MUNDER,IX as MTR,DX as MTEXT,MX as MTD,HX as MTABLE,CX as MSUP,RX as MSUBSUP,TX as MSUB,OX as MSTYLE,AX as MSQRT,$X as MSPACE,ZX as MS,YX as MROW,WX as MROOT,UX as MPRESCRIPTS,QX as MPHANTOM,hL as MPATH,JX as MPADDED,GX as MOVER,FX as MO,BX as MN,zX as MMULTISCRIPTS,qX as MI,jX as MFRAC,LE as METER,PL as METADATA,EE as META,XX as MERROR,fE as MENU,LX as MATH,kL as MASK,bL as MARKER,ef as MARK,of as MAP,df as MAIN,EX as MACTION,af as LINK,_L as LINEARGRADIENT,yL as LINE,nf as LI,tf as LEGEND,lf as LABEL,rf as KBD,sf as INS,wf as INPUT,Vf as IMG,SL as IMAGE,pf as IFRAME,vf as I,cf as HTML,uf as HR,gf as HGROUP,hf as HEADER,Pf as HEAD,kf as H6,bf as H5,_f as H4,yf as H3,Sf as H2,Nf as H1,NL as G,xf as FORM,xL as FOREIGNOBJECT,mf as FOOTER,mL as FILTER,Kf as FIGURE,If as FIGCAPTION,Df as FIELDSET,KL as FETURBULENCE,IL as FETILE,DL as FESPOTLIGHT,ML as FESPECULARLIGHTING,HL as FEPOINTLIGHT,CL as FEOFFSET,RL as FEMORPHOLOGY,TL as FEMERGENODE,OL as FEMERGE,AL as FEIMAGE,$L as FEGAUSSIANBLUR,ZL as FEFUNCR,YL as FEFUNCG,WL as FEFUNCB,UL as FEFUNCA,QL as FEFLOOD,JL as FEDROPSHADOW,GL as FEDISTANTLIGHT,FL as FEDISPLACEMENTMAP,BL as FEDIFFUSELIGHTING,zL as FECONVOLVEMATRIX,qL as FECOMPOSITE,jL as FECOMPONENTTRANSFER,XL as FECOLORMATRIX,LL as FEBLEND,Mf as EMBED,Hf as EM,EL as ELLIPSE,Cf as DT,Rf as DL,Tf as DIV,Of as DIALOG,Af as DFN,$f as DETAILS,fL as DESC,Zf as DEL,eE as DEFS,Yf as DD,Wf as DATALIST,Uf as DATA,Qf as COLGROUP,Jf as COL,Gf as CODE,oE as CLIPPATH,Ff as CITE,dE as CIRCLE,Bf as CAPTION,zf as CANVAS,qf as BUTTON,jf as BR,Xf as BODY,Lf as BLOCKQUOTE,Ef as BDO,ff as BDI,e as BASE,o as B,d as AUDIO,a as ASIDE,n as ARTICLE,t as AREA,fX as ANNOTATION_XML,eL as ANNOTATION,aE as ANIMATETRANSFORM,nE as ANIMATEMOTION,tE as ANIMATE,l as ADDRESS,r as ABBR,s as A};
|
package/dist/vode.mjs
CHANGED
|
@@ -71,7 +71,7 @@ function app(container, initialState, dom, ...initialPatches) {
|
|
|
71
71
|
_vode.patch(action(_vode.state));
|
|
72
72
|
} else {
|
|
73
73
|
_vode.stats.renderPatchCount++;
|
|
74
|
-
_vode.q = mergeState(_vode.q || {}, action);
|
|
74
|
+
_vode.q = mergeState(_vode.q || {}, action, false);
|
|
75
75
|
if (!_vode.isRendering)
|
|
76
76
|
_vode.render();
|
|
77
77
|
}
|
|
@@ -87,7 +87,7 @@ function app(container, initialState, dom, ...initialPatches) {
|
|
|
87
87
|
_vode.isRendering = true;
|
|
88
88
|
const sw = Date.now();
|
|
89
89
|
try {
|
|
90
|
-
_vode.state = mergeState(_vode.state, _vode.q);
|
|
90
|
+
_vode.state = mergeState(_vode.state, _vode.q, true);
|
|
91
91
|
_vode.q = null;
|
|
92
92
|
_vode.vode = render(_vode.state, _vode.patch, container, 0, _vode.vode, dom(_vode.state));
|
|
93
93
|
} finally {
|
|
@@ -187,7 +187,7 @@ function child(vode2, index) {
|
|
|
187
187
|
function childrenStart(vode2) {
|
|
188
188
|
return props(vode2) ? 2 : 1;
|
|
189
189
|
}
|
|
190
|
-
function mergeState(target, source) {
|
|
190
|
+
function mergeState(target, source, allowDeletion) {
|
|
191
191
|
if (!source)
|
|
192
192
|
return target;
|
|
193
193
|
for (const key in source) {
|
|
@@ -201,20 +201,20 @@ function mergeState(target, source) {
|
|
|
201
201
|
target[key] = new Date(value);
|
|
202
202
|
} else {
|
|
203
203
|
if (Array.isArray(targetValue))
|
|
204
|
-
target[key] = mergeState({}, value);
|
|
204
|
+
target[key] = mergeState({}, value, allowDeletion);
|
|
205
205
|
else if (typeof targetValue === "object")
|
|
206
|
-
mergeState(target[key], value);
|
|
206
|
+
mergeState(target[key], value, allowDeletion);
|
|
207
207
|
else
|
|
208
|
-
target[key] = mergeState({}, value);
|
|
208
|
+
target[key] = mergeState({}, value, allowDeletion);
|
|
209
209
|
}
|
|
210
210
|
} else if (Array.isArray(value)) {
|
|
211
211
|
target[key] = [...value];
|
|
212
212
|
} else if (value instanceof Date) {
|
|
213
213
|
target[key] = new Date(value);
|
|
214
214
|
} else {
|
|
215
|
-
target[key] = mergeState({}, value);
|
|
215
|
+
target[key] = mergeState({}, value, allowDeletion);
|
|
216
216
|
}
|
|
217
|
-
} else if (value === undefined) {
|
|
217
|
+
} else if (value === undefined && allowDeletion) {
|
|
218
218
|
delete target[key];
|
|
219
219
|
} else {
|
|
220
220
|
target[key] = value;
|
package/package.json
CHANGED
package/src/vode.ts
CHANGED
|
@@ -75,10 +75,10 @@ export type ContainerNode<S> = HTMLElement & {
|
|
|
75
75
|
* it contains all necessary stuff for the vode app to function.
|
|
76
76
|
* delete it to clear all resources of the vode app, or remove the container itself */
|
|
77
77
|
_vode: {
|
|
78
|
-
state: PatchableState<S>,
|
|
79
|
-
vode: AttachedVode<S>,
|
|
80
|
-
patch: Dispatch<S>,
|
|
81
|
-
render: () => void,
|
|
78
|
+
state: PatchableState<S>,
|
|
79
|
+
vode: AttachedVode<S>,
|
|
80
|
+
patch: Dispatch<S>,
|
|
81
|
+
render: () => void,
|
|
82
82
|
q: object | null, // next patch aggregate to be applied
|
|
83
83
|
isRendering: boolean,
|
|
84
84
|
/** stats about the overall patches & last render time */
|
|
@@ -171,7 +171,7 @@ export function app<S extends object | unknown>(container: HTMLElement, initialS
|
|
|
171
171
|
_vode.patch!((<EffectFunction<S>>action)(_vode.state));
|
|
172
172
|
} else {
|
|
173
173
|
_vode.stats.renderPatchCount++;
|
|
174
|
-
_vode.q = mergeState(_vode.q || {}, action);
|
|
174
|
+
_vode.q = mergeState(_vode.q || {}, action, false);
|
|
175
175
|
if (!_vode.isRendering) _vode.render!();
|
|
176
176
|
}
|
|
177
177
|
}
|
|
@@ -184,7 +184,7 @@ export function app<S extends object | unknown>(container: HTMLElement, initialS
|
|
|
184
184
|
_vode.isRendering = true;
|
|
185
185
|
const sw = Date.now();
|
|
186
186
|
try {
|
|
187
|
-
_vode.state = mergeState(_vode.state, _vode.q);
|
|
187
|
+
_vode.state = mergeState(_vode.state, _vode.q, true);
|
|
188
188
|
_vode.q = null;
|
|
189
189
|
_vode.vode = render(_vode.state, _vode.patch, container, 0, _vode.vode, dom(_vode.state))!;
|
|
190
190
|
} finally {
|
|
@@ -321,7 +321,7 @@ export function childrenStart<S>(vode: ChildVode<S> | AttachedVode<S>): number {
|
|
|
321
321
|
return props(vode) ? 2 : 1;
|
|
322
322
|
}
|
|
323
323
|
|
|
324
|
-
function mergeState(target: any, source: any) {
|
|
324
|
+
function mergeState(target: any, source: any, allowDeletion: boolean) {
|
|
325
325
|
if (!source) return target;
|
|
326
326
|
|
|
327
327
|
for (const key in source) {
|
|
@@ -334,19 +334,19 @@ function mergeState(target: any, source: any) {
|
|
|
334
334
|
} else if (value instanceof Date && targetValue !== value) {
|
|
335
335
|
target[key] = new Date(value);
|
|
336
336
|
} else {
|
|
337
|
-
if (Array.isArray(targetValue)) target[key] = mergeState({}, value);
|
|
338
|
-
else if (typeof targetValue === "object") mergeState(target[key], value);
|
|
339
|
-
else target[key] = mergeState({}, value);
|
|
337
|
+
if (Array.isArray(targetValue)) target[key] = mergeState({}, value, allowDeletion);
|
|
338
|
+
else if (typeof targetValue === "object") mergeState(target[key], value, allowDeletion);
|
|
339
|
+
else target[key] = mergeState({}, value, allowDeletion);
|
|
340
340
|
}
|
|
341
341
|
} else if (Array.isArray(value)) {
|
|
342
342
|
target[key] = [...value];
|
|
343
343
|
} else if (value instanceof Date) {
|
|
344
344
|
target[key] = new Date(value);
|
|
345
345
|
} else {
|
|
346
|
-
target[key] = mergeState({}, value);
|
|
346
|
+
target[key] = mergeState({}, value, allowDeletion);
|
|
347
347
|
}
|
|
348
348
|
}
|
|
349
|
-
else if (value === undefined) {
|
|
349
|
+
else if (value === undefined && allowDeletion) {
|
|
350
350
|
delete target[key];
|
|
351
351
|
}
|
|
352
352
|
else {
|