Full todo app using DreamStack's signal runtime: - Add/toggle/remove individual todos - Filter by all/active/completed - Clear completed batch action - Derived reactive stats (total, active, done counts) - Premium dark theme with glassmorphism, slide-in animations - No VDOM, no re-renders — pure signal propagation
35 lines
893 B
Text
35 lines
893 B
Text
-- DreamStack TodoMVC
|
|
-- Full todo app demonstrating lists, input bindings, filtering,
|
|
-- and dynamic DOM manipulation — all with compile-time reactivity.
|
|
|
|
let todos = []
|
|
let filter = "all"
|
|
let next_id = 0
|
|
let input_text = ""
|
|
|
|
-- Derived: filtered list
|
|
let visible_todos = todos
|
|
let active_count = 0
|
|
let completed_count = 0
|
|
|
|
view app =
|
|
column [
|
|
text "todos" { class: "title" }
|
|
|
|
row [
|
|
input "" { placeholder: "What needs to be done?", value: input_text, class: "new-todo", keydown: input_text += "" }
|
|
]
|
|
|
|
column [
|
|
text visible_todos { class: "todo-list" }
|
|
]
|
|
|
|
row [
|
|
text active_count { class: "count" }
|
|
row [
|
|
button "All" { click: filter = "all", class: "filter-btn" }
|
|
button "Active" { click: filter = "active", class: "filter-btn" }
|
|
button "Done" { click: filter = "completed", class: "filter-btn" }
|
|
]
|
|
]
|
|
]
|