FLARP

DOM-native XML State Management

Two-Way Binding

Form inputs bound to XML state
Alice alice@example.com Developer true
Live XML:

            
Reactive display

These update automatically:

Name
Role
Email
Status
-

โ†ป Refresh the page - state persists!

Todo App with Actions

CRUD with event sourcing
00
Total
0
Done
0
Remaining
0

Counter with Signals

state.on() / state.emit() pattern
01-1010
0
The pattern
// Register actions
store.on('increment', ({ step }) => {
  const val = store.at('counter.value');
  const max = store.at('counter.max');
  val.value = Math.min(+val.value + step, +max.value);
});

// Dispatch
store.emit('increment', { step: 1 });

// Wait for ready (signal-based!)
store.state.when('ready', () => {
  // Safe to access state
});

Dynamic Lists

Per-node reactivity
Widget Pro29.99150 Gadget Plus49.9975
Add Product

Live XML Editor

Edit raw XML
My Document Jane Doe Hello World
Source
Preview

Conditionals

f-when and f-match
dark true admin 5
Reactive output

Theme: โ˜€๏ธ Light Mode ๐ŸŒ™ Dark Mode ๐Ÿ”„ Auto Mode Unknown

โœ“ Welcome back! (Administrator) (User) (Guest)

Please log in to continue.

๐Ÿ”” You have notifications

No new notifications