feat: make state-based attributes reactive
This commit is contained in:
+12
-1
@@ -138,14 +138,25 @@ Bun.serve({
|
||||
Browser side — server-rendered HTML that the reactive runtime hydrates:
|
||||
|
||||
```html
|
||||
<div data-scope="count: 0">
|
||||
<div data-scope="count: 0, showPassword: false">
|
||||
<button data-on-click="count++">+1</button>
|
||||
<span data-text="count"></span>
|
||||
<p>Total: {{count}}</p>
|
||||
<input type="{showPassword ? 'text' : 'password'}" />
|
||||
<button
|
||||
data-on-click="showPassword = !showPassword"
|
||||
aria-label="{showPassword ? 'Hide password' : 'Show password'}"
|
||||
>
|
||||
Toggle password
|
||||
</button>
|
||||
</div>
|
||||
<script src="/__wrnexus/reactive.js"></script>
|
||||
```
|
||||
|
||||
State interpolation in ordinary attributes is reactive. The compiler keeps the
|
||||
initial SSR value and emits an internal binding so attributes such as `type`,
|
||||
`aria-label`, `aria-pressed`, `class`, and `href` update after state changes.
|
||||
|
||||
A realtime chat, fully declarative:
|
||||
|
||||
```html
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@wrnexus/csr",
|
||||
"version": "0.2.24",
|
||||
"version": "0.2.25",
|
||||
"type": "module",
|
||||
"description": "@wrnexus/csr — part of the WrNexus framework.",
|
||||
"license": "MIT",
|
||||
@@ -21,7 +21,7 @@
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@wrnexus/core": "^0.2.24"
|
||||
"@wrnexus/core": "^0.2.25"
|
||||
},
|
||||
"files": [
|
||||
"dist"
|
||||
|
||||
Reference in New Issue
Block a user