create-foldkit-app 0.17.1 → 0.18.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 +28 -16
- package/dist/examples.js +24 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -18,22 +18,34 @@ The CLI prompts you for a project name, starter example, and package manager. Pa
|
|
|
18
18
|
|
|
19
19
|
## Examples
|
|
20
20
|
|
|
21
|
-
| Example
|
|
22
|
-
|
|
|
23
|
-
| `counter`
|
|
24
|
-
| `counters`
|
|
25
|
-
| `
|
|
26
|
-
| `
|
|
27
|
-
| `
|
|
28
|
-
| `
|
|
29
|
-
| `
|
|
30
|
-
| `
|
|
31
|
-
| `
|
|
32
|
-
| `
|
|
33
|
-
| `
|
|
34
|
-
| `
|
|
35
|
-
| `
|
|
36
|
-
| `
|
|
21
|
+
| Example | Description |
|
|
22
|
+
| ------------------------ | ------------------------------------------------------------------------------------------------------ |
|
|
23
|
+
| `counter` | Simple increment/decrement with reset |
|
|
24
|
+
| `counters` | A dynamic list of Counter Submodels with per-instance routing via a wrapper Message |
|
|
25
|
+
| `todo` | CRUD operations with localStorage persistence |
|
|
26
|
+
| `stopwatch` | Timer with start/stop/reset |
|
|
27
|
+
| `crash-view` | Custom crash fallback UI with crash.view and crash.report |
|
|
28
|
+
| `slow-warnings` | Interactive lab for slow update, view, patch, and Subscription dependency warnings |
|
|
29
|
+
| `form` | Form validation with async email checking |
|
|
30
|
+
| `job-application` | Multi-step form with async validation, file uploads, and per-step error indicators |
|
|
31
|
+
| `weather` | HTTP requests with async state handling |
|
|
32
|
+
| `api-cache` | Query caching in the Model with stale-while-revalidate, request deduplication, and interval refetching |
|
|
33
|
+
| `charting` | Live GitHub and npm telemetry rendered through an ECharts Mount adapter |
|
|
34
|
+
| `routing` | URL routing with parser combinators and route parameters |
|
|
35
|
+
| `query-sync` | URL-driven filtering, sorting, and search with query parameters |
|
|
36
|
+
| `snake` | Classic game built with Subscriptions |
|
|
37
|
+
| `canvas-art` | Declarative 2D canvas with shapes, animation-frame Subscriptions, and pointer events |
|
|
38
|
+
| `generative-art` | Perlin-noise flow field with evolving particle trails, mouse vortex, and high-frequency Messages |
|
|
39
|
+
| `auth` | Authentication with Submodels, OutMessage, and protected routes |
|
|
40
|
+
| `shopping-cart` | Complex state management with nested Models and routing |
|
|
41
|
+
| `pixel-art` | Pixel editor with undo/redo, UI components, and localStorage persistence |
|
|
42
|
+
| `websocket-chat` | Managed resources with WebSocket integration |
|
|
43
|
+
| `managed-resource-layer` | Layer-backed ManagedResource lifecycle with an Effect service |
|
|
44
|
+
| `kanban` | Drag-and-drop board with fractional indexing, keyboard navigation, and screen reader announcements |
|
|
45
|
+
| `map` | Interactive MapLibre GL map with Mount and Subscriptions |
|
|
46
|
+
| `web-components` | QR code designer wiring third-party web components into Foldkit with CustomElement.define |
|
|
47
|
+
| `embedding` | A Foldkit widget embedded in a plain TypeScript host page with Ports and dispose |
|
|
48
|
+
| `ui-showcase` | Every Foldkit UI component with routing and Submodels |
|
|
37
49
|
|
|
38
50
|
## License
|
|
39
51
|
|
package/dist/examples.js
CHANGED
|
@@ -4,10 +4,12 @@ export const EXAMPLE_VALUES = [
|
|
|
4
4
|
'todo',
|
|
5
5
|
'stopwatch',
|
|
6
6
|
'crash-view',
|
|
7
|
+
'slow-warnings',
|
|
7
8
|
'form',
|
|
8
9
|
'job-application',
|
|
9
10
|
'weather',
|
|
10
11
|
'api-cache',
|
|
12
|
+
'charting',
|
|
11
13
|
'routing',
|
|
12
14
|
'query-sync',
|
|
13
15
|
'snake',
|
|
@@ -17,7 +19,9 @@ export const EXAMPLE_VALUES = [
|
|
|
17
19
|
'shopping-cart',
|
|
18
20
|
'pixel-art',
|
|
19
21
|
'websocket-chat',
|
|
22
|
+
'managed-resource-layer',
|
|
20
23
|
'kanban',
|
|
24
|
+
'map',
|
|
21
25
|
'web-components',
|
|
22
26
|
'embedding',
|
|
23
27
|
'ui-showcase',
|
|
@@ -48,6 +52,11 @@ export const examples = [
|
|
|
48
52
|
title: 'crash-view',
|
|
49
53
|
description: 'Custom crash fallback UI with crash.view and crash.report',
|
|
50
54
|
},
|
|
55
|
+
{
|
|
56
|
+
value: 'slow-warnings',
|
|
57
|
+
title: 'slow-warnings',
|
|
58
|
+
description: 'Interactive lab for slow update, view, patch, and Subscription dependency warnings',
|
|
59
|
+
},
|
|
51
60
|
{
|
|
52
61
|
value: 'form',
|
|
53
62
|
title: 'form',
|
|
@@ -68,6 +77,11 @@ export const examples = [
|
|
|
68
77
|
title: 'api-cache',
|
|
69
78
|
description: 'Query caching in the Model with stale-while-revalidate, request deduplication, invalidation, and interval refetching',
|
|
70
79
|
},
|
|
80
|
+
{
|
|
81
|
+
value: 'charting',
|
|
82
|
+
title: 'charting',
|
|
83
|
+
description: 'Live GitHub and npm telemetry rendered through an ECharts Mount adapter with chart events flowing back as Messages',
|
|
84
|
+
},
|
|
71
85
|
{
|
|
72
86
|
value: 'routing',
|
|
73
87
|
title: 'routing',
|
|
@@ -113,11 +127,21 @@ export const examples = [
|
|
|
113
127
|
title: 'websocket-chat',
|
|
114
128
|
description: 'Managed resources with WebSocket integration',
|
|
115
129
|
},
|
|
130
|
+
{
|
|
131
|
+
value: 'managed-resource-layer',
|
|
132
|
+
title: 'managed-resource-layer',
|
|
133
|
+
description: 'Layer-backed ManagedResource lifecycle with an Effect service',
|
|
134
|
+
},
|
|
116
135
|
{
|
|
117
136
|
value: 'kanban',
|
|
118
137
|
title: 'kanban',
|
|
119
138
|
description: 'Drag-and-drop board with fractional indexing, keyboard navigation, and screen reader announcements',
|
|
120
139
|
},
|
|
140
|
+
{
|
|
141
|
+
value: 'map',
|
|
142
|
+
title: 'map',
|
|
143
|
+
description: 'Interactive MapLibre GL map with Mount and Subscriptions',
|
|
144
|
+
},
|
|
121
145
|
{
|
|
122
146
|
value: 'web-components',
|
|
123
147
|
title: 'web-components',
|