feat(lang): UI components as files - component Name { ... } beside Name.xml and Name.lss
The compiler turns a component declaration into: - a record of its props and state; - a constructor, a props setter, a model and a call; - a class, registered with ludic.ui at start. Its template and styles are read from beside it and compiled in, with @import inlined, and a missing template fails the build. In the runtime: - each mounted instance keeps its own props and state, and `set` in a template writes the state; - styles are scoped to the component; - class, style and id on a component's tag land on its root, styled by the parent's sheet too; - ui_reload re-reads a component's files from disk and keeps instances. The package's own module is now ludic_ui, so a program may call a directory of its own ui. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
parent
637d07400e
commit
20d011f8e9
40 changed files with 62224 additions and 49996 deletions
|
|
@ -18,7 +18,9 @@ function cs_tree(n: UiNode) -> void {
|
|||
function cs_node(n: UiNode) -> void {
|
||||
cs_sheet(n, ua_sheet())
|
||||
if n.sheet != null { cs_sheet(n, n.sheet) }
|
||||
if n.sheet2 != null and n.sheet2 != n.sheet { cs_sheet(n, n.sheet2) }
|
||||
if n.style != null { cs_rule(n, n.style) }
|
||||
if n.style2 != null { cs_rule_in(n, n.style2, n.env2) }
|
||||
for i in 0 .. len(n.akeys) { el_apply(n, n.akeys[i], n.vals[i]) }
|
||||
}
|
||||
function cs_sheet(n: UiNode, sh: UiSheet) -> void {
|
||||
|
|
@ -27,13 +29,14 @@ function cs_sheet(n: UiNode, sh: UiSheet) -> void {
|
|||
if md_ok(r) and sel_match(r.sel, n) { cs_rule(n, r) }
|
||||
}
|
||||
}
|
||||
# a rule's custom properties first, so its other declarations can read them
|
||||
function cs_rule(n: UiNode, r: UiRule) -> void {
|
||||
function cs_rule(n: UiNode, r: UiRule) -> void { cs_rule_in(n, r, n.env) }
|
||||
# a rule's custom properties first, so its other declarations can read them; values read in `e`
|
||||
function cs_rule_in(n: UiNode, r: UiRule, e: UiEnv) -> void {
|
||||
for j in 0 .. len(r.keys) {
|
||||
if len(r.keys[j]) > 2 and r.keys[j][0..2] == "--" { el_attr(n, r.keys[j], ui_eval(r.vals[j], n.env)) }
|
||||
if len(r.keys[j]) > 2 and r.keys[j][0..2] == "--" { el_attr(n, r.keys[j], ui_eval(r.vals[j], e)) }
|
||||
}
|
||||
for j in 0 .. len(r.keys) {
|
||||
if not (len(r.keys[j]) > 2 and r.keys[j][0..2] == "--") { el_attr(n, r.keys[j], ui_eval(r.vals[j], n.env)) }
|
||||
if not (len(r.keys[j]) > 2 and r.keys[j][0..2] == "--") { el_attr(n, r.keys[j], ui_eval(r.vals[j], e)) }
|
||||
}
|
||||
}
|
||||
# what every element looks like before anyone styles it, as a browser's own sheet does
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue