nuclo 0.1.34 → 0.1.36
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 +12 -12
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -19,7 +19,7 @@ const counter = div(
|
|
|
19
19
|
}))
|
|
20
20
|
);
|
|
21
21
|
|
|
22
|
-
render(counter);
|
|
22
|
+
render(counter, document.body);
|
|
23
23
|
```
|
|
24
24
|
|
|
25
25
|
## Why nuclo?
|
|
@@ -52,7 +52,7 @@ const app = div(
|
|
|
52
52
|
h1(() => `Count: ${count}`),
|
|
53
53
|
button('Click', on('click', () => { count++; update(); }))
|
|
54
54
|
);
|
|
55
|
-
render(app);
|
|
55
|
+
render(app, document.body);
|
|
56
56
|
```
|
|
57
57
|
|
|
58
58
|
### TypeScript Setup
|
|
@@ -90,7 +90,7 @@ const app = div(
|
|
|
90
90
|
button('Reset', on('click', () => { count = 0; update(); }))
|
|
91
91
|
);
|
|
92
92
|
|
|
93
|
-
render(app);
|
|
93
|
+
render(app, document.body);
|
|
94
94
|
```
|
|
95
95
|
|
|
96
96
|
### Todo List
|
|
@@ -102,12 +102,12 @@ type Todo = { id: number; text: string; done: boolean };
|
|
|
102
102
|
|
|
103
103
|
let todos: Todo[] = [];
|
|
104
104
|
let nextId = 1;
|
|
105
|
-
let
|
|
105
|
+
let inputValue = '';
|
|
106
106
|
|
|
107
107
|
function addTodo() {
|
|
108
|
-
if (!
|
|
109
|
-
todos.push({ id: nextId++, text:
|
|
110
|
-
|
|
108
|
+
if (!inputValue.trim()) return;
|
|
109
|
+
todos.push({ id: nextId++, text: inputValue, done: false });
|
|
110
|
+
inputValue = '';
|
|
111
111
|
update();
|
|
112
112
|
}
|
|
113
113
|
|
|
@@ -116,8 +116,8 @@ const app = div(
|
|
|
116
116
|
|
|
117
117
|
// Input
|
|
118
118
|
div(
|
|
119
|
-
input({ value: () =>
|
|
120
|
-
on('input', e => {
|
|
119
|
+
input({ value: () => inputValue },
|
|
120
|
+
on('input', e => { inputValue = e.target.value; update(); }),
|
|
121
121
|
on('keydown', e => e.key === 'Enter' && addTodo())
|
|
122
122
|
),
|
|
123
123
|
button('Add', on('click', addTodo))
|
|
@@ -143,7 +143,7 @@ const app = div(
|
|
|
143
143
|
)
|
|
144
144
|
);
|
|
145
145
|
|
|
146
|
-
render(app);
|
|
146
|
+
render(app, document.body);
|
|
147
147
|
```
|
|
148
148
|
|
|
149
149
|
### Real-time Search Filter
|
|
@@ -195,7 +195,7 @@ const app = div(
|
|
|
195
195
|
)
|
|
196
196
|
);
|
|
197
197
|
|
|
198
|
-
render(app);
|
|
198
|
+
render(app, document.body);
|
|
199
199
|
```
|
|
200
200
|
|
|
201
201
|
### Loading States & Async
|
|
@@ -236,7 +236,7 @@ const app = div(
|
|
|
236
236
|
)
|
|
237
237
|
);
|
|
238
238
|
|
|
239
|
-
render(app);
|
|
239
|
+
render(app, document.body);
|
|
240
240
|
```
|
|
241
241
|
|
|
242
242
|
---
|