Bind writable signals to form fields in rikka-dom for automatic synchronization.
npx skills add https://github.com/yw662/rikka --skill form-binding
Please help me install this Agent Skill. Skill: form-binding Source: https://github.com/yw662/rikka/tree/main/skills/form-binding Command: npx skills add https://github.com/yw662/rikka --skill form-binding
This Skill removes the manual wiring needed to keep form inputs and application state in sync, so user edits update your data model automatically and programmatic state changes update the UI.
value for live, two-way updates as users type.checked and selectedIndex with the correct DOM event semantics.Bind a writable signal to an input, textarea, checkbox, or select in rikka-dom so the field and signal stay synchronized automatically.
High-intent search queries and answers about installing and using this skill.
Two-way form binding syncs writable signals to form fields automatically, so user input updates your data model and programmatic state changes reflect in the UI. This removes manual event wiring for text inputs, textareas, checkboxes, and selects.
Two-way binding for checkboxes and selects maps writable signals to the checked and selectedIndex properties respectively, using correct DOM input and change event semantics. This ensures application state stays synchronized with user selections without manual listeners.
Yes, you can combine form signal state with computed values to drive inline validation, disabled buttons, and live feedback. Signal state updates immediately as users type or toggle, keeping reactive display logic continuously synced with input fields.
The best way to bind a textarea is connecting a writable signal directly to its value property for live two-way updates. This ensures typing inside the textarea instantly updates shared reactive state and any dependent computed values.
No, manual event listeners are not needed for text input value binding. The form binding mechanism wires writable signals to input fields directly, handling input and change event semantics internally to keep user edits and application state synchronized automatically.
Select elements require binding to selectedIndex rather than value, using correct change event semantics. If the writable signal is not properly mapped to selectedIndex, programmatic state changes will fail to update the select element UI synchronously.
yw662Bind reactive signal values into DOM text, attributes, and template slots.
ihj04982Subscribes to derived boolean states to reduce UI component re-renders.
yw662Define and manage reactive state with rikka signals, computed values, and effects.
TumeloRamaphosaWire Rive state machine inputs and ViewModel properties to React components.