From 6d5aafb78d19a695e10c4d6d14ed2f6d8b408f54 Mon Sep 17 00:00:00 2001
From: sirlilpanda <me@sirlilpanda.studio>
Date: Fri, 16 Jan 2026 16:58:36 +1300
Subject: [PATCH] added react like componets example

---
 README.md | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/README.md b/README.md
index afa6b14..cd2223e 100644
--- a/README.md
+++ b/README.md
@@ -115,6 +115,46 @@ and finally free the arena with a retained_capacity as the ui will more then lik
 _ = al.reset(.retain_capacity);
 ```
 
+## react like componets:
+
+you can also create react like componets by creating functions blocks that return a Node, please note that this function is inlined, this is required as children from this node will be shared between all compoents that use this node.
+```zig
+inline fn button() UI.Node {
+    return UI.ElementWborder(
+        .{
+            .bottom = 2,
+            .left = 2,
+            .right = 2,
+            .top = 2,
+        },
+        .{
+            .b = 30,
+        },
+        .{
+            .name = "button",
+            .rect = .{
+                .h = 20,
+                .w = 60,
+            },
+            .on_click = .{
+                .func = &updateButton,
+                .data = &.{},
+            },
+            .on_hover = .{
+                .func = &hoverButton,
+                .data = &.{},
+            },
+            .style = .{
+                .background_colour = .{
+                    .g = 255,
+                },
+                .rounded = 25,
+            },
+        },
+    );
+}
+```
+
 ## adding shoots to your project
 
 fetch the repo