@fun-land/fun-web 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +45 -17
- package/dist/esm/src/dom.d.ts +16 -9
- package/dist/esm/src/dom.js +14 -4
- package/dist/esm/src/dom.js.map +1 -1
- package/dist/esm/src/index.d.ts +1 -1
- package/dist/esm/src/index.js +1 -1
- package/dist/esm/src/index.js.map +1 -1
- package/dist/esm/tsconfig.publish.tsbuildinfo +1 -1
- package/dist/src/dom.d.ts +16 -9
- package/dist/src/dom.js +18 -6
- package/dist/src/dom.js.map +1 -1
- package/dist/src/index.d.ts +1 -1
- package/dist/src/index.js +4 -2
- package/dist/src/index.js.map +1 -1
- package/dist/tsconfig.publish.tsbuildinfo +1 -1
- package/examples/README.md +4 -4
- package/examples/counter/counter.ts +2 -2
- package/examples/todo-app/Todo.ts +33 -46
- package/examples/todo-app/todo-app.ts +32 -35
- package/package.json +9 -7
- package/src/dom.test.ts +23 -25
- package/src/dom.ts +44 -21
- package/src/index.ts +3 -1
- package/src/mount.test.ts +4 -4
- package/src/state.test.ts +44 -18
- package/tsconfig.json +1 -1
package/README.md
CHANGED
|
@@ -24,7 +24,7 @@ Perfect for embedding interactive components in static sites, building lightweig
|
|
|
24
24
|
## Installation
|
|
25
25
|
|
|
26
26
|
```bash
|
|
27
|
-
|
|
27
|
+
pnpm add @fun-land/fun-web @fun-land/accessor
|
|
28
28
|
```
|
|
29
29
|
|
|
30
30
|
## Quick Start
|
|
@@ -143,7 +143,7 @@ userState.prop("name").get(); // "Alice"
|
|
|
143
143
|
userState.prop("age").set(31);
|
|
144
144
|
|
|
145
145
|
// Subscribe to changes (cleaned up when signal aborts)
|
|
146
|
-
userState.prop("name").
|
|
146
|
+
userState.prop("name").watch(signal, (name) => {
|
|
147
147
|
element.textContent = name; // runs when name changes
|
|
148
148
|
});
|
|
149
149
|
```
|
|
@@ -220,10 +220,10 @@ const input = on(
|
|
|
220
220
|
);
|
|
221
221
|
```
|
|
222
222
|
|
|
223
|
-
**Use `.
|
|
223
|
+
**Use `.watch()` for complex logic:**
|
|
224
224
|
|
|
225
225
|
```typescript
|
|
226
|
-
state.
|
|
226
|
+
state.watch(signal, (s) => {
|
|
227
227
|
element.textContent = s.count > 100 ? "Max!" : String(s.count);
|
|
228
228
|
element.className = s.count > 100 ? "maxed" : "normal";
|
|
229
229
|
element.setAttribute("aria-label", `Count: ${s.count}`);
|
|
@@ -235,14 +235,14 @@ state.subscribe(signal, (s) => {
|
|
|
235
235
|
All subscriptions and event listeners require an AbortSignal. When the signal aborts, everything cleans up automatically:
|
|
236
236
|
|
|
237
237
|
```typescript
|
|
238
|
-
const MyComponent: Component<{ state: FunState<State> }> = (signal,
|
|
238
|
+
const MyComponent: Component<{ state: FunState<State> }> = (signal, {state}) => {
|
|
239
239
|
const display = h("div");
|
|
240
240
|
const button = h("button");
|
|
241
241
|
|
|
242
242
|
// All three clean up when signal aborts
|
|
243
|
-
bindProperty(display, "textContent",
|
|
244
|
-
on(button, "click", () =>
|
|
245
|
-
|
|
243
|
+
bindProperty(display, "textContent", state.prop("count"), signal);
|
|
244
|
+
on(button, "click", () => state.mod(increment), signal);
|
|
245
|
+
state.watch(signal, (s) => console.log("Changed:", s));
|
|
246
246
|
|
|
247
247
|
return h("div", {}, [display, button]);
|
|
248
248
|
};
|
|
@@ -255,6 +255,22 @@ For the most part you won't have to worry about the abort signal if you use the
|
|
|
255
255
|
|
|
256
256
|
## Best Practices
|
|
257
257
|
|
|
258
|
+
**Don't have one big app state**
|
|
259
|
+
This isn't redux. There's little reason to create giant state objects. Create state near the leaves and hoist it when you need to. That said
|
|
260
|
+
|
|
261
|
+
**You can have more that one state**
|
|
262
|
+
It's just a value. If having one state manage multiple properties works then great but if you want to have several that's fine too.
|
|
263
|
+
|
|
264
|
+
**Deep chains of .prop() are a smell**
|
|
265
|
+
Code like `state.prop('foo').prop('bar').prop('baz').get()` is a sign your data model is too complex. However if you want to keep it that way you can create accessors to focus down more simply.
|
|
266
|
+
|
|
267
|
+
```ts
|
|
268
|
+
// create an reusable accssor at module scope
|
|
269
|
+
const bazFromState = Acc<MyState>().prop('foo').prop('bar').prop('baz')
|
|
270
|
+
// in your component
|
|
271
|
+
const baz = state.focus(bazFromState).get()
|
|
272
|
+
```
|
|
273
|
+
|
|
258
274
|
**Prefer helpers over manual subscriptions:**
|
|
259
275
|
|
|
260
276
|
```typescript
|
|
@@ -262,7 +278,7 @@ For the most part you won't have to worry about the abort signal if you use the
|
|
|
262
278
|
bindProperty(element, "textContent", state.prop("count"), signal);
|
|
263
279
|
|
|
264
280
|
// ❌ Avoid (when bindProperty works)
|
|
265
|
-
state.prop("count").
|
|
281
|
+
state.prop("count").watch(signal, (count) => {
|
|
266
282
|
element.textContent = String(count);
|
|
267
283
|
});
|
|
268
284
|
```
|
|
@@ -278,14 +294,21 @@ on(button, "click", (e) => {
|
|
|
278
294
|
// ❌ Avoid - loses type information
|
|
279
295
|
button.addEventListener("click", (e) => {
|
|
280
296
|
(e.currentTarget as HTMLButtonElement).disabled = true;
|
|
281
|
-
}
|
|
297
|
+
}); // ❌ Forgot {signal} !
|
|
298
|
+
|
|
299
|
+
// ❌ Avoid binding events in props
|
|
300
|
+
h('button', {onclick: (e) => {
|
|
301
|
+
// ❌ type info lost!
|
|
302
|
+
(e.currentTarget as HTMLButtonElement).disabled = true;
|
|
303
|
+
// ❌ event handler not cleaned up!
|
|
304
|
+
}})
|
|
282
305
|
```
|
|
283
306
|
|
|
284
307
|
**Manual subscriptions for complex updates:**
|
|
285
308
|
|
|
286
309
|
```typescript
|
|
287
|
-
// ✅ complex updates may need
|
|
288
|
-
state.
|
|
310
|
+
// ✅ complex updates may need watch
|
|
311
|
+
state.watch(signal, (s) => {
|
|
289
312
|
// Multiple DOM updates based on complex conditions
|
|
290
313
|
if (s.status === "loading") {
|
|
291
314
|
spinner.style.display = "block";
|
|
@@ -437,7 +460,8 @@ addClass: (...classes: string[]) => (el: Element) => Element
|
|
|
437
460
|
removeClass: (...classes: string[]) => (el: Element) => Element
|
|
438
461
|
toggleClass: (className: string, force?: boolean) => (el: Element) => Element
|
|
439
462
|
append: (...children: Element[]) => (el: Element) => Element
|
|
440
|
-
|
|
463
|
+
// pipe a value through a series of endomorphisms
|
|
464
|
+
pipeAll: <T>(x: T, ...fns: Array<(x: T) => T>) => T
|
|
441
465
|
```
|
|
442
466
|
|
|
443
467
|
### Mounting
|
|
@@ -474,20 +498,24 @@ Components compose by calling other components and passing focused state via pro
|
|
|
474
498
|
|
|
475
499
|
```typescript
|
|
476
500
|
import { prop } from "@fun-land/accessor";
|
|
501
|
+
import { UserProfile, UserData } from "./UserProfile";
|
|
502
|
+
import { SettingsPanel, Settings } from "./Settings";
|
|
477
503
|
|
|
504
|
+
// Parent state is composed from the child states
|
|
478
505
|
interface AppState {
|
|
479
506
|
user: UserData;
|
|
480
507
|
settings: Settings;
|
|
481
508
|
}
|
|
482
509
|
|
|
483
|
-
const App: Component<{ state: FunState<AppState> }> = (signal,
|
|
510
|
+
const App: Component<{ state: FunState<AppState> }> = (signal, {state}) =>
|
|
484
511
|
h("div", {}, [
|
|
485
512
|
UserProfile(signal, {
|
|
486
513
|
editable: true,
|
|
487
|
-
state
|
|
514
|
+
// Focus the state on what the child needs
|
|
515
|
+
state: state.focus(prop<AppState>()("user")),
|
|
488
516
|
}),
|
|
489
517
|
SettingsPanel(signal, {
|
|
490
|
-
state:
|
|
518
|
+
state: state.focus(prop<AppState>()("settings")),
|
|
491
519
|
})
|
|
492
520
|
]);
|
|
493
521
|
```
|
|
@@ -501,7 +529,7 @@ See working examples:
|
|
|
501
529
|
- `examples/todo-app/todo-app.ts` - Keyed lists and form binding
|
|
502
530
|
|
|
503
531
|
```bash
|
|
504
|
-
|
|
532
|
+
pnpm run build:examples
|
|
505
533
|
open examples/counter/index.html
|
|
506
534
|
open examples/todo-app/todo.html
|
|
507
535
|
```
|
package/dist/esm/src/dom.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/** DOM utilities for functional element creation and manipulation */
|
|
2
|
-
import { FunState } from "
|
|
2
|
+
import { type FunState } from "@fun-land/fun-state";
|
|
3
3
|
import type { ElementChild } from "./types";
|
|
4
|
+
export type Enhancer<El extends Element> = (element: El) => El;
|
|
4
5
|
/**
|
|
5
6
|
* Create an HTML element with attributes and children
|
|
6
7
|
*
|
|
@@ -17,32 +18,34 @@ export declare const h: <Tag extends keyof HTMLElementTagNameMap>(tag: Tag, attr
|
|
|
17
18
|
/**
|
|
18
19
|
* Set text content of an element (returns element for chaining)
|
|
19
20
|
*/
|
|
20
|
-
export declare const text: (content: string | number) => (el:
|
|
21
|
+
export declare const text: (content: string | number) => <El extends Element>(el: El) => El;
|
|
21
22
|
/**
|
|
22
23
|
* Set an attribute on an element (returns element for chaining)
|
|
23
24
|
*/
|
|
24
|
-
export declare const attr: (name: string, value: string) => (el:
|
|
25
|
+
export declare const attr: (name: string, value: string) => <El extends Element>(el: El) => El;
|
|
25
26
|
/**
|
|
26
27
|
* Set multiple attributes on an element (returns element for chaining)
|
|
27
28
|
*/
|
|
28
|
-
export declare const attrs: (obj: Record<string, string>) => (el:
|
|
29
|
+
export declare const attrs: (obj: Record<string, string>) => <El extends Element>(el: El) => El;
|
|
29
30
|
export declare function bindProperty<E extends Element, K extends keyof E>(el: E, key: K, fs: FunState<E[K]>, signal: AbortSignal): E;
|
|
31
|
+
export declare const bindPropertyTo: <E extends Element, K extends keyof E & string>(key: K, state: FunState<E[K]>, signal: AbortSignal) => (el: E) => E;
|
|
30
32
|
/**
|
|
31
33
|
* Add CSS classes to an element (returns element for chaining)
|
|
32
34
|
*/
|
|
33
|
-
export declare const addClass: (...classes: string[]) => (el:
|
|
35
|
+
export declare const addClass: (...classes: string[]) => <El extends Element>(el: El) => El;
|
|
34
36
|
/**
|
|
35
37
|
* Remove CSS classes from an element (returns element for chaining)
|
|
36
38
|
*/
|
|
37
|
-
export declare const removeClass: (...classes: string[]) => (el:
|
|
39
|
+
export declare const removeClass: (...classes: string[]) => <El extends Element>(el: El) => El;
|
|
38
40
|
/**
|
|
39
41
|
* Toggle a CSS class on an element (returns element for chaining)
|
|
40
42
|
*/
|
|
41
43
|
export declare const toggleClass: (className: string, force?: boolean) => (el: Element) => Element;
|
|
42
44
|
/**
|
|
43
45
|
* Append children to an element (returns parent for chaining)
|
|
46
|
+
* @returns {Enhancer}
|
|
44
47
|
*/
|
|
45
|
-
export declare const append: (...children: Element[]) => (el:
|
|
48
|
+
export declare const append: (...children: Element[]) => <El extends Element>(el: El) => El;
|
|
46
49
|
/**
|
|
47
50
|
* Add event listener with required AbortSignal (returns element for chaining)
|
|
48
51
|
* Signal is required to prevent forgetting cleanup
|
|
@@ -50,10 +53,14 @@ export declare const append: (...children: Element[]) => (el: Element) => Elemen
|
|
|
50
53
|
export declare const on: <E extends Element, K extends keyof HTMLElementEventMap>(el: E, type: K, handler: (ev: HTMLElementEventMap[K] & {
|
|
51
54
|
currentTarget: E;
|
|
52
55
|
}) => void, signal: AbortSignal) => E;
|
|
56
|
+
/** Enhancer version of `on()` */
|
|
57
|
+
export declare const onTo: <E extends Element, K extends keyof HTMLElementEventMap>(type: K, handler: (ev: HTMLElementEventMap[K] & {
|
|
58
|
+
currentTarget: E;
|
|
59
|
+
}) => void, signal: AbortSignal) => (el: E) => E;
|
|
53
60
|
/**
|
|
54
|
-
*
|
|
61
|
+
* Apply enhancers to an HTMLElement.
|
|
55
62
|
*/
|
|
56
|
-
export declare const
|
|
63
|
+
export declare const enhance: <El extends Element>(x: El, ...fns: Array<Enhancer<El>>) => El;
|
|
57
64
|
/**
|
|
58
65
|
*
|
|
59
66
|
*/
|
package/dist/esm/src/dom.js
CHANGED
|
@@ -66,6 +66,7 @@ export const text = (content) => (el) => {
|
|
|
66
66
|
el.textContent = String(content);
|
|
67
67
|
return el;
|
|
68
68
|
};
|
|
69
|
+
;
|
|
69
70
|
/**
|
|
70
71
|
* Set an attribute on an element (returns element for chaining)
|
|
71
72
|
*/
|
|
@@ -73,6 +74,7 @@ export const attr = (name, value) => (el) => {
|
|
|
73
74
|
el.setAttribute(name, value);
|
|
74
75
|
return el;
|
|
75
76
|
};
|
|
77
|
+
;
|
|
76
78
|
/**
|
|
77
79
|
* Set multiple attributes on an element (returns element for chaining)
|
|
78
80
|
*/
|
|
@@ -82,15 +84,17 @@ export const attrs = (obj) => (el) => {
|
|
|
82
84
|
});
|
|
83
85
|
return el;
|
|
84
86
|
};
|
|
87
|
+
;
|
|
85
88
|
export function bindProperty(el, key, fs, signal) {
|
|
86
89
|
// initial sync
|
|
87
90
|
el[key] = fs.get();
|
|
88
91
|
// reactive sync
|
|
89
|
-
fs.
|
|
92
|
+
fs.watch(signal, (v) => {
|
|
90
93
|
el[key] = v;
|
|
91
94
|
});
|
|
92
95
|
return el;
|
|
93
96
|
}
|
|
97
|
+
export const bindPropertyTo = (key, state, signal) => (el) => bindProperty(el, key, state, signal);
|
|
94
98
|
/**
|
|
95
99
|
* Add CSS classes to an element (returns element for chaining)
|
|
96
100
|
*/
|
|
@@ -98,6 +102,7 @@ export const addClass = (...classes) => (el) => {
|
|
|
98
102
|
el.classList.add(...classes);
|
|
99
103
|
return el;
|
|
100
104
|
};
|
|
105
|
+
;
|
|
101
106
|
/**
|
|
102
107
|
* Remove CSS classes from an element (returns element for chaining)
|
|
103
108
|
*/
|
|
@@ -105,6 +110,7 @@ export const removeClass = (...classes) => (el) => {
|
|
|
105
110
|
el.classList.remove(...classes);
|
|
106
111
|
return el;
|
|
107
112
|
};
|
|
113
|
+
;
|
|
108
114
|
/**
|
|
109
115
|
* Toggle a CSS class on an element (returns element for chaining)
|
|
110
116
|
*/
|
|
@@ -114,11 +120,13 @@ export const toggleClass = (className, force) => (el) => {
|
|
|
114
120
|
};
|
|
115
121
|
/**
|
|
116
122
|
* Append children to an element (returns parent for chaining)
|
|
123
|
+
* @returns {Enhancer}
|
|
117
124
|
*/
|
|
118
125
|
export const append = (...children) => (el) => {
|
|
119
126
|
children.forEach((child) => el.appendChild(child));
|
|
120
127
|
return el;
|
|
121
128
|
};
|
|
129
|
+
;
|
|
122
130
|
/**
|
|
123
131
|
* Add event listener with required AbortSignal (returns element for chaining)
|
|
124
132
|
* Signal is required to prevent forgetting cleanup
|
|
@@ -127,10 +135,12 @@ export const on = (el, type, handler, signal) => {
|
|
|
127
135
|
el.addEventListener(type, handler, { signal });
|
|
128
136
|
return el;
|
|
129
137
|
};
|
|
138
|
+
/** Enhancer version of `on()` */
|
|
139
|
+
export const onTo = (type, handler, signal) => (el) => on(el, type, handler, signal);
|
|
130
140
|
/**
|
|
131
|
-
*
|
|
141
|
+
* Apply enhancers to an HTMLElement.
|
|
132
142
|
*/
|
|
133
|
-
export const
|
|
143
|
+
export const enhance = (x, ...fns) => fns.reduce((acc, fn) => fn(acc), x);
|
|
134
144
|
/**
|
|
135
145
|
* Keep a DOM container's children in sync with a FunState<Array<T>> using stable `t.key`.
|
|
136
146
|
*
|
|
@@ -195,7 +205,7 @@ export function keyedChildren(parent, signal, list, renderRow) {
|
|
|
195
205
|
}
|
|
196
206
|
};
|
|
197
207
|
// Reconcile whenever the list changes; `subscribe` will unsubscribe on abort (per your fix).
|
|
198
|
-
list.
|
|
208
|
+
list.watch(signal, reconcile);
|
|
199
209
|
// Ensure all children clean up when parent aborts
|
|
200
210
|
signal.addEventListener("abort", dispose, { once: true });
|
|
201
211
|
// Initial mount
|
package/dist/esm/src/dom.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom.js","sourceRoot":"","sources":["../../../src/dom.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"dom.js","sourceRoot":"","sources":["../../../src/dom.ts"],"names":[],"mappings":"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"}
|
package/dist/esm/src/index.d.ts
CHANGED
|
@@ -3,5 +3,5 @@ export type { FunState } from "./state";
|
|
|
3
3
|
export type { MountedComponent } from "./mount";
|
|
4
4
|
export type { KeyedChildren } from "./dom";
|
|
5
5
|
export { funState } from "./state";
|
|
6
|
-
export { h, text, attr, attrs, addClass, removeClass, toggleClass, append, on, bindProperty, keyedChildren,
|
|
6
|
+
export { h, text, attr, attrs, addClass, removeClass, toggleClass, append, on, onTo, bindProperty, bindPropertyTo, keyedChildren, enhance, $, $$, } from "./dom";
|
|
7
7
|
export { mount } from "./mount";
|
package/dist/esm/src/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// @fun-land/fun-web - Web component library for fun-land
|
|
2
2
|
export { funState } from "./state";
|
|
3
|
-
export { h, text, attr, attrs, addClass, removeClass, toggleClass, append, on, bindProperty, keyedChildren,
|
|
3
|
+
export { h, text, attr, attrs, addClass, removeClass, toggleClass, append, on, onTo, bindProperty, bindPropertyTo, keyedChildren, enhance, $, $$, } from "./dom";
|
|
4
4
|
export { mount } from "./mount";
|
|
5
5
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,yDAAyD;AAOzD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,EACL,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,WAAW,EACX,WAAW,EACX,MAAM,EACN,EAAE,EACF,YAAY,EACZ,aAAa,EACb,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,yDAAyD;AAOzD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,EACL,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,WAAW,EACX,WAAW,EACX,MAAM,EACN,EAAE,EACF,IAAI,EACJ,YAAY,EACZ,cAAc,EACd,aAAa,EACb,OAAO,EACP,CAAC,EACD,EAAE,GACH,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
|