Procházet zdrojové kódy

refactor(component): simplify dynamic section rendering context

Update dynamic attribute validation to skip continuation parent check
during dynamic section rendering. This eliminates the need for separate
wrapper components to host spry-continuation attributes.

- Add is_rendering_dynamic parameter to transform_document method
- Consolidate ProgressDemo and ProgressDemoWithSSE into single component
- Update progress demo to use multiple dynamic sections
Billy Barrow před 6 dny
rodič
revize
c3644c5c57

+ 10 - 28
demo/DemoComponents/ProgressDemo.vala

@@ -18,18 +18,15 @@ public class ProgressDemo : Component {
     
     public override string markup { get {
         return """
-        <div sid="progress" class="demo-progress">
-            <div class="progress-header">
-                <h3>Task Progress</h3>
-                <span sid="status-text" class="progress-status"></span>
-            </div>
-            <div class="progress-bar-container">
+        <div sid="progress" spry-continuation class="demo-progress">
+            <div spry-dynamic="progress-bar" class="progress-bar-container">
                 <div sid="progress-bar" class="progress-bar"
                      style-width-expr='format("%i%%", this.percent)'>
                 </div>
             </div>
-            <div class="progress-info">
-                <span sid="percent-text" class="progress-percent"></span>
+            <div spry-dynamic="status" class="progress-info">
+                <span sid="percent-text" class="progress-percent" spry-unique content-expr='format("%i%%", this.percent)'>0%</span>
+                <span sid="status-text" class="progress-status" spry-unique content-expr="this.status">Ready</span>
             </div>
             <div class="progress-controls">
                 <button sid="start-btn" spry-action=":Start" spry-target="progress"
@@ -86,8 +83,9 @@ public class ProgressDemo : Component {
                 status = @"Almost done... $i%";
             }
             
-            // Send updates via SSE
-            yield ctx.send_dynamic("progress");
+            // Send updates via SSE to the dynamic sections
+            yield ctx.send_dynamic("progress-bar");
+            yield ctx.send_dynamic("status");
             
             // Simulate work
             Timeout.add(200, () => {
@@ -101,23 +99,7 @@ public class ProgressDemo : Component {
         status = "Complete!";
         is_running = false;
         
-        yield ctx.send_dynamic("progress");
+        yield ctx.send_dynamic("progress-bar");
+        yield ctx.send_dynamic("status");
     }
 }
-
-/**
- * ProgressDemoWithSSE - Progress demo with SSE wrapper
- * 
- * This version includes the spry-continuation attribute wrapper
- * for demonstrating SSE in the documentation.
- */
-public class ProgressDemoWithSSE : Component {
-    
-    public override string markup { get {
-        return """
-        <div sid="wrapper" spry-continuation>
-            <spry-component name="ProgressDemo" sid="progress-demo" spry-dynamic="progress"/>
-        </div>
-        """;
-    }}
-}

+ 0 - 1
demo/Main.vala

@@ -39,7 +39,6 @@ void main(string[] args) {
         application.add_transient<TodoListDemo>();
         application.add_transient<TodoItemDemo>();
         application.add_transient<ProgressDemo>();
-        application.add_transient<ProgressDemoWithSSE>();
         
         // Register page components
         application.add_transient<HomePage>();

+ 1 - 1
demo/Pages/ComponentsContinuationsPage.vala

@@ -260,7 +260,7 @@ public class ComponentsContinuationsPage : PageComponent {
         
         // Set up the demo host
         var demo = get_component_child<DemoHostComponent>("progress-demo");
-        demo.demo_component_name = "ProgressDemoWithSSE";
+        demo.demo_component_name = "ProgressDemo";
         demo.source_file = "demo/DemoComponents/ProgressDemo.vala";
     }
 }

+ 5 - 11
src/Component.vala

@@ -168,7 +168,7 @@ namespace Spry {
             final_instance.body.inner_html = template_fragment;
 
             // Do regular transform
-            yield transform_document(final_instance);
+            yield transform_document(final_instance, true);
             return final_instance;
         }
 
@@ -220,7 +220,7 @@ namespace Spry {
             return component;
         }
 
-        private async void transform_document(MarkupDocument doc) throws Error {
+        private async void transform_document(MarkupDocument doc, bool is_rendering_dynamic = false) throws Error {
             transform_unique_attributes(doc); // Done first so as to ensure the tracking numbers don't change
             transform_if_attributes(doc); // Outputs spry-hidden attributes
             remove_hidden_blocks(doc); // Removes tags with spry-hidden attributes
@@ -233,7 +233,7 @@ namespace Spry {
             transform_target_nodes(doc);
             transform_global_nodes(doc);
             transform_resource_nodes(doc);
-            transform_dynamic_attributes(doc);
+            transform_dynamic_attributes(doc, is_rendering_dynamic);
             transform_continuation_nodes(doc);
             remove_internal_sids(doc);
             yield append_globals(doc);
@@ -369,18 +369,12 @@ namespace Spry {
             }
         }
 
-        private void transform_dynamic_attributes(MarkupDocument doc) throws Error {
+        private void transform_dynamic_attributes(MarkupDocument doc, bool is_rendering_dynamic) throws Error {
             var nodes = doc.select("//*[@spry-dynamic]");
             foreach (var node in nodes) {
                 var name = node.get_attribute("spry-dynamic");
                 
-                MarkupNode parent = node;
-                while((parent = parent.parent) != null) {
-                    if(parent.has_attribute("spry-continuation")) {
-                        break;
-                    }
-                }
-                if(parent == null) {
+                if(!is_rendering_dynamic && !has_any_parent_where(node, n => n.has_attribute("spry-continuation"))) {
                     throw new ComponentError.INVALID_TEMPLATE("A tag with a spry-dynamic attribute must be the child of a tag with a spry-continuation attribute");
                 }