-
-
{ name }
- @renderComponents(def.Components)
+
+
+
+
+ for _, component := range def.Components {
+ for typ, props := range component {
+ @renderComponent(typ, props.(map[string]interface{}))
+ }
+ }
+
+
+
+
}
}
-templ renderComponents(components map[string]interface{}) {
- for key, component := range components {
- switch c := component.(type) {
- case map[string]interface{}:
- @renderComponent(key, c)
- }
- }
-}
-
templ renderComponent(typ string, props map[string]interface{}) {
switch typ {
case "button":
@@ -181,7 +214,9 @@ templ renderComponent(typ string, props map[string]interface{}) {
case string:
{ i }
case map[string]interface{}:
- @renderComponents(i)
+ for typ, props := range i {
+ @renderComponent(typ, props.(map[string]interface{}))
+ }
}
}
@@ -196,7 +231,9 @@ templ renderComponent(typ string, props map[string]interface{}) {
case string:
{ i }
case map[string]interface{}:
- @renderComponents(i)
+ for typ, props := range i {
+ @renderComponent(typ, props.(map[string]interface{}))
+ }
}
}
@@ -215,10 +252,20 @@ templ renderComponent(typ string, props map[string]interface{}) {
if components, ok := props["components"].([]interface{}); ok {
for _, comp := range components {
if c, ok := comp.(map[string]interface{}); ok {
- @renderComponents(c)
+ for typ, props := range c {
+ @renderComponent(typ, props.(map[string]interface{}))
+ }
}
}
}
}
+}
+
+func yamlString(def UIDefinition) string {
+ yamlBytes, err := yaml.Marshal(def)
+ if err != nil {
+ return fmt.Sprintf("Error marshaling YAML: %v", err)
+ }
+ return string(yamlBytes)
}
\ No newline at end of file
diff --git a/ttmp/2025-02-21/changelog.md b/ttmp/2025-02-21/changelog.md
new file mode 100644
index 0000000..bfc5e00
--- /dev/null
+++ b/ttmp/2025-02-21/changelog.md
@@ -0,0 +1,15 @@
+UI DSL Documentation
+
+Added comprehensive documentation for the UI DSL system in pkg/doc/topics/05-ui-dsl.md. The documentation includes:
+- Complete schema description
+- Component reference
+- Examples and best practices
+- Styling and JavaScript integration details
+- Validation rules and limitations
+
+UI DSL YAML Display
+
+Enhanced the UI server to display the YAML source of each page alongside its rendered output:
+- Added syntax highlighting using highlight.js
+- Split view with rendered UI and YAML source side by side
+- Improved visual presentation with Bootstrap cards
\ No newline at end of file