@ktjs/shortcuts 0.32.5 → 0.33.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 +35 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -12,11 +12,14 @@
|
|
|
12
12
|
|
|
13
13
|
<p align="center"><strong>Visit KT.js: <a href="https://baendlorel.github.io/kt.js/">https://baendlorel.github.io/kt.js/</a></strong></p>
|
|
14
14
|
|
|
15
|
+
> kt.js is still under development, so there might be some breaking changes. Note the Update Log below
|
|
16
|
+
|
|
15
17
|
## Recent Updates
|
|
16
18
|
|
|
17
|
-
1.
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
1. `ref.value` remains the standard read API, and it can also replace the whole outer value with `ref.value = nextValue`.
|
|
20
|
+
2. `ref.draft` is the deep-mutation entry for nested objects, arrays, `Map` / `Set`, and custom mutable objects.
|
|
21
|
+
3. `ref.draft` itself is not assignable; mutate nested fields or call mutating methods on the returned object instead.
|
|
22
|
+
4. `addOnChange((newValue, oldValue) => ...)` keeps `oldValue` as the previous reference, not a deep snapshot.
|
|
20
23
|
|
|
21
24
|
## Community
|
|
22
25
|
|
|
@@ -29,6 +32,35 @@ kt.js is a simple framework with a tiny runtime that renders real DOM directly (
|
|
|
29
32
|
|
|
30
33
|
KT.js focuses on one principle: keep direct control of the DOM and avoid unnecessary repainting.
|
|
31
34
|
|
|
35
|
+
## Reactive Contract
|
|
36
|
+
|
|
37
|
+
```ts
|
|
38
|
+
const user = ref({ profile: { name: 'John' }, tags: ['new'] });
|
|
39
|
+
|
|
40
|
+
console.log(user.value.profile.name); // read
|
|
41
|
+
|
|
42
|
+
user.value = {
|
|
43
|
+
...user.value,
|
|
44
|
+
profile: { ...user.value.profile, name: 'Jane' },
|
|
45
|
+
tags: [...user.value.tags],
|
|
46
|
+
}; // replace the whole outer value
|
|
47
|
+
|
|
48
|
+
user.draft.profile.name = 'Jane'; // deep write
|
|
49
|
+
user.draft.tags.push('active'); // array / map / set / custom-object style mutation
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
Rules:
|
|
53
|
+
|
|
54
|
+
- Read with `.value`.
|
|
55
|
+
- Replace the whole outer value with `.value = nextValue`.
|
|
56
|
+
- Use `.draft` for deep mutations on nested objects, arrays, `Map` / `Set`, or other mutable instances.
|
|
57
|
+
- Do not assign to `.draft` itself; mutate inside it.
|
|
58
|
+
- `computed` stays read-only and is consumed through `.value`.
|
|
59
|
+
- `oldValue` in change listeners is the previous reference only, not a deep-cloned snapshot.
|
|
60
|
+
- Correctness is expected to come from the transformer and TypeScript checks; runtime hot paths stay minimal on purpose.
|
|
61
|
+
|
|
62
|
+
This is an explicit contract, closer to a Rust-style model than permissive runtime magic: unclear code should fail early.
|
|
63
|
+
|
|
32
64
|
## Quick Start
|
|
33
65
|
|
|
34
66
|
```bash
|