deploy: fd67d0e4c7

docs/references/elements/Display.md

@@ -1,11 +1,5 @@
 # Display
-_A specialized element that provides direct access to ComputerCraft's Window API. _
-_It acts as a canvas where you can use standard CC terminal operations, making it ideal for:_
-_- Integration with existing CC programs and APIs_
-_- Custom drawing operations_
-_- Terminal emulation_
-_- Complex text manipulation_
-_The Display maintains its own terminal buffer and can be manipulated using familiar CC terminal methods._
+_A specialized element that provides direct access to ComputerCraft's Window API. It acts as a canvas where you can use standard CC terminal operations._
 
 Extends: `VisualElement`
 

docs/references/elements/Program.md

@@ -3,6 +3,62 @@ _This is the program class. It provides a program that runs in a window._
 
 Extends: `VisualElement`
 
+## Examples (Executable)
+```lua run
+local basalt = require("basalt")
+
+local main = basalt.getMainFrame()
+
+local execPath = "rom/programs/fun/worm.lua"
+
+local btn = main:addButton({
+x = 5,
+y = 2,
+width = 20,
+height = 3,
+text = "Run Worm",
+}):onClick(function()
+local frame = main:addFrame({
+x = 2,
+y = 2,
+width = 28,
+height = 10,
+title = "Worm Program",
+draggable = true,
+})
+:setDraggingMap({{x=1, y=1, width=27, height=1}})
+:onFocus(function(self)
+self:prioritize()
+end)
+local program = frame:addProgram({
+x = 1,
+y = 2,
+width = 28,
+height = 9,
+})
+program:execute(execPath)
+frame:addLabel({
+x = 2,
+y = 1,
+text = "Worm",
+foreground = colors.lightBlue
+})
+frame:addButton({
+x = frame.get("width"),
+y = 1,
+width = 1,
+height = 1,
+text = "X",
+background = colors.red,
+foreground = colors.white
+}):onClick(function()
+frame:destroy()
+end)
+end)
+
+basalt.run()
+```
+
 ## Properties
 
 |Property|Type|Default|Description|

docs/references/elements/SideNav.md

@@ -3,6 +3,102 @@ _The SideNav is a container that provides sidebar navigation functionality_
 
 Extends: `Container`
 
+## Examples (Executable)
+```lua run
+local basalt = require("basalt")
+local main = basalt.getMainFrame()
+
+-- Create a simple SideNav
+local sideNav = main:addSideNav({
+x = 1,
+y = 1,
+sidebarWidth = 12,
+width = 48
+})
+
+-- Tab 1: Home
+local homeTab = sideNav:newTab("Home")
+
+homeTab:addLabel({
+x = 2,
+y = 2,
+text = "Welcome!",
+foreground = colors.yellow
+})
+
+homeTab:addLabel({
+x = 2,
+y = 4,
+text = "This is a simple",
+foreground = colors.white
+})
+
+homeTab:addLabel({
+x = 2,
+y = 5,
+text = "SideNav example.",
+foreground = colors.white
+})
+
+-- Tab 2: Counter
+local counterTab = sideNav:newTab("Counter")
+
+local counterLabel = counterTab:addLabel({
+x = 2,
+y = 2,
+text = "Count: 0",
+foreground = colors.lime
+})
+
+local count = 0
+counterTab:addButton({
+x = 2,
+y = 4,
+width = 12,
+height = 3,
+text = "Click Me",
+background = colors.blue
+})
+:setBackgroundState("clicked", colors.lightBlue)
+:onClick(function()
+count = count + 1
+counterLabel:setText("Count: " .. count)
+end)
+
+-- Tab 3: Info
+local infoTab = sideNav:newTab("Info")
+
+infoTab:addLabel({
+x = 2,
+y = 2,
+text = "SideNav Features:",
+foreground = colors.orange
+})
+
+infoTab:addLabel({
+x = 2,
+y = 4,
+text = "- Multiple tabs",
+foreground = colors.gray
+})
+
+infoTab:addLabel({
+x = 2,
+y = 5,
+text = "- Easy navigation",
+foreground = colors.gray
+})
+
+infoTab:addLabel({
+x = 2,
+y = 6,
+text = "- Content per tab",
+foreground = colors.gray
+})
+
+basalt.run()
+```
+
 ## Properties
 
 |Property|Type|Default|Description|

docs/references/elements/TabControl.md

@@ -1,5 +1,96 @@
 # TabControl
-_The TabControl is a container that provides tabbed interface functionality_
+_local main = basalt.getMainFrame()_
+
+_-- Create a simple TabControl_
+_local tabControl = main:addTabControl({_
+_x = 2,_
+_y = 2,_
+_width = 46,_
+_height = 15,_
+_})_
+
+_-- Tab 1: Home_
+_local homeTab = tabControl:newTab("Home")_
+
+_homeTab:addLabel({_
+_x = 2,_
+_y = 2,_
+_text = "Welcome!",_
+_foreground = colors.yellow_
+_})_
+
+_homeTab:addLabel({_
+_x = 2,_
+_y = 4,_
+_text = "This is a TabControl",_
+_foreground = colors.white_
+_})_
+
+_homeTab:addLabel({_
+_x = 2,_
+_y = 5,_
+_text = "example with tabs.",_
+_foreground = colors.white_
+_})_
+
+_-- Tab 2: Counter_
+_local counterTab = tabControl:newTab("Counter")_
+
+_local counterLabel = counterTab:addLabel({_
+_x = 2,_
+_y = 2,_
+_text = "Count: 0",_
+_foreground = colors.lime_
+_})_
+
+_local count = 0_
+_counterTab:addButton({_
+_x = 2,_
+_y = 4,_
+_width = 12,_
+_height = 3,_
+_text = "Click Me",_
+_background = colors.blue_
+_})_
+_:setBackgroundState("clicked", colors.lightBlue)_
+_:onClick(function()_
+_count = count + 1_
+_counterLabel:setText("Count: " .. count)_
+_end)_
+
+_-- Tab 3: Info_
+_local infoTab = tabControl:newTab("Info")_
+
+_infoTab:addLabel({_
+_x = 2,_
+_y = 2,_
+_text = "TabControl Features:",_
+_foreground = colors.orange_
+_})_
+
+_infoTab:addLabel({_
+_x = 2,_
+_y = 4,_
+_text = "- Horizontal tabs",_
+_foreground = colors.gray_
+_})_
+
+_infoTab:addLabel({_
+_x = 2,_
+_y = 5,_
+_text = "- Easy navigation",_
+_foreground = colors.gray_
+_})_
+
+_infoTab:addLabel({_
+_x = 2,_
+_y = 6,_
+_text = "- Content per tab",_
+_foreground = colors.gray_
+_})_
+
+_basalt.run()_
+_]]_
 
 Extends: `Container`
 

docs/references/elements/Tree.md

@@ -5,7 +5,7 @@ Extends: `VisualElement`
 
 ## Examples (Executable)
 ```lua run
-local basaltg = require("basalt")
+local basalt = require("basalt")
 local main = basalt.getMainFrame()
 
 local fileTree = main:addTree()