diff --git a/docs/references/elementManager.md b/docs/references/elementManager.md
index 5128288..778def2 100644
--- a/docs/references/elementManager.md
+++ b/docs/references/elementManager.md
@@ -1,30 +1,27 @@
 # ElementManager
-_This class manages elements and plugins. It loads elements and plugins from the elements and plugins directories
-and then applies the plugins to the elements. It also provides a way to get elements and APIs._
+This class manages elements and plugins. It loads elements and plugins from the elements and plugins directories
+and then applies the plugins to the elements. It also provides a way to get elements and APIs.
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[ElementManager.loadElement](#elementmanager-loadelement-name)|-|Loads an element by name. This will load the element and apply any plugins to it.|
-|[ElementManager.getElement](#elementmanager-getelement-name)|table|Gets an element by name. If the element is not loaded, it will try to load it first.|
-|[ElementManager.getElementList](#elementmanager-getelementlist)|table|Gets a list of all elements|
-|[ElementManager.getAPI](#elementmanager-getapi-name)|table|Gets an Plugin API by name|
+|[ElementManager.getAPI](#elementmanager-getapi)|table|
+|[ElementManager.getElement](#elementmanager-getelement)|table|
+|[ElementManager.getElementList](#elementmanager-getelementlist)|table|
+|[ElementManager.loadElement](#elementmanager-loadelement)|-|
 
-## ElementManager.loadElement(name)
 
-Loads an element by name. This will load the element and apply any plugins to it.
+## ElementManager.getAPI(name)
+Gets an Plugin API by name
 
 ### Parameters
-* `name` `string` The name of the element to load
+* `name` `string` The name of the API to get
 
-### Usage
-```lua
-ElementManager.loadElement("Button")
-```
+### Returns
+* `table` `API` The API
 
 ## ElementManager.getElement(name)
-
 Gets an element by name. If the element is not loaded, it will try to load it first.
 
 ### Parameters
@@ -34,18 +31,20 @@ Gets an element by name. If the element is not loaded, it will try to load it fi
 * `table` `Element` The element class
 
 ## ElementManager.getElementList()
-
 Gets a list of all elements
 
 ### Returns
 * `table` `ElementList` A list of all elements
 
-## ElementManager.getAPI(name)
-
-Gets an Plugin API by name
+## ElementManager.loadElement(name)
+Loads an element by name. This will load the element and apply any plugins to it.
 
 ### Parameters
-* `name` `string` The name of the API to get
+* `name` `string` The name of the element to load
+
+### Usage
+ ```lua
+ElementManager.loadElement("Button")
+```
+
 
-### Returns
-* `table` `API` The API
diff --git a/docs/references/elements/BarChart.md b/docs/references/elements/BarChart.md
index 83df9c3..dc32974 100644
--- a/docs/references/elements/BarChart.md
+++ b/docs/references/elements/BarChart.md
@@ -1,29 +1,28 @@
-# BarChart
-_The Bar Chart element is designed for visualizing data series as vertical bars. It displays multiple values as side-by-side bars where each bar's height represents its value._
+# BarChart : Graph
+The Bar Chart element is designed for visualizing data series as vertical bars. It displays multiple values as side-by-side bars where each bar's height represents its value.
 
-Extends: `Graph`
+### Usage
+ ```lua
+local chart = main:addBarChart()
+:addSeries("input", " ", colors.green, colors.green, 5)
+:addSeries("output", " ", colors.red, colors.red, 5)
 
-## Functions
+basalt.schedule(function()
+while true do
+chart:addPoint("input", math.random(1,100))
+chart:addPoint("output", math.random(1,100))
+sleep(2)
+end
+end)
+```
+
+
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BarChart.new](#barchart-new)|BarChart|Creates a new BarChart instance|
-|[BarChart:BarChart](#barchart-barchart-props-basalt)|BarChart|Initializes the BarChart instance|
-|[BarChart:BarChart](#barchart-barchart)|-|Renders the BarChart|
+|BarChart:init|BarChart|Initializes the BarChart instance
+|BarChart:render|-|Renders the BarChart
 
-## BarChart.new()
 
-Creates a new BarChart instance
-
-### Returns
-* `BarChart` `self` The newly created BarChart instance
-
-## BarChart:BarChart(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `BarChart` `self` The initialized instance
-
-## BarChart:BarChart()
\ No newline at end of file
diff --git a/docs/references/elements/BaseElement.md b/docs/references/elements/BaseElement.md
index bf876e4..bd67a0c 100644
--- a/docs/references/elements/BaseElement.md
+++ b/docs/references/elements/BaseElement.md
@@ -1,40 +1,41 @@
-# BaseElement
-_The base class for all UI elements in Basalt. This class provides basic properties and event handling functionality._
-
-Extends: `PropertySystem`
+# BaseElement : PropertySystem
+The base class for all UI elements in Basalt. This class provides basic properties and event handling functionality.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|type|string|BaseElement|The type identifier of the element|
-|id|string|BaseElement|The unique identifier for the element|
-|name|string|BaseElement|The name of the element|
-|eventCallbacks|table|BaseElement|The event callbacks for the element|
-|enabled|boolean|BaseElement|Whether the element is enabled or not|
+|type|string|BaseElement|The type identifier of the element
+|id|string|BaseElement|The unique identifier for the element
+|name|string|BaseElement|The name of the element
+|eventCallbacks|table|BaseElement|The event callbacks for the element
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseElement.defineEvent](#baseelement-defineevent-class-eventname-requiredevent)|-|Registers a new event listener for the element (on class level)|
-|[BaseElement.registerEventCallback](#baseelement-registereventcallback-class-callbackname-string)|-|Registers a new event callback for the element (on class level)|
-|[BaseElement.new](#baseelement-new)|table|Creates a new BaseElement instance|
-|[BaseElement:BaseElement](#baseelement-baseelement-props-basalt)|table|Initializes the BaseElement instance|
-|[BaseElement:BaseElement](#baseelement-baseelement)|table|Post initialization|
-|[BaseElement:BaseElement](#baseelement-baseelement-type)|boolean|Checks if the element is a specific type|
-|[BaseElement:BaseElement](#baseelement-baseelement-eventname-enable)|table|Enables or disables event listening for a specific event|
-|[BaseElement:BaseElement](#baseelement-baseelement-event-callback)|table|Registers a callback function|
-|[BaseElement:BaseElement](#baseelement-baseelement-event-any)|table|Triggers an event and calls all registered callbacks|
-|[BaseElement:BaseElement](#baseelement-baseelement-event)|handled|Handles all events|
-|[BaseElement:BaseElement](#baseelement-baseelement-event)|handled|The default event handler for all events|
-|[BaseElement:BaseElement](#baseelement-baseelement-property-callback)|table|Observes a property and calls a callback when it changes|
-|[BaseElement:BaseElement](#baseelement-baseelement)|BaseFrame|Returns the base frame of the element|
-|[BaseElement:BaseElement](#baseelement-baseelement)|-|Destroys the element and cleans up all references|
-|[BaseElement:BaseElement](#baseelement-baseelement)|table|Requests a render update for this element|
+|[BaseElement.defineEvent](#baseelement-defineevent)|-|Registers a new event listener for the element (on class level)
+|[BaseElement.registerEventCallback](#baseelement-registereventcallback)|-|Registers a new event callback for the element (on class level)
+|[BaseElement:destroy](#baseelement-destroy)|-|Destroys the element and cleans up all references
+|[BaseElement:fireEvent](#baseelement-fireevent)|table|Triggers an event and calls all registered callbacks
+|[BaseElement:getBaseFrame](#baseelement-getbaseframe)|BaseFrame|Returns the base frame of the element
+|[BaseElement:isType](#baseelement-istype)|boolean|Checks if the element is a specific type
+|[BaseElement:listenEvent](#baseelement-listenevent)|table|Enables or disables event listening for a specific event
+|[BaseElement:onChange](#baseelement-onchange)|table|Observes a property and calls a callback when it changes
+|[BaseElement:registerCallback](#baseelement-registercallback)|table|Registers a callback function
+|[BaseElement:updateRender](#baseelement-updaterender)|table|Requests a render update for this element
+
+
+## Protected Functions
+
+|Method|Returns|Description|
+|---|---|---|
+|BaseElement:dispatchEvent|boolean?|Handles all events
+|BaseElement:handleEvent|boolean?|The default event handler for all events
+|BaseElement:init|table|Initializes the BaseElement instance
+|BaseElement:postInit|table|Post initialization
 
 ## BaseElement.defineEvent(class, eventName, requiredEvent?)
-
 Registers a new event listener for the element (on class level)
 
 ### Parameters
@@ -42,33 +43,34 @@ Registers a new event listener for the element (on class level)
 * `eventName` `string` The name of the event to register
 * `requiredEvent` *(optional)* `string` The name of the required event (optional)
 
-## BaseElement.registerEventCallback(class, callbackName, string)
-
+## BaseElement.registerEventCallback(class, callbackName, ...)
 Registers a new event callback for the element (on class level)
 
 ### Parameters
 * `class` `table` The class to register
 * `callbackName` `string` The name of the callback to register
-* `string` `The` names of the events to register the callback for
+* `...` `string` The names of the events to register the callback for
 
-## BaseElement.new()
-### Returns
-* `table` `The` newly created BaseElement instance
+## BaseElement:destroy()
+Destroys the element and cleans up all references
+
+## BaseElement:fireEvent(event, ...)
+Triggers an event and calls all registered callbacks
 
-## BaseElement:BaseElement(props, basalt)
 ### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+* `event` `string` The event to fire
+* `...` `any` Additional arguments to pass to the callbacks
 
-### Returns
-* `table` `self` The initialized instance
-
-## BaseElement:BaseElement()
 ### Returns
 * `table` `self` The BaseElement instance
 
-## BaseElement:BaseElement(type)
+## BaseElement:getBaseFrame()
+Returns the base frame of the element
 
+### Returns
+* `BaseFrame` `BaseFrame` The base frame of the element
+
+## BaseElement:isType(type)
 Checks if the element is a specific type
 
 ### Parameters
@@ -77,8 +79,7 @@ Checks if the element is a specific type
 ### Returns
 * `boolean` `isType` Whether the element is of the specified type
 
-## BaseElement:BaseElement(eventName, enable?)
-
+## BaseElement:listenEvent(eventName, enable?)
 Enables or disables event listening for a specific event
 
 ### Parameters
@@ -88,44 +89,7 @@ Enables or disables event listening for a specific event
 ### Returns
 * `table` `self` The BaseElement instance
 
-## BaseElement:BaseElement(event, callback)
-
-Registers a callback function for an event
-
-### Parameters
-* `event` `string` The event to register the callback for
-* `callback` `function` The callback function to register
-
-### Returns
-* `table` `self` The BaseElement instance
-
-## BaseElement:BaseElement(event, any)
-
-Triggers an event and calls all registered callbacks
-
-### Parameters
-* `event` `string` The event to fire
-* `any` `Additional` arguments to pass to the callbacks
-
-### Returns
-* `table` `self` The BaseElement instance
-
-## BaseElement:BaseElement(event)
-### Parameters
-* `event` `string` The event to handle
-
-### Returns
-* `handled` `Whether` the event was handled
-
-## BaseElement:BaseElement(event)
-### Parameters
-* `event` `string` The event to handle
-
-### Returns
-* `handled` `Whether` the event was handled
-
-## BaseElement:BaseElement(property, callback)
-
+## BaseElement:onChange(property, callback)
 Observes a property and calls a callback when it changes
 
 ### Parameters
@@ -135,20 +99,20 @@ Observes a property and calls a callback when it changes
 ### Returns
 * `table` `self` The BaseElement instance
 
-## BaseElement:BaseElement()
+## BaseElement:registerCallback(event, callback)
+Registers a callback function for an event
 
-Returns the base frame of the element
+### Parameters
+* `event` `string` The event to register the callback for
+* `callback` `function` The callback function to register
 
 ### Returns
-* `BaseFrame` `BaseFrame` The base frame of the element
-
-## BaseElement:BaseElement()
-
-Destroys the element and cleans up all references
-
-## BaseElement:BaseElement()
+* `table` `self` The BaseElement instance
 
+## BaseElement:updateRender()
 Requests a render update for this element
 
 ### Returns
 * `table` `self` The BaseElement instance
+
+
diff --git a/docs/references/elements/BaseFrame.md b/docs/references/elements/BaseFrame.md
index c38744a..b54e50e 100644
--- a/docs/references/elements/BaseFrame.md
+++ b/docs/references/elements/BaseFrame.md
@@ -1,96 +1,56 @@
-# BaseFrame
-_This is the base frame class. It is the root element of all elements and the only element without a parent._
+# BaseFrame : Container
+This is the base frame class. It is the root element of all elements and the only element without a parent.
 
-Extends: `Container`
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|_render|`Render`|The render object|
+|_renderUpdate|`boolean`|Whether the render object needs to be updated|
+|_peripheralName|`string`|The name of a peripheral|
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|term|term|peripheral|term.current()|The terminal or (monitor) peripheral object to render to|
+|term|term|peripheral|term.current()|The terminal or (monitor) peripheral object to render to
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseFrame.new](#baseframe-new)|BaseFrame|Creates a new Frame instance|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-props-basalt)|table|Initializes the Frame instance|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-width-height-text-fg-bg)|-|Renders a multiBlit to the render Object|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-text-fg)|-|Renders a text with a foreground color to the render Object|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-text-bg)|-|Renders a text with a background color to the render Object|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-text-bg)|-|Renders a text with a background color to the render Object|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-text-fg-bg)|-|Renders a text with a foreground and background color to the render Object|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-x-y-blink)|-|Sets the cursor position|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-name-x-y)|-|Handles monitor touch events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-button-x-y)|-|Handles mouse click events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-button-x-y)|-|Handles mouse up events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe)|-|Resizes the Frame|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-key)|-|Handles key events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-key)|-|Handles key up events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-char)|-|Handles character events|
-|[BaseFrame:BaseFrame](#baseframe-baseframe)|-|Renders the Frame|
+|[BaseFrame:dispatchEvent](#baseframe-dispatchevent)|-|
+|[BaseFrame:drawBg](#baseframe-drawbg)|-|
+|[BaseFrame:drawFg](#baseframe-drawfg)|-|
+|[BaseFrame:setCursor](#baseframe-setcursor)|-|Sets the cursor position
 
-## BaseFrame.new()
 
-Creates a new Frame instance
+## Protected Functions
 
-### Returns
-* `BaseFrame` `object` The newly created Frame instance
+|Method|Returns|Description|
+|---|---|---|
+|BaseFrame:blit|-|Renders a text with a foreground and background color to the render Object
+|BaseFrame:char|-|Handles character events
+|BaseFrame:drawText|-|Renders a text with a background color to the render Object
+|BaseFrame:init|table|Initializes the Frame instance
+|BaseFrame:key|-|Handles key events
+|BaseFrame:key_up|-|Handles key up events
+|BaseFrame:monitor_touch|-|Handles monitor touch events
+|BaseFrame:mouse_click|-|Handles mouse click events
+|BaseFrame:mouse_up|-|Handles mouse up events
+|BaseFrame:multiBlit|-|Renders a multiBlit to the render Object
+|BaseFrame:render|-|Renders the Frame
+|BaseFrame:term_resize|-|Resizes the Frame
+|BaseFrame:textBg|-|Renders a text with a background color to the render Object
+|BaseFrame:textFg|-|Renders a text with a foreground color to the render Object
 
-### Usage
-```lua
-local element = BaseFrame.new()
-```
+## BaseFrame:dispatchEvent()
 
-## BaseFrame:BaseFrame(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+## BaseFrame:drawBg()
 
-### Returns
-* `table` `self` The initialized instance
-
-## BaseFrame:BaseFrame(x, y, width, height, text, fg, bg)
-### Parameters
-* `x` `number` The x position to render to
-* `y` `number` The y position to render to
-* `width` `number` The width of the text
-* `height` `number` The height of the text
-* `text` `string` The text to render
-* `fg` `string` The foreground color
-* `bg` `string` The background color
-
-## BaseFrame:BaseFrame(x, y, text, fg)
-### Parameters
-* `x` `number` The x position to render to
-* `y` `number` The y position to render to
-* `text` `string` The text to render
-* `fg` `colors` The foreground color
-
-## BaseFrame:BaseFrame(x, y, text, bg)
-### Parameters
-* `x` `number` The x position to render to
-* `y` `number` The y position to render to
-* `text` `string` The text to render
-* `bg` `colors` The background color
-
-## BaseFrame:BaseFrame(x, y, text, bg)
-### Parameters
-* `x` `number` The x position to render to
-* `y` `number` The y position to render to
-* `text` `string` The text to render
-* `bg` `colors` The background color
-
-## BaseFrame:BaseFrame(x, y, text, fg, bg)
-### Parameters
-* `x` `number` The x position to render to
-* `y` `number` The y position to render to
-* `text` `string` The text to render
-* `fg` `string` The foreground color
-* `bg` `string` The background color
-
-## BaseFrame:BaseFrame(x, y, blink)
+## BaseFrame:drawFg()
 
+## BaseFrame:setCursor(x, y, blink)
 Sets the cursor position
 
 ### Parameters
@@ -98,35 +58,4 @@ Sets the cursor position
 * `y` `number` The y position to set the cursor to
 * `blink` `boolean` Whether the cursor should blink
 
-## BaseFrame:BaseFrame(name, x, y)
-### Parameters
-* `name` `string` The name of the monitor that was touched
-* `x` `number` The x position of the mouse
-* `y` `number` The y position of the mouse
 
-## BaseFrame:BaseFrame(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the mouse
-* `y` `number` The y position of the mouse
-
-## BaseFrame:BaseFrame(button, x, y)
-### Parameters
-* `button` `number` The button that was released
-* `x` `number` The x position of the mouse
-* `y` `number` The y position of the mouse
-
-## BaseFrame:BaseFrame()
-## BaseFrame:BaseFrame(key)
-### Parameters
-* `key` `number` The key that was pressed
-
-## BaseFrame:BaseFrame(key)
-### Parameters
-* `key` `number` The key that was released
-
-## BaseFrame:BaseFrame(char)
-### Parameters
-* `char` `string` The character that was pressed
-
-## BaseFrame:BaseFrame()
\ No newline at end of file
diff --git a/docs/references/elements/BigFont.md b/docs/references/elements/BigFont.md
index 922e494..b3d8deb 100644
--- a/docs/references/elements/BigFont.md
+++ b/docs/references/elements/BigFont.md
@@ -1,34 +1,26 @@
-# BigFontText
-_Basalt - Nyorie: Please don't copy paste this code to your projects, this code is slightly changed (to fit the way basalt draws elements), if you want the original code, checkout this:
-http://www.computercraft.info/forums2/index.php?/topic/25367-bigfont-api-write-bigger-letters-v10/_
+# BigFont : VisualElement
+The BigFont element is a text element that displays larger text. It uses Wojbie's BigFont API to render the text in a larger font size. Credits to Wojbie for the original API.
 
-# BigFont
-_The BigFont element is a text element that displays larger text. It uses Wojbie's BigFont API to render the text in a larger font size. Credits to Wojbie for the original API._
+### Usage
+ ```lua
+local font = main:addBigFont()
+font:setText("Hello World!")
+```
 
-Extends: `VisualElement`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|text|string|BigFont|BigFont text|
-|fontSize|number|1|The font size of the BigFont|
+|text|string|BigFont|BigFont text
+|fontSize|number|1|The font size of the BigFont
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BigFont.new](#bigfont-new)|table|Creates a new BigFont instance|
-|[BigFont:BigFont](#bigfont-bigfont-props-basalt)|-|Initializes the BigFont instance|
-|[BigFont:BigFont](#bigfont-bigfont)|-|Renders the BigFont|
+|BigFont:init|-|Initializes the BigFont instance
+|BigFont:render|-|Renders the BigFont
 
-## BigFont.new()
-### Returns
-* `table` `self` The created instance
 
-## BigFont:BigFont(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## BigFont:BigFont()
\ No newline at end of file
diff --git a/docs/references/elements/Button.md b/docs/references/elements/Button.md
index e8c2014..ad43953 100644
--- a/docs/references/elements/Button.md
+++ b/docs/references/elements/Button.md
@@ -1,29 +1,18 @@
-# Button
-_The Button is a standard button element with click handling and state management._
-
-Extends: `VisualElement`
+# Button : VisualElement
+The Button is a standard button element with click handling and state management.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|text|string|Button|Button text|
+|text|string|Button|Button text
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Button.new](#button-new)|table|Creates a new Button instance|
-|[Button:Button](#button-button-props-basalt)|-|Initializes the Button instance|
-|[Button:Button](#button-button)|-|Renders the Button|
+|Button:init|-|Initializes the Button instance
+|Button:render|-|Renders the Button
 
-## Button.new()
-### Returns
-* `table` `self` The created instance
 
-## Button:Button(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## Button:Button()
\ No newline at end of file
diff --git a/docs/references/elements/Checkbox.md b/docs/references/elements/Checkbox.md
index 286b842..82e87a1 100644
--- a/docs/references/elements/Checkbox.md
+++ b/docs/references/elements/Checkbox.md
@@ -1,42 +1,23 @@
-# Checkbox
-_The Checkbox is a visual element that can be checked._
-
-Extends: `VisualElement`
+# Checkbox : VisualElement
+The Checkbox is a visual element that can be checked.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|checked|boolean|Whether|checkbox is checked|
-|text|string|empty|Text to display|
-|checkedText|string|Text|when checked|
-|autoSize|boolean|true|Whether to automatically size the checkbox|
+|checked|boolean|Whether|checkbox is checked
+|text|string|empty|Text to display
+|checkedText|string|Text|when checked
+|autoSize|boolean|true|Whether to automatically size the checkbox
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Checkbox.new](#checkbox-new)|Checkbox|Creates a new Checkbox instance|
-|[Checkbox:Checkbox](#checkbox-checkbox-props-basalt)|-|Initializes the Checkbox instance|
-|[Checkbox:Checkbox](#checkbox-checkbox-button-x-y)|boolean|Handles mouse click events|
-|[Checkbox:Checkbox](#checkbox-checkbox)|-|Renders the Checkbox|
+|Checkbox.new|Checkbox|Creates a new Checkbox instance
+|Checkbox:init|-|Initializes the Checkbox instance
+|Checkbox:mouse_click|boolean|Handles mouse click events
+|Checkbox:render|-|Renders the Checkbox
 
-## Checkbox.new()
-### Returns
-* `Checkbox` `self` The created instance
 
-## Checkbox:Checkbox(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## Checkbox:Checkbox(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `Clicked` Whether the event was handled
-
-## Checkbox:Checkbox()
\ No newline at end of file
diff --git a/docs/references/elements/ComboBox.md b/docs/references/elements/ComboBox.md
new file mode 100644
index 0000000..e69de29
diff --git a/docs/references/elements/Container.md b/docs/references/elements/Container.md
index d4e1da7..10308e8 100644
--- a/docs/references/elements/Container.md
+++ b/docs/references/elements/Container.md
@@ -1,82 +1,77 @@
-# Container
-_The Container class serves as a fundamental building block for organizing UI elements. It acts as a parent element that can hold and manage child elements._
+# Container : VisualElement
+The Container class serves as a fundamental building block for organizing UI elements. It acts as a parent element that can hold and manage child elements.
+
+### Usage
+ ```lua
+local container = basalt.getMainFrame()
+container:addButton()  -- Add a child element
+```
 
-Extends: `VisualElement`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|children|table|{}|The children of the container|
-|childrenSorted|boolean|true|Whether the children are sorted|
-|childrenEventsSorted|boolean|true|Whether the children events are sorted|
-|childrenEvents|table|{}|The children events of the container|
-|eventListenerCount|table|{}|The event listener count of the container|
-|focusedChild|table|nil|The focused child of the container|
-|visibleChildren|table|{}|The visible children of the container|
-|visibleChildrenEvents|table|{}|The visible children events of the container|
-|offsetX|number|0|Horizontal content offset|
-|offsetY|number|0|Vertical content offset|
+|children|table|{}|The children of the container
+|childrenSorted|boolean|true|Whether the children are sorted
+|childrenEventsSorted|boolean|true|Whether the children events are sorted
+|childrenEvents|table|{}|The children events of the container
+|eventListenerCount|table|{}|The event listener count of the container
+|focusedChild|table|nil|The focused child of the container
+|visibleChildren|table|{}|The visible children of the container
+|visibleChildrenEvents|table|{}|The visible children events of the container
+|offsetX|number|0|Horizontal content offset
+|offsetY|number|0|Vertical content offset
+
+## Combined Properties
+
+|Name|Properties|Description|
+|---|---|---|
+|offset|`offsetX number, offsetY number`|Combined property for offsetX and offsetY|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Container.new](#container-new)|Container|Creates a new Container instance|
-|[Container:Container](#container-container-props-basalt)|-|Initializes the Container instance|
-|[Container:Container](#container-container-child)|boolean|Returns whether a child is visible|
-|[Container:Container](#container-container-child)|Container|Adds a child to the container|
-|[Container:Container](#container-container)|Container|Clears the container|
-|[Container:Container](#container-container)|Container|Sorts the children of the container|
-|[Container:Container](#container-container-eventname)|Container|Sorts the children events of the container|
-|[Container:Container](#container-container-child)|Container|Registers the children events of the container|
-|[Container:Container](#container-container-child-eventname)|Container|Registers the children events of the container|
-|[Container:Container](#container-container-child)|Container|Unregisters the children events of the container|
-|[Container:Container](#container-container-child-eventname)|Container|Unregisters the children events of the container|
-|[Container:Container](#container-container-child)|Container|Removes a child from the container|
-|[Container:Container](#container-container-path)|self|Removes a child from the container|
-|[Container:Container](#container-container-visibleonly-event)|boolean, child|Calls a event on all children|
-|[Container:Container](#container-container-event)|boolean|Default handler for events|
-|[Container:Container](#container-container-button-x-y)|boolean|Handles mouse click events|
-|[Container:Container](#container-container-button-x-y)|boolean|Handles mouse up events|
-|[Container:Container](#container-container-button-x-y)|-|Handles mouse release events|
-|[Container:Container](#container-container---x-y)|boolean|Handles mouse move events|
-|[Container:Container](#container-container-button-x-y)|boolean|Handles mouse drag events|
-|[Container:Container](#container-container-direction-x-y)|boolean|Handles mouse scroll events|
-|[Container:Container](#container-container-key)|boolean|Handles key events|
-|[Container:Container](#container-container-char)|boolean|Handles char events|
-|[Container:Container](#container-container-key)|boolean|Handles key up events|
-|[Container:Container](#container-container-x-y-width-height-text-fg-bg)|Container|Draws multiple lines of text, fg and bg strings|
-|[Container:Container](#container-container-x-y-text-fg)|Container|Draws a line of text and fg as color|
-|[Container:Container](#container-container-x-y-text-bg)|Container|Draws a line of text and bg as color|
-|[Container:Container](#container-container-x-y-text-fg-bg)|Container|Draws a line of text and fg and bg as colors|
-|[Container:Container](#container-container)|-|Renders the container|
-|[Container:Container](#container-container)|-||
+|[Container:addChild](#container-addchild)|Container|Adds a child to the container
+|[Container:callChildrenEvent](#container-callchildrenevent)|boolean|Calls a event on all children
+|[Container:clear](#container-clear)|Container|Clears the container
+|[Container:drawBg](#container-drawbg)|-|
+|[Container:drawFg](#container-drawfg)|-|
+|[Container:drawText](#container-drawtext)|-|
+|[Container:getChild](#container-getchild)|Container?|Removes a child from the container
+|[Container:isChildVisible](#container-ischildvisible)|boolean|Returns whether a child is visible
+|[Container:registerChildEvent](#container-registerchildevent)|Container|Registers the children events of the container
+|[Container:registerChildrenEvents](#container-registerchildrenevents)|Container|Registers the children events of the container
+|[Container:removeChild](#container-removechild)|Container|Removes a child from the container
+|[Container:removeChildrenEvents](#container-removechildrenevents)|Container|Unregisters the children events of the container
+|[Container:sortChildren](#container-sortchildren)|Container|Sorts the children of the container
+|[Container:sortChildrenEvents](#container-sortchildrenevents)|Container|Sorts the children events of the container
+|[Container:unregisterChildEvent](#container-unregisterchildevent)|Container|Unregisters the children events of the container
 
-## Container.new()
 
-Creates a new Container instance
+## Protected Functions
 
-### Returns
-* `Container` `self` The new container instance
-
-## Container:Container(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## Container:Container(child)
-
-Returns whether a child is visible
-
-### Parameters
-* `child` `table` The child to check
-
-### Returns
-* `boolean` `boolean` the child is visible
-
-## Container:Container(child)
+|Method|Returns|Description|
+|---|---|---|
+|Container:blit|Container|Draws a line of text and fg and bg as colors
+|Container:char|boolean|Handles char events
+|Container:handleEvent|boolean|Default handler for events
+|Container:init|-|Initializes the Container instance
+|Container:key|boolean|Handles key events
+|Container:key_up|boolean|Handles key up events
+|Container:mouse_click|boolean|Handles mouse click events
+|Container:mouse_drag|boolean|Handles mouse drag events
+|Container:mouse_move|boolean|Handles mouse move events
+|Container:mouse_release|-|Handles mouse release events
+|Container:mouse_scroll|boolean|Handles mouse scroll events
+|Container:mouse_up|boolean|Handles mouse up events
+|Container:multiBlit|Container|Draws multiple lines of text, fg and bg strings
+|Container:render|-|Renders the container
+|Container:textBg|Container|Draws a line of text and bg as color
+|Container:textFg|Container|Draws a line of text and fg as color
 
+## Container:addChild(child)
 Adds a child to the container
 
 ### Parameters
@@ -85,42 +80,49 @@ Adds a child to the container
 ### Returns
 * `Container` `self` The container instance
 
-## Container:Container()
+## Container:callChildrenEvent(visibleOnly, event...)
+Calls a event on all children
 
+### Parameters
+* `visibleOnly` `boolean` Whether to only call the event on visible children
+* `event` `string` The event to call
+* `...` *(vararg)* `any` The event arguments
+
+### Returns
+* `boolean` `handled` Whether the event was handled
+* `table?` `child` The child that handled the event
+
+## Container:clear()
 Clears the container
 
 ### Returns
 * `Container` `self` The container instance
 
-## Container:Container()
+## Container:drawBg()
 
-Sorts the children of the container
+## Container:drawFg()
 
-### Returns
-* `Container` `self` The container instance
+## Container:drawText()
 
-## Container:Container(eventName)
-
-Sorts the children events of the container
+## Container:getChild(path)
+Removes a child from the container
 
 ### Parameters
-* `eventName` `string` The event name to sort
+* `path` `string` The path to the child to remove
 
 ### Returns
-* `Container` `self` The container instance
+* `Container?` `self` The container instance
 
-## Container:Container(child)
-
-Registers the children events of the container
+## Container:isChildVisible(child)
+Returns whether a child is visible
 
 ### Parameters
-* `child` `table` The child to register events for
+* `child` `table` The child to check
 
 ### Returns
-* `Container` `self` The container instance
-
-## Container:Container(child, eventName)
+* `boolean` `boolean` the child is visible
 
+## Container:registerChildEvent(child, eventName)
 Registers the children events of the container
 
 ### Parameters
@@ -130,8 +132,25 @@ Registers the children events of the container
 ### Returns
 * `Container` `self` The container instance
 
-## Container:Container(child)
+## Container:registerChildrenEvents(child)
+Registers the children events of the container
 
+### Parameters
+* `child` `table` The child to register events for
+
+### Returns
+* `Container` `self` The container instance
+
+## Container:removeChild(child)
+Removes a child from the container
+
+### Parameters
+* `child` `table` The child to remove
+
+### Returns
+* `Container` `self` The container instance
+
+## Container:removeChildrenEvents(child)
 Unregisters the children events of the container
 
 ### Parameters
@@ -140,8 +159,22 @@ Unregisters the children events of the container
 ### Returns
 * `Container` `self` The container instance
 
-## Container:Container(child, eventName)
+## Container:sortChildren()
+Sorts the children of the container
 
+### Returns
+* `Container` `self` The container instance
+
+## Container:sortChildrenEvents(eventName)
+Sorts the children events of the container
+
+### Parameters
+* `eventName` `string` The event name to sort
+
+### Returns
+* `Container` `self` The container instance
+
+## Container:unregisterChildEvent(child, eventName)
 Unregisters the children events of the container
 
 ### Parameters
@@ -151,160 +184,4 @@ Unregisters the children events of the container
 ### Returns
 * `Container` `self` The container instance
 
-## Container:Container(child)
 
-Removes a child from the container
-
-### Parameters
-* `child` `table` The child to remove
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container(path)
-
-Removes a child from the container
-
-### Parameters
-* `path` `string` The path to the child to remove
-
-### Returns
-* `self` `The` container instance
-
-## Container:Container(visibleOnly, event)
-
-Calls a event on all children
-
-### Parameters
-* `visibleOnly` `boolean` Whether to only call the event on visible children
-* `event` `string` The event to call
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-* `child` `The` child that handled the event
-
-## Container:Container(event)
-### Parameters
-* `event` `string` The event to handle
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-## Container:Container(_, x, y)
-### Parameters
-* `_` `number` unknown
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(direction, x, y)
-### Parameters
-* `direction` `number` The direction of the scroll
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(key)
-### Parameters
-* `key` `number` The key that was pressed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(char)
-### Parameters
-* `char` `string` The character that was pressed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(key)
-### Parameters
-* `key` `number` The key that was released
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Container:Container(x, y, width, height, text, fg, bg)
-### Parameters
-* `x` `number` The x position to draw the text
-* `y` `number` The y position to draw the text
-* `width` `number` The width of the text
-* `height` `number` The height of the text
-* `text` `string` The text to draw
-* `fg` `string` The foreground color of the text
-* `bg` `string` The background color of the text
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container(x, y, text, fg)
-### Parameters
-* `x` `number` The x position to draw the text
-* `y` `number` The y position to draw the text
-* `text` `string` The text to draw
-* `fg` `color` The foreground color of the text
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container(x, y, text, bg)
-### Parameters
-* `x` `number` The x position to draw the text
-* `y` `number` The y position to draw the text
-* `text` `string` The text to draw
-* `bg` `color` The background color of the text
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container(x, y, text, fg, bg)
-### Parameters
-* `x` `number` The x position to draw the text
-* `y` `number` The y position to draw the text
-* `text` `string` The text to draw
-* `fg` `string` The foreground color of the text
-* `bg` `string` The background color of the text
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container()
-## Container:Container()
\ No newline at end of file
diff --git a/docs/references/elements/Display.md b/docs/references/elements/Display.md
index 825c94a..9724530 100644
--- a/docs/references/elements/Display.md
+++ b/docs/references/elements/Display.md
@@ -1,36 +1,36 @@
-# Display
-_The Display is a special element where you can use the window (term) API to draw on the display, useful when you need to use external APIs._
+# Display : VisualElement
+The Display is a special element where you can use the window (term) API to draw on the display, useful when you need to use external APIs.
+
+### Usage
+ ```lua
+local display = main:addDisplay() -- Create a display element
+local displayWindow = display:getWindow() -- Get the window object of the display
+displayWindow.write("Hello World!") -- Write "Hello World!" to the display
+```
 
-Extends: `VisualElement`
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Display.new](#display-new)|table|Creates a new Display instance|
-|[Display:Display](#display-display-props-basalt)|-|Initializes the Display instance|
-|[Display:Display](#display-display)|table|Returns the current window object|
-|[Display:Display](#display-display-x-y-text-fg-bg)|Display|Writes text to the display|
-|[Display:Display](#display-display)|-|Renders the Display|
+|[Display:getWindow](#display-getwindow)|table|Returns the current window object
+|[Display:write](#display-write)|Display|Writes text to the display
 
-## Display.new()
-### Returns
-* `table` `self` The created instance
 
-## Display:Display(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+## Protected Functions
 
-## Display:Display()
+|Method|Returns|Description|
+|---|---|---|
+|Display:init|-|Initializes the Display instance
+|Display:render|-|Renders the Display
 
+## Display:getWindow()
 Returns the current window object
 
 ### Returns
 * `table` `window` The current window object
 
-## Display:Display(x, y, text, fg?, bg?)
-
+## Display:write(x, y, text, fg?, bg?)
 Writes text to the display at the given position with the given foreground and background colors
 
 ### Parameters
@@ -43,4 +43,4 @@ Writes text to the display at the given position with the given foreground and b
 ### Returns
 * `Display` `self` The display instance
 
-## Display:Display()
\ No newline at end of file
+
diff --git a/docs/references/elements/Dropdown.md b/docs/references/elements/Dropdown.md
index 19e5623..72d1ee3 100644
--- a/docs/references/elements/Dropdown.md
+++ b/docs/references/elements/Dropdown.md
@@ -1,48 +1,33 @@
-# Dropdown
-_This is the dropdown class. It is a visual element that can show a list of selectable items in a dropdown menu._
+# Dropdown : List
+This is the dropdown class. It is a visual element that can show a list of selectable items in a dropdown menu.
+
+### Usage
+ ```lua
+local dropdown = main:addDropdown()
+dropdown:setItems({
+{text = "Item 1", callback = function() basalt.LOGGER.debug("Item 1 selected") end},
+{text = "Item 2", callback = function() basalt.LOGGER.debug("Item 2 selected") end},
+{text = "Item 3", callback = function() basalt.LOGGER.debug("Item 3 selected") end},
+})
+```
 
-Extends: `List`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|isOpen|boolean|false|Whether the dropdown menu is currently open|
-|dropdownHeight|number|5|Maximum height of the dropdown menu when open|
-|selectedText|string|""|The text to show when no item is selected|
-|dropSymbol|string|"\31"|The symbol to show for dropdown indication|
+|isOpen|boolean|false|Whether the dropdown menu is currently open
+|dropdownHeight|number|5|Maximum height of the dropdown menu when open
+|selectedText|string|""|The text to show when no item is selected
+|dropSymbol|string|"\31"|The symbol to show for dropdown indication
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Dropdown.new](#dropdown-new)|Dropdown|Creates a new Dropdown instance|
-|[Dropdown:Dropdown](#dropdown-dropdown-props-basalt)|Dropdown|Initializes the Dropdown instance|
-|[Dropdown:Dropdown](#dropdown-dropdown-button-x-y)|boolean|Handles mouse click events|
-|[Dropdown:Dropdown](#dropdown-dropdown)|-|Renders the Dropdown|
+|Dropdown:init|Dropdown|Initializes the Dropdown instance
+|Dropdown:mouse_click|boolean|Handles mouse click events
+|Dropdown:render|-|Renders the Dropdown
 
-## Dropdown.new()
 
-Creates a new Dropdown instance
-
-### Returns
-* `Dropdown` `self` The newly created Dropdown instance
-
-## Dropdown:Dropdown(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Dropdown` `self` The initialized instance
-
-## Dropdown:Dropdown(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Dropdown:Dropdown()
\ No newline at end of file
diff --git a/docs/references/elements/Flexbox.md b/docs/references/elements/Flexbox.md
index 6414ffe..3ffcfe0 100644
--- a/docs/references/elements/Flexbox.md
+++ b/docs/references/elements/Flexbox.md
@@ -1,46 +1,52 @@
-# Flexbox
-_This is the Flexbox class. It is a container that arranges its children in a flexible layout.
-The flexbox element adds the following properties to its children:
-_
+# Flexbox : Container
+This is the Flexbox class. It is a container that arranges its children in a flexible layout.
+
+### Usage
+ ```lua
+local flex = main:addFlexbox({background=colors.black, width=30, height=10})
+flex:addButton():setFlexGrow(1)
+flex:addButton():setFlexGrow(1)
+flex:addButton():setFlexGrow(1)
+```
+
+The flexbox element adds the following properties to its children:
+
+### Usage
+ ```lua
+flex:addButton():setFlexGrow(1) -- The flex-grow property defines the ability for a flex item to grow if necessary.
+flex:addButton():setFlexShrink(1) -- The flex-shrink property defines the ability for a flex item to shrink if necessary.
+flex:addButton():setFlexBasis(1) -- The flex-basis property defines the default size of an element before the remaining space is distributed.
+```
+
 
-Extends: `Container`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|flexDirection|string|"row"|The direction of the flexbox layout "row" or "column"|
-|flexSpacing|number|1|The spacing between flex items|
-|flexJustifyContent|string|"flex-start"|The alignment of flex items along the main axis|
-|flexAlignItems|string|"flex-start"|The alignment of flex items along the cross axis|
-|flexCrossPadding|number|0|The padding on both sides of the cross axis|
-|flexWrap|boolean|false|Whether to wrap flex items onto multiple lines|
+|flexDirection|string|"row"|The direction of the flexbox layout "row" or "column"
+|flexSpacing|number|1|The spacing between flex items
+|flexJustifyContent|string|"flex-start"|The alignment of flex items along the main axis
+|flexWrap|boolean|false|Whether to wrap flex items onto multiple lines
+|flexUpdateLayout|boolean|false|Whether to update the layout of the flexbox
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Flexbox.new](#flexbox-new)|Flexbox|Creates a new Flexbox instance|
-|[Flexbox:Flexbox](#flexbox-flexbox-props-basalt)|Flexbox|Initializes the Flexbox instance|
-|[Flexbox:Flexbox](#flexbox-flexbox-element)|Flexbox|Adds a child element to the flexbox|
-|[Flexbox:Flexbox](#flexbox-flexbox-element)|Flexbox|Removes a child element from the flexbox|
-|[Flexbox:Flexbox](#flexbox-flexbox-self)|Flexbox|Adds a new line break to the flexbox.|
-|[Flexbox:Flexbox](#flexbox-flexbox)|-|Renders the flexbox and its children|
+|[Flexbox:addChild](#flexbox-addchild)|Flexbox|Adds a child element to the flexbox
+|[Flexbox:addLineBreak](#flexbox-addlinebreak)|Flexbox|Adds a new line break to the flexbox.
 
-## Flexbox.new()
-### Returns
-* `Flexbox` `object` The newly created Flexbox instance
 
-## Flexbox:Flexbox(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+## Protected Functions
 
-### Returns
-* `Flexbox` `self` The initialized instance
-
-## Flexbox:Flexbox(element)
+|Method|Returns|Description|
+|---|---|---|
+|Flexbox:init|Flexbox|Initializes the Flexbox instance
+|Flexbox:removeChild|Flexbox|Removes a child element from the flexbox
+|Flexbox:render|-|Renders the flexbox and its children
 
+## Flexbox:addChild(element)
 Adds a child element to the flexbox
 
 ### Parameters
@@ -49,21 +55,13 @@ Adds a child element to the flexbox
 ### Returns
 * `Flexbox` `self` The flexbox instance
 
-## Flexbox:Flexbox(element)
-### Parameters
-* `element` `Element` The child element to remove
-
-### Returns
-* `Flexbox` `self` The flexbox instance
-
-## Flexbox:Flexbox(self)
-
+## Flexbox:addLineBreak(self)
 Adds a new line break to the flexbox
 
 ### Parameters
 * `self` `Flexbox` The element itself
 
 ### Returns
-* `Flexbox`
+* `nil` `nil` nil
+
 
-## Flexbox:Flexbox()
\ No newline at end of file
diff --git a/docs/references/elements/Frame.md b/docs/references/elements/Frame.md
index 82293de..f252f60 100644
--- a/docs/references/elements/Frame.md
+++ b/docs/references/elements/Frame.md
@@ -1,63 +1,21 @@
-# Frame
-_This is the frame class. It serves as a grouping container for other elements._
-
-Extends: `Container`
+# Frame : Container
+This is the frame class. It serves as a grouping container for other elements.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|draggable|boolean|false|Whether the frame is draggable|
-|draggingMap|table|{}|The map of dragging positions|
+|draggable|boolean|false|Whether the frame is draggable
+|draggingMap|table|{}|The map of dragging positions
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Frame.new](#frame-new)|Frame|Creates a new Frame instance|
-|[Frame:Frame](#frame-frame-props-basalt)|Frame|Initializes the Frame instance|
-|[Frame:Frame](#frame-frame-button-x-y)|boolean|Handles mouse click events|
-|[Frame:Frame](#frame-frame-button-x-y)|boolean|Handles mouse release events|
-|[Frame:Frame](#frame-frame-button-x-y)|boolean|Handles mouse drag events|
+|Frame:init|Frame|Initializes the Frame instance
+|Frame:mouse_click|boolean|Handles mouse click events
+|Frame:mouse_drag|boolean|Handles mouse drag events
+|Frame:mouse_up|boolean|Handles mouse release events
 
-## Frame.new()
 
-Creates a new Frame instance
-
-### Returns
-* `Frame` `self` The newly created Frame instance
-
-## Frame:Frame(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Frame` `self` The initialized instance
-
-## Frame:Frame(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Frame:Frame(button, x, y)
-### Parameters
-* `button` `number` The button that was released
-* `x` `number` The x position of the release
-* `y` `number` The y position of the release
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Frame:Frame(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the drag position
-* `y` `number` The y position of the drag position
-
-### Returns
-* `boolean` `handled` Whether the event was handled
diff --git a/docs/references/elements/Graph.md b/docs/references/elements/Graph.md
index 57fadf5..e59f214 100644
--- a/docs/references/elements/Graph.md
+++ b/docs/references/elements/Graph.md
@@ -1,48 +1,62 @@
-# Graph
-_This is the base class for all graph elements. It is a point based graph._
+# Graph : VisualElement
+This is the base class for all graph elements. It is a point based graph.
+
+### Usage
+ ```lua
+local graph = main:addGraph()
+:addSeries("input", " ", colors.green, colors.green, 10)
+:addSeries("output", " ", colors.red, colors.red, 10)
+
+basalt.schedule(function()
+while true do
+graph:addPoint("input", math.random(1,100))
+graph:addPoint("output", math.random(1,100))
+sleep(2)
+end
+end)
+```
 
-Extends: `VisualElement`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|minValue|number|0|The minimum value of the graph|
-|maxValue|number|100|The maximum value of the graph|
-|series|table|{}|The series of the graph|
+|minValue|number|0|The minimum value of the graph
+|maxValue|number|100|The maximum value of the graph
+|series|table|{}|The series of the graph
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Graph.new](#graph-new)|Graph|Creates a new Graph instance|
-|[Graph:Graph](#graph-graph-props-basalt)|Graph|Initializes the Graph instance|
-|[Graph:Graph](#graph-graph-name-symbol-bgcol-fgcol-pointcount)|Graph|Adds a series to the graph|
-|[Graph:Graph](#graph-graph-name)|Graph|Removes a series from the graph|
-|[Graph:Graph](#graph-graph-name)|series|Gets a series from the graph|
-|[Graph:Graph](#graph-graph-name-visible)|Graph|Changes the visibility of a series|
-|[Graph:Graph](#graph-graph-name-value)|Graph|Adds a point to a series|
-|[Graph:Graph](#graph-graph-name)|Graph|Focuses a series|
-|[Graph:Graph](#graph-graph-name-count)|Graph|Sets the point count of a series|
-|[Graph:Graph](#graph-graph-name)|Graph|Clears all points from a series|
-|[Graph:Graph](#graph-graph)|-|Renders the graph|
+|[Graph:addPoint](#graph-addpoint)|Graph|Adds a point to a series
+|[Graph:addSeries](#graph-addseries)|Graph|Adds a series to the graph
+|[Graph:changeSeriesVisibility](#graph-changeseriesvisibility)|Graph|Changes the visibility of a series
+|[Graph:clear](#graph-clear)|Graph|Clears all points from a series
+|[Graph:focusSeries](#graph-focusseries)|Graph|Focuses a series
+|[Graph:getSeries](#graph-getseries)|table?|Gets a series from the graph
+|[Graph:removeSeries](#graph-removeseries)|Graph|Removes a series from the graph
+|[Graph:setSeriesPointCount](#graph-setseriespointcount)|Graph|Sets the point count of a series
 
-## Graph.new()
 
-Creates a new Graph instance
+## Protected Functions
 
-### Returns
-* `Graph` `self` The newly created Graph instance
+|Method|Returns|Description|
+|---|---|---|
+|Graph:init|Graph|Initializes the Graph instance
+|Graph:render|-|Renders the graph
+
+## Graph:addPoint(name, value)
 
-## Graph:Graph(props, basalt)
 ### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+* `name` `string` The name of the series
+* `value` `number` The value of the point
 
 ### Returns
-* `Graph` `self` The initialized instance
+* `Graph` `self` The graph instance
+
+## Graph:addSeries(name, symbol, bgCol, fgCol, pointCount)
 
-## Graph:Graph(name, symbol, bgCol, fgCol, pointCount)
 ### Parameters
 * `name` `string` The name of the series
 * `symbol` `string` The symbol of the series
@@ -53,21 +67,8 @@ Creates a new Graph instance
 ### Returns
 * `Graph` `self` The graph instance
 
-## Graph:Graph(name)
-### Parameters
-* `name` `string` The name of the series
+## Graph:changeSeriesVisibility(name, visible)
 
-### Returns
-* `Graph` `self` The graph instance
-
-## Graph:Graph(name)
-### Parameters
-* `name` `string` The name of the series
-
-### Returns
-* `series` `The` series
-
-## Graph:Graph(name, visible)
 ### Parameters
 * `name` `string` The name of the series
 * `visible` `boolean` Whether the series should be visible
@@ -75,31 +76,7 @@ Creates a new Graph instance
 ### Returns
 * `Graph` `self` The graph instance
 
-## Graph:Graph(name, value)
-### Parameters
-* `name` `string` The name of the series
-* `value` `number` The value of the point
-
-### Returns
-* `Graph` `self` The graph instance
-
-## Graph:Graph(name)
-### Parameters
-* `name` `string` The name of the series
-
-### Returns
-* `Graph` `self` The graph instance
-
-## Graph:Graph(name, count)
-### Parameters
-* `name` `string` The name of the series
-* `count` `number` The number of points in the series
-
-### Returns
-* `Graph` `self` The graph instance
-
-## Graph:Graph(name?)
-
+## Graph:clear(name?)
 Clears all points from a series
 
 ### Parameters
@@ -108,4 +85,37 @@ Clears all points from a series
 ### Returns
 * `Graph` `self` The graph instance
 
-## Graph:Graph()
\ No newline at end of file
+## Graph:focusSeries(name)
+
+### Parameters
+* `name` `string` The name of the series
+
+### Returns
+* `Graph` `self` The graph instance
+
+## Graph:getSeries(name)
+
+### Parameters
+* `name` `string` The name of the series
+
+### Returns
+* `table?` `series` The series
+
+## Graph:removeSeries(name)
+
+### Parameters
+* `name` `string` The name of the series
+
+### Returns
+* `Graph` `self` The graph instance
+
+## Graph:setSeriesPointCount(name, count)
+
+### Parameters
+* `name` `string` The name of the series
+* `count` `number` The number of points in the series
+
+### Returns
+* `Graph` `self` The graph instance
+
+
diff --git a/docs/references/elements/Image.md b/docs/references/elements/Image.md
index efffabb..956ea0f 100644
--- a/docs/references/elements/Image.md
+++ b/docs/references/elements/Image.md
@@ -1,153 +1,60 @@
-# Image
-_This is the Image element class which can be used to display bimg formatted images.
+# Image : VisualElement
+This is the Image element class which can be used to display bimg formatted images.
 Bimg is a universal ComputerCraft image format.
-See: https://github.com/SkyTheCodeMaster/bimg_
-
-Extends: `VisualElement`
+See: https://github.com/SkyTheCodeMaster/bimg
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|bimg|table|{}|The bimg image data|
-|currentFrame|number|1|Current animation frame|
-|autoResize|boolean|false|Whether to automatically resize the image when content exceeds bounds|
-|offsetX|number|0|Horizontal offset for viewing larger images|
-|offsetY|number|0|Vertical offset for viewing larger images|
+|bimg|table|{}|The bimg image data
+|currentFrame|number|1|Current animation frame
+|autoResize|boolean|false|Whether to automatically resize the image when content exceeds bounds
+|offsetX|number|0|Horizontal offset for viewing larger images
+|offsetY|number|0|Vertical offset for viewing larger images
+
+## Combined Properties
+
+|Name|Properties|Description|
+|---|---|---|
+|offset|`offsetX offsetY`|Combined property for offsetX and offsetY|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Image.new](#image-new)|Image|Creates a new Image instance|
-|[Image:Image](#image-image-props-basalt)|Image|Initializes the Image instance|
-|[Image:Image](#image-image-width-height)|Image|Resizes the image to the specified width and height|
-|[Image:Image](#image-image)|number, number|Gets the size of the image|
-|[Image:Image](#image-image-x-y)|fg, bg, char|Gets pixel information at position|
-|[Image:Image](#image-image-x-y-text)|Image|Sets the text at the specified position|
-|[Image:Image](#image-image-x-y-length)|string|Gets the text at the specified position|
-|[Image:Image](#image-image-x-y-pattern)|Image|Sets the foreground color at the specified position|
-|[Image:Image](#image-image-x-y-length)|string|Gets the foreground color at the specified position|
-|[Image:Image](#image-image-x-y-pattern)|Image|Sets the background color at the specified position|
-|[Image:Image](#image-image-x-y-length)|string|Gets the background color at the specified position|
-|[Image:Image](#image-image-x-y-char-fg-bg)|Image|Sets the pixel at the specified position|
-|[Image:Image](#image-image)|Image|Advances to the next frame in the animation|
-|[Image:Image](#image-image)|Image|Adds a new frame to the image|
-|[Image:Image](#image-image-frameindex-frame)|Image|Updates the specified frame with the provided data|
-|[Image:Image](#image-image-frameindex)|table|Gets the specified frame|
-|[Image:Image](#image-image)|table|Gets the metadata of the image|
-|[Image:Image](#image-image-key-value)|Image|Sets the metadata of the image|
-|[Image:Image](#image-image)|-|Renders the Image|
+|[Image:addFrame](#image-addframe)|Image|Adds a new frame to the image
+|[Image:getBg](#image-getbg)|string|Gets the background color at the specified position
+|[Image:getFg](#image-getfg)|string|Gets the foreground color at the specified position
+|[Image:getFrame](#image-getframe)|table|Gets the specified frame
+|[Image:getImageSize](#image-getimagesize)|number|Gets the size of the image
+|[Image:getMetadata](#image-getmetadata)|table|Gets the metadata of the image
+|[Image:getPixelData](#image-getpixeldata)|number?|Gets pixel information at position
+|[Image:getText](#image-gettext)|string|Gets the text at the specified position
+|[Image:nextFrame](#image-nextframe)|Image|Advances to the next frame in the animation
+|[Image:resizeImage](#image-resizeimage)|Image|Resizes the image to the specified width and height
+|[Image:setBg](#image-setbg)|Image|Sets the background color at the specified position
+|[Image:setFg](#image-setfg)|Image|Sets the foreground color at the specified position
+|[Image:setMetadata](#image-setmetadata)|Image|Sets the metadata of the image
+|[Image:setPixel](#image-setpixel)|Image|Sets the pixel at the specified position
+|[Image:setText](#image-settext)|Image|Sets the text at the specified position
+|[Image:updateFrame](#image-updateframe)|Image|Updates the specified frame with the provided data
 
-## Image.new()
 
-Creates a new Image instance
+## Protected Functions
 
-### Returns
-* `Image` `self` The newly created Image instance
+|Method|Returns|Description|
+|---|---|---|
+|Image:init|Image|Initializes the Image instance
+|Image:render|-|Renders the Image
 
-## Image:Image(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Image` `self` The initialized instance
-
-## Image:Image(width, height)
-
-Resizes the image to the specified width and height
-
-### Parameters
-* `width` `number` The new width of the image
-* `height` `number` The new height of the image
+## Image:addFrame()
+Adds a new frame to the image
 
 ### Returns
 * `Image` `self` The Image instance
 
-## Image:Image()
-
-Gets the size of the image
-
-### Returns
-* `number` `width` The width of the image
-* `number` `height` The height of the image
-
-## Image:Image(x, y)
-
-Gets pixel information at position
-
-### Parameters
-* `x` `number` X position
-* `y` `number` Y position
-
-### Returns
-* `fg` `Foreground` color
-* `bg` `Background` color
-* `char` `Character` at position
-
-## Image:Image(x, y, text)
-
-Sets the text at the specified position
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `text` `string` The text to set
-
-### Returns
-* `Image` `self` The Image instance
-
-## Image:Image(x, y, length)
-
-Gets the text at the specified position
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `length` `number` The length of the text to get
-
-### Returns
-* `string` `text` The text at the specified position
-
-## Image:Image(x, y, pattern)
-
-Sets the foreground color at the specified position
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `pattern` `string` The foreground color pattern
-
-### Returns
-* `Image` `self` The Image instance
-
-## Image:Image(x, y, length)
-
-Gets the foreground color at the specified position
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `length` `number` The length of the foreground color pattern to get
-
-### Returns
-* `string` `fg` The foreground color pattern
-
-## Image:Image(x, y, pattern)
-
-Sets the background color at the specified position
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `pattern` `string` The background color pattern
-
-### Returns
-* `Image` `self` The Image instance
-
-## Image:Image(x, y, length)
-
+## Image:getBg(x, y, length)
 Gets the background color at the specified position
 
 ### Parameters
@@ -158,8 +65,111 @@ Gets the background color at the specified position
 ### Returns
 * `string` `bg` The background color pattern
 
-## Image:Image(x, y, char, fg, bg)
+## Image:getFg(x, y, length)
+Gets the foreground color at the specified position
 
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `length` `number` The length of the foreground color pattern to get
+
+### Returns
+* `string` `fg` The foreground color pattern
+
+## Image:getFrame(frameIndex)
+Gets the specified frame
+
+### Parameters
+* `frameIndex` `number` The index of the frame to get
+
+### Returns
+* `table` `frame` The frame data
+
+## Image:getImageSize()
+Gets the size of the image
+
+### Returns
+* `number` `width` The width of the image
+* `number` `height` The height of the image
+
+## Image:getMetadata()
+Gets the metadata of the image
+
+### Returns
+* `table` `metadata` The metadata of the image
+
+## Image:getPixelData(x, y)
+Gets pixel information at position
+
+### Parameters
+* `x` `number` X position
+* `y` `number` Y position
+
+### Returns
+* `number?` `fg` Foreground color
+* `number?` `bg` Background color
+* `string?` `char` Character at position
+
+## Image:getText(x, y, length)
+Gets the text at the specified position
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `length` `number` The length of the text to get
+
+### Returns
+* `string` `text` The text at the specified position
+
+## Image:nextFrame()
+Advances to the next frame in the animation
+
+### Returns
+* `Image` `self` The Image instance
+
+## Image:resizeImage(width, height)
+Resizes the image to the specified width and height
+
+### Parameters
+* `width` `number` The new width of the image
+* `height` `number` The new height of the image
+
+### Returns
+* `Image` `self` The Image instance
+
+## Image:setBg(x, y, pattern)
+Sets the background color at the specified position
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `pattern` `string` The background color pattern
+
+### Returns
+* `Image` `self` The Image instance
+
+## Image:setFg(x, y, pattern)
+Sets the foreground color at the specified position
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `pattern` `string` The foreground color pattern
+
+### Returns
+* `Image` `self` The Image instance
+
+## Image:setMetadata(key, value)
+Sets the metadata of the image
+
+### Parameters
+* `key` `string` The key of the metadata to set
+* `value` `string` The value of the metadata to set
+
+### Returns
+* `Image` `self` The Image instance
+
+## Image:setPixel(x, y, char, fg, bg)
 Sets the pixel at the specified position
 
 ### Parameters
@@ -172,22 +182,18 @@ Sets the pixel at the specified position
 ### Returns
 * `Image` `self` The Image instance
 
-## Image:Image()
+## Image:setText(x, y, text)
+Sets the text at the specified position
 
-Advances to the next frame in the animation
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `text` `string` The text to set
 
 ### Returns
 * `Image` `self` The Image instance
 
-## Image:Image()
-
-Adds a new frame to the image
-
-### Returns
-* `Image` `self` The Image instance
-
-## Image:Image(frameIndex, frame)
-
+## Image:updateFrame(frameIndex, frame)
 Updates the specified frame with the provided data
 
 ### Parameters
@@ -197,32 +203,4 @@ Updates the specified frame with the provided data
 ### Returns
 * `Image` `self` The Image instance
 
-## Image:Image(frameIndex)
 
-Gets the specified frame
-
-### Parameters
-* `frameIndex` `number` The index of the frame to get
-
-### Returns
-* `table` `frame` The frame data
-
-## Image:Image()
-
-Gets the metadata of the image
-
-### Returns
-* `table` `metadata` The metadata of the image
-
-## Image:Image(key, value)
-
-Sets the metadata of the image
-
-### Parameters
-* `key` `string` The key of the metadata to set
-* `value` `string` The value of the metadata to set
-
-### Returns
-* `Image` `self` The Image instance
-
-## Image:Image()
\ No newline at end of file
diff --git a/docs/references/elements/Input.md b/docs/references/elements/Input.md
index 47a34f4..e504848 100644
--- a/docs/references/elements/Input.md
+++ b/docs/references/elements/Input.md
@@ -1,53 +1,44 @@
-# Input
-_This is the input class. It provides a text input field that can handle user input with various features like
-cursor movement, text manipulation, placeholder text, and input validation._
-
-Extends: `VisualElement`
+# Input : VisualElement
+This is the input class. It provides a text input field that can handle user input with various features like
+cursor movement, text manipulation, placeholder text, and input validation.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|text|string|-|The current text content of the input|
-|cursorPos|number|1|The current cursor position in the text|
-|viewOffset|number|0|The horizontal scroll offset for viewing long text|
-|placeholder|string|...|Text to display when input is empty|
-|placeholderColor|color|gray|Color of the placeholder text|
-|focusedBackground|color|blue|Background color when input is focused|
-|focusedForeground|color|white|Foreground color when input is focused|
-|cursorColor|number|nil|Color of the cursor|
-|replaceChar|string|nil|Character to replace the input with (for password fields)|
+|text|string|-|The current text content of the input
+|cursorPos|number|1|The current cursor position in the text
+|viewOffset|number|0|The horizontal scroll offset for viewing long text
+|maxLength|number?|nil|Maximum length of input text (optional)
+|placeholder|string|...|Text to display when input is empty
+|placeholderColor|color|gray|Color of the placeholder text
+|focusedBackground|color|blue|Background color when input is focused
+|focusedForeground|color|white|Foreground color when input is focused
+|pattern|string?|nil|Regular expression pattern for input validation
+|cursorColor|number|nil|Color of the cursor
+|replaceChar|string|nil|Character to replace the input with (for password fields)
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Input.new](#input-new)|Input|Creates a new Input instance|
-|[Input:Input](#input-input-props-basalt)|Input|Initializes the Input instance|
-|[Input:Input](#input-input-x-y-blink-color)|-|Sets the cursor position and color|
-|[Input:Input](#input-input-char)|boolean|Handles char events|
-|[Input:Input](#input-input-key)|boolean|Handles key events|
-|[Input:Input](#input-input-button-x-y)|boolean|Handles mouse click events|
-|[Input:Input](#input-input)|Input|Updates the input's viewport|
-|[Input:Input](#input-input)|-|Handles a focus event|
-|[Input:Input](#input-input)|-|Handles a blur event|
-|[Input:Input](#input-input)|-|Handles paste events|
-|[Input:Input](#input-input)|-|Renders the input element|
+|[Input:setCursor](#input-setcursor)|-|Sets the cursor position and color
+|[Input:updateViewport](#input-updateviewport)|Input|Updates the input's viewport
 
-## Input.new()
-### Returns
-* `Input` `object` The newly created Input instance
 
-## Input:Input(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+## Protected Functions
 
-### Returns
-* `Input` `self` The initialized instance
-
-## Input:Input(x, y, blink, color)
+|Method|Returns|Description|
+|---|---|---|
+|Input:blur|-|Handles a blur event
+|Input:char|boolean|Handles char events
+|Input:focus|-|Handles a focus event
+|Input:init|Input|Initializes the Input instance
+|Input:key|boolean|Handles key events
+|Input:mouse_click|boolean|Handles mouse click events
+|Input:render|-|Renders the input element
 
+## Input:setCursor(x, y, blink, color)
 Sets the cursor position and color
 
 ### Parameters
@@ -56,37 +47,10 @@ Sets the cursor position and color
 * `blink` `boolean` Whether the cursor should blink
 * `color` `number` The color of the cursor
 
-## Input:Input(char)
-### Parameters
-* `char` `string` The character that was typed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Input:Input(key)
-### Parameters
-* `key` `number` The key that was pressed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Input:Input(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Input:Input()
-
+## Input:updateViewport()
 Updates the input's viewport
 
 ### Returns
 * `Input` `self` The updated instance
 
-## Input:Input()
-## Input:Input()
-## Input:Input()
-## Input:Input()
\ No newline at end of file
+
diff --git a/docs/references/elements/Label.md b/docs/references/elements/Label.md
index 19b21d5..dcba3e3 100644
--- a/docs/references/elements/Label.md
+++ b/docs/references/elements/Label.md
@@ -1,45 +1,32 @@
-# Label
-_This is the label class. It provides a simple text display element that automatically
-resizes its width based on the text content._
-
-Extends: `VisualElement`
+# Label : VisualElement
+This is the label class. It provides a simple text display element that automatically
+resizes its width based on the text content.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|text|string|Label|The text content to display. Can be a string or a function that returns a string|
-|autoSize|boolean|true|Whether the label should automatically resize its width based on the text content|
+|text|string|Label|The text content to display. Can be a string or a function that returns a string
+|autoSize|boolean|true|Whether the label should automatically resize its width based on the text content
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Label.new](#label-new)|Label|Creates a new Label instance|
-|[Label:Label](#label-label-props-basalt)|Label|Initializes the Label instance|
-|[Label:Label](#label-label)|table|Gets the wrapped lines of the Label|
-|[Label:Label](#label-label)|-|Renders the Label by drawing its text content|
+|[Label:getWrappedText](#label-getwrappedtext)|table|Gets the wrapped lines of the Label
 
-## Label.new()
 
-Creates a new Label instance
+## Protected Functions
 
-### Returns
-* `Label` `self` The newly created Label instance
-
-## Label:Label(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Label` `self` The initialized instance
-
-## Label:Label()
+|Method|Returns|Description|
+|---|---|---|
+|Label:init|Label|Initializes the Label instance
+|Label:render|-|Renders the Label by drawing its text content
 
+## Label:getWrappedText()
 Gets the wrapped lines of the Label
 
 ### Returns
 * `table` `wrappedText` The wrapped lines of the Label
 
-## Label:Label()
\ No newline at end of file
+
diff --git a/docs/references/elements/LineChart.md b/docs/references/elements/LineChart.md
index 8d707f9..9ee4c28 100644
--- a/docs/references/elements/LineChart.md
+++ b/docs/references/elements/LineChart.md
@@ -1,29 +1,28 @@
-# LineChart
-_The Line Chart element visualizes data series as connected line graphs. It plots points on a coordinate system and connects them with lines._
+# LineChart : Graph
+The Line Chart element visualizes data series as connected line graphs. It plots points on a coordinate system and connects them with lines.
 
-Extends: `Graph`
+### Usage
+ ```lua
+local chart = main:addLineChart()
+:addSeries("input", " ", colors.green, colors.green, 10)
+:addSeries("output", " ", colors.red, colors.red, 10)
 
-## Functions
+basalt.schedule(function()
+while true do
+chart:addPoint("input", math.random(1,100))
+chart:addPoint("output", math.random(1,100))
+sleep(2)
+end
+end)
+```
+
+
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[LineChart.new](#linechart-new)|LineChart|Creates a new LineChart instance|
-|[LineChart:LineChart](#linechart-linechart-props-basalt)|LineChart|Initializes the LineChart instance|
-|[LineChart:LineChart](#linechart-linechart)|-|Renders the LineChart|
+|LineChart:init|LineChart|Initializes the LineChart instance
+|LineChart:render|-|Renders the LineChart
 
-## LineChart.new()
 
-Creates a new LineChart instance
-
-### Returns
-* `LineChart` `self` The newly created LineChart instance
-
-## LineChart:LineChart(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `LineChart` `self` The initialized instance
-
-## LineChart:LineChart()
\ No newline at end of file
diff --git a/docs/references/elements/List.md b/docs/references/elements/List.md
index 9af26e2..fc408b9 100644
--- a/docs/references/elements/List.md
+++ b/docs/references/elements/List.md
@@ -1,19 +1,17 @@
-# List
-_This is the list class. It provides a scrollable list of selectable items with support for 
-custom item rendering, separators, and selection handling._
-
-Extends: `VisualElement`
+# List : VisualElement
+This is the list class. It provides a scrollable list of selectable items with support for 
+custom item rendering, separators, and selection handling.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|items|table|{}|List of items to display. Items can be tables with properties including selected state|
-|selectable|boolean|true|Whether items in the list can be selected|
-|multiSelection|boolean|false|Whether multiple items can be selected at once|
-|offset|number|0|Current scroll offset for viewing long lists|
-|selectedBackground|color|blue|Background color for selected items|
-|selectedForeground|color|white|Text color for selected items|
+|items|table|{}|List of items to display. Items can be tables with properties including selected state
+|selectable|boolean|true|Whether items in the list can be selected
+|multiSelection|boolean|false|Whether multiple items can be selected at once
+|offset|number|0|Current scroll offset for viewing long lists
+|selectedBackground|color|blue|Background color for selected items
+|selectedForeground|color|white|Text color for selected items
 
 ## Events
 
@@ -25,37 +23,26 @@ Extends: `VisualElement`
 
 |Method|Returns|Description|
 |---|---|---|
-|[List.new](#list-new)|List|Creates a new List instance|
-|[List:List](#list-list-props-basalt)|List|Initializes the List instance|
-|[List:List](#list-list-text)|List|Adds an item to the list|
-|[List:List](#list-list-index)|List|Removes an item from the list|
-|[List:List](#list-list)|List|Clears all items from the list|
-|[List:List](#list-list)|table|Gets the currently selected items|
-|[List:List](#list-list)|selected|Gets first selected item|
-|[List:List](#list-list-button-x-y)|boolean|Handles mouse click events|
-|[List:List](#list-list-direction-x-y)|boolean|Handles mouse scroll events|
-|[List:List](#list-list-callback)|List|Registers a callback for the select event|
-|[List:List](#list-list)|List|Scrolls the list to the bottom|
-|[List:List](#list-list)|List|Scrolls the list to the top|
-|[List:List](#list-list)|-|Renders the list|
+|[List:addItem](#list-additem)|List|Adds an item to the list
+|[List:clear](#list-clear)|List|Clears all items from the list
+|[List:getSelectedItem](#list-getselecteditem)|table?|Gets first selected item
+|[List:getSelectedItems](#list-getselecteditems)|table|Gets the currently selected items
+|[List:onSelect](#list-onselect)|List|Registers a callback for the select event
+|[List:removeItem](#list-removeitem)|List|Removes an item from the list
+|[List:scrollToBottom](#list-scrolltobottom)|List|Scrolls the list to the bottom
+|[List:scrollToTop](#list-scrolltotop)|List|Scrolls the list to the top
 
-## List.new()
 
-Creates a new List instance
+## Protected Functions
 
-### Returns
-* `List` `self` The newly created List instance
-
-## List:List(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `List` `self` The initialized instance
-
-## List:List(text)
+|Method|Returns|Description|
+|---|---|---|
+|List:init|List|Initializes the List instance
+|List:mouse_click|boolean|Handles mouse click events
+|List:mouse_scroll|boolean|Handles mouse scroll events
+|List:render|-|Renders the list
 
+## List:addItem(text)
 Adds an item to the list
 
 ### Parameters
@@ -65,77 +52,40 @@ Adds an item to the list
 * `List` `self` The List instance
 
 ### Usage
-```lua
+ ```lua
 list:addItem("New Item")
 list:addItem({text="Item", callback=function() end})
 ```
 
-## List:List(index)
-
-Removes an item from the list
-
-### Parameters
-* `index` `number` The index of the item to remove
-
-### Returns
-* `List` `self` The List instance
-
-### Usage
-```lua
-list:removeItem(1)
-```
-
-## List:List()
-
+## List:clear()
 Clears all items from the list
 
 ### Returns
 * `List` `self` The List instance
 
 ### Usage
-```lua
+ ```lua
 list:clear()
 ```
 
-## List:List()
+## List:getSelectedItem()
+Gets first selected item
 
+### Returns
+* `table?` `selected` The first item
+
+## List:getSelectedItems()
 Gets the currently selected items
 
 ### Returns
 * `table` `selected` List of selected items
 
 ### Usage
-```lua
+ ```lua
 local selected = list:getSelectedItems()
 ```
 
-## List:List()
-
-Gets first selected item
-
-### Returns
-* `selected` `The` first item
-
-## List:List(button, x, y)
-### Parameters
-* `button` `number` The mouse button that was clicked
-* `x` `number` The x-coordinate of the click
-* `y` `number` The y-coordinate of the click
-
-### Returns
-* `boolean` `Whether` the event was handled
-
-## List:List(direction, x, y)
-### Parameters
-* `direction` `number` The direction of the scroll (1 for down, -1 for up)
-* `x` `number` The x-coordinate of the scroll
-* `y` `number` The y-coordinate of the scroll
-
-### Returns
-* `boolean` `Whether` the event was handled
-
-## List:List(callback)
-
+## List:onSelect(callback)
 Registers a callback for the select event
 
 ### Parameters
@@ -145,22 +95,34 @@ Registers a callback for the select event
 * `List` `self` The List instance
 
 ### Usage
-```lua
+ ```lua
 list:onSelect(function(index, item) print("Selected item:", index, item) end)
 ```
 
-## List:List()
+## List:removeItem(index)
+Removes an item from the list
 
+### Parameters
+* `index` `number` The index of the item to remove
+
+### Returns
+* `List` `self` The List instance
+
+### Usage
+ ```lua
+list:removeItem(1)
+```
+
+## List:scrollToBottom()
 Scrolls the list to the bottom
 
 ### Returns
 * `List` `self` The List instance
 
-## List:List()
-
+## List:scrollToTop()
 Scrolls the list to the top
 
 ### Returns
 * `List` `self` The List instance
 
-## List:List()
\ No newline at end of file
+
diff --git a/docs/references/elements/Menu.md b/docs/references/elements/Menu.md
index c75cfbd..77c9a00 100644
--- a/docs/references/elements/Menu.md
+++ b/docs/references/elements/Menu.md
@@ -1,61 +1,40 @@
-# Menu
-_This is the menu class. It provides a horizontal menu bar with selectable items.
-Menu items are displayed in a single row and can have custom colors and callbacks._
-
-Extends: `List`
+# Menu : List
+This is the menu class. It provides a horizontal menu bar with selectable items.
+Menu items are displayed in a single row and can have custom colors and callbacks.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|separatorColor|color|gray|The color used for separator items in the menu|
+|separatorColor|color|gray|The color used for separator items in the menu
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Menu.new](#menu-new)|Menu|Creates a new Menu instance|
-|[Menu:Menu](#menu-menu-props-basalt)|Menu|Initializes the Menu instance|
-|[Menu:Menu](#menu-menu-items)|Menu|Sets the menu items and calculates total width|
-|[Menu:Menu](#menu-menu)|-|Renders the menu horizontally with proper spacing and colors|
-|[Menu:Menu](#menu-menu-button-x-y)|boolean|Handles mouse click events and item selection|
+|[Menu:setItems](#menu-setitems)|Menu|Sets the menu items and calculates total width
 
-## Menu.new()
 
-Creates a new Menu instance
+## Protected Functions
 
-### Returns
-* `Menu` `self` The newly created Menu instance
-
-## Menu:Menu(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Menu` `self` The initialized instance
-
-## Menu:Menu(items)
+|Method|Returns|Description|
+|---|---|---|
+|Menu:init|Menu|Initializes the Menu instance
+|Menu:mouse_click|boolean|Handles mouse click events and item selection
+|Menu:render|-|Renders the menu horizontally with proper spacing and colors
 
+## Menu:setItems(items)
 Sets the menu items
 
 ### Parameters
-* `items` `table` [] List of items with {text, separator, callback, foreground, background} properties
+* `items` `table[]` List of items with {text, separator, callback, foreground, background} properties
 
 ### Returns
 * `Menu` `self` The Menu instance
 
 ### Usage
-```lua
+ ```lua
 menu:setItems({{text="File"}, {separator=true}, {text="Edit"}})
 ```
 
-## Menu:Menu()
-## Menu:Menu(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
 
-### Returns
-* `boolean` `Whether` the event was handled
diff --git a/docs/references/elements/Program.md b/docs/references/elements/Program.md
index 0c37e51..569279a 100644
--- a/docs/references/elements/Program.md
+++ b/docs/references/elements/Program.md
@@ -1,112 +1,37 @@
-# Program
-_This is the program class. It provides a program that runs in a window._
-
-Extends: `VisualElement`
+# Program : VisualElement
+This is the program class. It provides a program that runs in a window.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|program|table|nil|The program instance|
-|path|string|""|The path to the program|
-|running|boolean|false|Whether the program is running|
-|errorCallback|function|nil|The error callback function|
-|doneCallback|function|nil|The done callback function|
+|program|table|nil|The program instance
+|path|string|""|The path to the program
+|running|boolean|false|Whether the program is running
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Program.new](#program-new)|-||
-|[Program:BasaltProgram](#program-basaltprogram)|-||
-|[Program:BasaltProgram](#program-basaltprogram)|-||
-|[Program:BasaltProgram](#program-basaltprogram)|-||
-|[Program:BasaltProgram](#program-basaltprogram)|-||
-|[Program.new](#program-new)|Program|Creates a new Program instance|
-|[Program:Program](#program-program-props-basalt)|Program|Initializes the Program instance|
-|[Program:Program](#program-program-path-env-addenvironment)|Program|Executes a program|
-|[Program:Program](#program-program)|Program|Stops the program|
-|[Program:Program](#program-program-event-any)|Program|Sends an event to the program|
-|[Program:Program](#program-program-fn)|Program|Registers a callback for the program's error event|
-|[Program:Program](#program-program-fn)|Program|Registers a callback for the program's done event|
-|[Program:Program](#program-program-event-any)|any|Handles all incomming events|
-|[Program:Program](#program-program)|-|Gets called when the element gets focused|
-|[Program:Program](#program-program)|-|Renders the program|
+|[Program:execute](#program-execute)|Program|Executes a program
 
-## Program.new()
-## Program:BasaltProgram()
-## Program:BasaltProgram()
-## Program:BasaltProgram()
-## Program:BasaltProgram()
-## Program.new()
-### Returns
-* `Program` `object` The newly created Program instance
 
-## Program:Program(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
+## Protected Functions
 
-### Returns
-* `Program` `self` The initialized instance
-
-## Program:Program(path, env?, addEnvironment?)
+|Method|Returns|Description|
+|---|---|---|
+|Program:dispatchEvent|any|Handles all incomming events
+|Program:focus|-|Gets called when the element gets focused
+|Program:init|Program|Initializes the Program instance
+|Program:render|-|Renders the program
 
+## Program:execute(path)
 Executes a program
 
 ### Parameters
 * `path` `string` The path to the program
-* `env` *(optional)* `table` The environment to run the program in
-* `addEnvironment` *(optional)* `boolean` Whether to add the environment to the program's environment (false = overwrite instead of adding)
 
 ### Returns
 * `Program` `self` The Program instance
 
-## Program:Program()
 
-Stops the program
-
-### Returns
-* `Program` `self` The Program instance
-
-## Program:Program(event, any)
-
-Sends an event to the program
-
-### Parameters
-* `event` `string` The event to send
-* `any` `The` event arguments
-
-### Returns
-* `Program` `self` The Program instance
-
-## Program:Program(fn)
-
-Registers a callback for the program's error event, if the function returns false, the program won't stop
-
-### Parameters
-* `fn` `function` The callback function to register
-
-### Returns
-* `Program` `self` The Program instance
-
-## Program:Program(fn)
-
-Registers a callback for the program's done event
-
-### Parameters
-* `fn` `function` The callback function to register
-
-### Returns
-* `Program` `self` The Program instance
-
-## Program:Program(event, any)
-### Parameters
-* `event` `string` The event to handle
-* `any` `The` event arguments
-
-### Returns
-* `any` `result` The event result
-
-## Program:Program()
-## Program:Program()
\ No newline at end of file
diff --git a/docs/references/elements/ProgressBar.md b/docs/references/elements/ProgressBar.md
index ba8be31..8c3d800 100644
--- a/docs/references/elements/ProgressBar.md
+++ b/docs/references/elements/ProgressBar.md
@@ -1,39 +1,30 @@
-# ProgressBar
-_This is the progress bar class. It provides a visual representation of progress
-with optional percentage display and customizable colors._
+# ProgressBar : VisualElement
+This is the progress bar class. It provides a visual representation of progress
+with optional percentage display and customizable colors.
+
+### Usage
+ ```lua
+local progressBar = main:addProgressBar()
+progressBar:setDirection("up") 
+progressBar:setProgress(50)
+```
 
-Extends: `VisualElement`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|progress|number|0|Current progress value (0-100)|
-|showPercentage|boolean|false|Whether to show the percentage text in the center|
-|progressColor|color|lime|The color used for the filled portion of the progress bar|
-|direction|string|right|The direction of the progress bar ("up", "down", "left", "right")|
+|progress|number|0|Current progress value (0-100)
+|showPercentage|boolean|false|Whether to show the percentage text in the center
+|progressColor|color|lime|The color used for the filled portion of the progress bar
+|direction|string|right|The direction of the progress bar ("up", "down", "left", "right")
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[ProgressBar.new](#progressbar-new)|ProgressBar|Creates a new ProgressBar instance|
-|[ProgressBar:ProgressBar](#progressbar-progressbar-props-basalt)|ProgressBar|Initializes the ProgressBar instance|
-|[ProgressBar:ProgressBar](#progressbar-progressbar)|-|Renders the progress bar with filled portion and optional percentage text|
+|ProgressBar:init|ProgressBar|Initializes the ProgressBar instance
+|ProgressBar:render|-|Renders the progress bar with filled portion and optional percentage text
 
-## ProgressBar.new()
 
-Creates a new ProgressBar instance
-
-### Returns
-* `ProgressBar` `self` The newly created ProgressBar instance
-
-## ProgressBar:ProgressBar(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `ProgressBar` `self` The initialized instance
-
-## ProgressBar:ProgressBar()
\ No newline at end of file
diff --git a/docs/references/elements/Scrollbar.md b/docs/references/elements/Scrollbar.md
index b22834a..924fc53 100644
--- a/docs/references/elements/Scrollbar.md
+++ b/docs/references/elements/Scrollbar.md
@@ -1,97 +1,58 @@
-# ScrollBar
-_A ScrollBar element that can be attached to other elements to control their scroll properties_
-
-Extends: `VisualElement`
+# Scrollbar : VisualElement
+A scrollbar element that can be attached to other elements to control their scroll properties
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|value|number|0|Current scroll value|
-|min|number|0|Minimum scroll value|
-|max|number|100|Maximum scroll value|
-|step|number|1|Step size for scroll operations|
-|dragMultiplier|number|1|How fast the ScrollBar moves when dragging|
-|symbol|string|"|" Symbol used for the ScrollBar handle|
-|backgroundSymbol|string|"\127"|Symbol used for the ScrollBar background|
-|symbolBackgroundColor|color|black|Background color of the ScrollBar handle|
-|backgroundSymbol|string|"\127"|Symbol used for the ScrollBar background|
-|minValue|number|function|0|Minimum value or function that returns it|
-|maxValue|number|function|100|Maximum value or function that returns it|
-|orientation|string|vertical|Orientation of the ScrollBar ("vertical" or "horizontal")|
-|handleSize|number|2|Size of the ScrollBar handle in characters|
+|value|number|0|Current scroll value
+|min|number|0|Minimum scroll value
+|max|number|100|Maximum scroll value
+|step|number|1|Step size for scroll operations
+|dragMultiplier|number|1|How fast the scrollbar moves when dragging
+|symbol|string|"|" Symbol used for the scrollbar handle
+|backgroundSymbol|string|"\127"|Symbol used for the scrollbar background
+|symbolBackgroundColor|color|black|Background color of the scrollbar handle
+|backgroundSymbol|string|"\127"|Symbol used for the scrollbar background
+|attachedElement|table?|nil|The element this scrollbar is attached to
+|attachedProperty|string?|nil|The property being controlled
+|minValue|number|function|0|Minimum value or function that returns it
+|maxValue|number|function|100|Maximum value or function that returns it
+|orientation|string|vertical|Orientation of the scrollbar ("vertical" or "horizontal")
+|handleSize|number|2|Size of the scrollbar handle in characters
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[ScrollBar.new](#scrollbar-new)|ScrollBar|Creates a new ScrollBar instance|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar-props-basalt)|ScrollBar|Initializes the ScrollBar instance|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar-element-config)|ScrollBar|Attaches the ScrollBar to an element's property|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar)|ScrollBar|Updates the attached element's property based on the ScrollBar value|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar-button-x-y)|boolean|Handles mouse click events|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar-button-x-y)|boolean|Handles mouse drag events|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar-direction-x-y)|boolean|Handles mouse scroll events|
-|[ScrollBar:ScrollBar](#scrollbar-scrollbar)|-|Renders the ScrollBar|
+|[Scrollbar:attach](#scrollbar-attach)|Scrollbar|Attaches the scrollbar to an element's property
+|[Scrollbar:updateAttachedElement](#scrollbar-updateattachedelement)|Scrollbar|Updates the attached element's property based on the scrollbar value
 
-## ScrollBar.new()
 
-Creates a new ScrollBar instance
+## Protected Functions
 
-### Returns
-* `ScrollBar` `self` The newly created ScrollBar instance
+|Method|Returns|Description|
+|---|---|---|
+|Scrollbar:init|Scrollbar|Initializes the Scrollbar instance
+|Scrollbar:mouse_click|boolean|Handles mouse click events
+|Scrollbar:mouse_drag|boolean|Handles mouse drag events
+|Scrollbar:mouse_scroll|boolean|Handles mouse scroll events
+|Scrollbar:render|-|Renders the scrollbar
 
-## ScrollBar:ScrollBar(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `ScrollBar` `self` The initialized instance
-
-## ScrollBar:ScrollBar(element, config)
-
-Attaches the ScrollBar to an element's property
+## Scrollbar:attach(element, config)
+Attaches the scrollbar to an element's property
 
 ### Parameters
 * `element` `BaseElement` The element to attach to
 * `config` `table` Configuration {property = "propertyName", min = number|function, max = number|function}
 
 ### Returns
-* `ScrollBar` `self` The ScrollBar instance
+* `Scrollbar` `self` The scrollbar instance
 
-## ScrollBar:ScrollBar()
-
-Updates the attached element's property based on the ScrollBar value
+## Scrollbar:updateAttachedElement()
+Updates the attached element's property based on the scrollbar value
 
 ### Returns
-* `ScrollBar` `self` The ScrollBar instance
+* `Scrollbar` `self` The scrollbar instance
 
-## ScrollBar:ScrollBar(button, x, y)
-### Parameters
-* `button` `number` The mouse button clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
 
-### Returns
-* `boolean` `Whether` the event was handled
-
-## ScrollBar:ScrollBar(button, x, y)
-### Parameters
-* `button` `number` The mouse button being dragged
-* `x` `number` The x position of the drag
-* `y` `number` The y position of the drag
-
-### Returns
-* `boolean` `Whether` the event was handled
-
-## ScrollBar:ScrollBar(direction, x, y)
-### Parameters
-* `direction` `number` The scroll direction (1 for up, -1 for down)
-* `x` `number` The x position of the scroll
-* `y` `number` The y position of the scroll
-
-### Returns
-* `boolean` `Whether` the event was handled
-
-## ScrollBar:ScrollBar()
\ No newline at end of file
diff --git a/docs/references/elements/Slider.md b/docs/references/elements/Slider.md
index e03377a..0a8e289 100644
--- a/docs/references/elements/Slider.md
+++ b/docs/references/elements/Slider.md
@@ -1,18 +1,16 @@
-# Slider
-_This is the slider class. It provides a draggable slider control that can be either horizontal or vertical,
-with customizable colors and value ranges._
-
-Extends: `VisualElement`
+# Slider : VisualElement
+This is the slider class. It provides a draggable slider control that can be either horizontal or vertical,
+with customizable colors and value ranges.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|step|number|1|Current position of the slider handle (1 to width/height)|
-|max|number|100|Maximum value for value conversion (maps slider position to this range)|
-|horizontal|boolean|true|Whether the slider is horizontal (false for vertical)|
-|barColor|color|gray|Color of the slider track|
-|sliderColor|color|blue|Color of the slider handle|
+|step|number|1|Current position of the slider handle (1 to width/height)
+|max|number|100|Maximum value for value conversion (maps slider position to this range)
+|horizontal|boolean|true|Whether the slider is horizontal (false for vertical)
+|barColor|color|gray|Color of the slider track
+|sliderColor|color|blue|Color of the slider handle
 
 ## Events
 
@@ -24,56 +22,27 @@ Extends: `VisualElement`
 
 |Method|Returns|Description|
 |---|---|---|
-|[Slider.new](#slider-new)|Slider|Creates a new Slider instance|
-|[Slider:Slider](#slider-slider-props-basalt)|Slider|Initializes the Slider instance|
-|[Slider:Slider](#slider-slider)|number|Gets the current value mapped to the max range|
-|[Slider:Slider](#slider-slider-button-x-y)|boolean|Updates slider position on mouse click|
-|[Slider:Slider](#slider-slider-button-x-y)|boolean|Handles mouse release events|
-|[Slider:Slider](#slider-slider)|-|Renders the slider with track and handle|
+|[Slider:getValue](#slider-getvalue)|number|Gets the current value mapped to the max range
 
-## Slider.new()
 
-Creates a new Slider instance
+## Protected Functions
 
-### Returns
-* `Slider` `self` The newly created Slider instance
-
-## Slider:Slider(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Slider` `self` The initialized instance
-
-## Slider:Slider()
+|Method|Returns|Description|
+|---|---|---|
+|Slider:init|Slider|Initializes the Slider instance
+|Slider:mouse_click|boolean|Updates slider position on mouse click
+|Slider:mouse_scroll|boolean|Handles mouse release events
+|Slider:render|-|Renders the slider with track and handle
 
+## Slider:getValue()
 Gets the current value of the slider
 
 ### Returns
 * `number` `value` The current value (0 to max)
 
 ### Usage
-```lua
+ ```lua
 local value = slider:getValue()
 ```
 
-## Slider:Slider(button, x, y)
-### Parameters
-* `button` `number` The mouse button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
 
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Slider:Slider(button, x, y)
-### Parameters
-* `button` `number` The mouse button that was released
-* `x` `number` The x position of the release
-* `y` `number` The y position of the release
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Slider:Slider()
\ No newline at end of file
diff --git a/docs/references/elements/Switch.md b/docs/references/elements/Switch.md
index ba9861d..a7b4e96 100644
--- a/docs/references/elements/Switch.md
+++ b/docs/references/elements/Switch.md
@@ -1,29 +1,18 @@
-# Switch
-_The Switch is a standard Switch element with click handling and state management._
-
-Extends: `VisualElement`
+# Switch : VisualElement
+The Switch is a standard Switch element with click handling and state management.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|checked|boolean|Whether|switch is checked|
+|checked|boolean|Whether|switch is checked
 
-## Functions
+
+## Protected Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Switch.new](#switch-new)|table|Creates a new Switch instance|
-|[Switch:Switch](#switch-switch-props-basalt)|-|Initializes the Switch instance|
-|[Switch:Switch](#switch-switch)|-|Renders the Switch|
+|Switch:init|-|Initializes the Switch instance
+|Switch:render|-|Renders the Switch
 
-## Switch.new()
-### Returns
-* `table` `self` The created instance
 
-## Switch:Switch(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## Switch:Switch()
\ No newline at end of file
diff --git a/docs/references/elements/TabControl.md b/docs/references/elements/TabControl.md
new file mode 100644
index 0000000..e69de29
diff --git a/docs/references/elements/Table.md b/docs/references/elements/Table.md
index 3577e64..b290768 100644
--- a/docs/references/elements/Table.md
+++ b/docs/references/elements/Table.md
@@ -1,97 +1,53 @@
-# Table
-_This is the table class. It provides a sortable data grid with customizable columns,
-row selection, and scrolling capabilities._
+# Table : VisualElement
+This is the table class. It provides a sortable data grid with customizable columns,
+row selection, and scrolling capabilities.
+
+### Usage
+ ```lua
+local people = container:addTable():setWidth(40)
+people:setColumns({{name="Name",width=12}, {name="Age",width=10}, {name="Country",width=15}})
+people:setData({{"Alice", 30, "USA"}, {"Bob", 25, "UK"}})
+```
 
-Extends: `VisualElement`
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|columns|table|{}|List of column definitions with {name, width} properties|
-|data|table|{}|The table data as array of row arrays|
-|headerColor|color|blue|Color of the column headers|
-|selectedColor|color|lightBlue|Background color of selected row|
-|gridColor|color|gray|Color of grid lines|
-|sortDirection|string|"asc"|Sort direction ("asc" or "desc")|
-|scrollOffset|number|0|Current scroll position|
+|columns|table|{}|List of column definitions with {name, width} properties
+|data|table|{}|The table data as array of row arrays
+|selectedRow|number?|nil|Currently selected row index
+|headerColor|color|blue|Color of the column headers
+|selectedColor|color|lightBlue|Background color of selected row
+|gridColor|color|gray|Color of grid lines
+|sortColumn|number?|nil|Currently sorted column index
+|sortDirection|string|"asc"|Sort direction ("asc" or "desc")
+|scrollOffset|number|0|Current scroll position
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Table.new](#table-new)|Table|Creates a new Table instance|
-|[Table:Table](#table-table-props-basalt)|Table|Initializes the Table instance|
-|[Table:Table](#table-table-name-width)|Table|Adds a new column to the table|
-|[Table:Table](#table-table-any)|Table|Adds a new row of data to the table|
-|[Table:Table](#table-table-columnindex-fn)|Table|Sorts the table data by the specified column|
-|[Table:Table](#table-table-button-x-y)|boolean|Handles header clicks for sorting and row selection|
-|[Table:Table](#table-table-direction-x-y)|boolean|Handles scrolling through the table data|
-|[Table:Table](#table-table)|-|Renders the table with headers, data and scrollbar|
+|[Table:sortData](#table-sortdata)|Table|Sorts the table data by the specified column
 
-## Table.new()
 
-Creates a new Table instance
+## Protected Functions
 
-### Returns
-* `Table` `self` The newly created Table instance
-
-## Table:Table(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Table` `self` The initialized instance
-
-## Table:Table(name, width)
-
-Adds a new column to the table
-
-### Parameters
-* `name` `string` The name of the column
-* `width` `number` The width of the column
-
-### Returns
-* `Table` `self` The Table instance
-
-## Table:Table(any)
-
-Adds a new row of data to the table
-
-### Parameters
-* `any` `The` data for the new row
-
-### Returns
-* `Table` `self` The Table instance
-
-## Table:Table(columnIndex, fn)
+|Method|Returns|Description|
+|---|---|---|
+|Table:init|Table|Initializes the Table instance
+|Table:mouse_click|boolean|Handles header clicks for sorting and row selection
+|Table:mouse_scroll|boolean|Handles scrolling through the table data
+|Table:render|-|Renders the table with headers, data and scrollbar
 
+## Table:sortData(columnIndex, fn)
 Sorts the table data by column
 
 ### Parameters
 * `columnIndex` `number` The index of the column to sort by
-* `fn` `function` ? Optional custom sorting function
+* `fn` `function?` Optional custom sorting function
 
 ### Returns
 * `Table` `self` The Table instance
 
-## Table:Table(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
 
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Table:Table(direction, x, y)
-### Parameters
-* `direction` `number` The scroll direction (-1 up, 1 down)
-* `x` `number` The x position of the scroll
-* `y` `number` The y position of the scroll
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Table:Table()
\ No newline at end of file
diff --git a/docs/references/elements/TextBox.md b/docs/references/elements/TextBox.md
index ec2641d..3058738 100644
--- a/docs/references/elements/TextBox.md
+++ b/docs/references/elements/TextBox.md
@@ -1,55 +1,41 @@
-# TextBox
-_A multi-line text editor component with cursor support and text manipulation features_
-
-Extends: `VisualElement`
+# TextBox : VisualElement
+A multi-line text editor component with cursor support and text manipulation features
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|lines|table|{}|Array of text lines|
-|cursorX|number|1|Cursor X position|
-|cursorY|number|1|Cursor Y position (line number)|
-|scrollX|number|0|Horizontal scroll offset|
-|scrollY|number|0|Vertical scroll offset|
-|editable|boolean|true|Whether text can be edited|
-|syntaxPatterns|table|{}|Syntax highlighting patterns|
-|cursorColor|number|nil|Color of the cursor|
+|lines|table|{}|Array of text lines
+|cursorX|number|1|Cursor X position
+|cursorY|number|1|Cursor Y position (line number)
+|scrollX|number|0|Horizontal scroll offset
+|scrollY|number|0|Vertical scroll offset
+|editable|boolean|true|Whether text can be edited
+|syntaxPatterns|table|{}|Syntax highlighting patterns
+|cursorColor|number|nil|Color of the cursor
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[TextBox.new](#textbox-new)|TextBox|Creates a new TextBox instance|
-|[TextBox:TextBox](#textbox-textbox-props-basalt)|TextBox|Initializes the TextBox instance|
-|[TextBox:TextBox](#textbox-textbox-pattern-color)|TextBox|Adds a new syntax highlighting pattern|
-|[TextBox:TextBox](#textbox-textbox)|TextBox|Updates the viewport to keep the cursor in view|
-|[TextBox:TextBox](#textbox-textbox-char)|boolean|Handles character input|
-|[TextBox:TextBox](#textbox-textbox-key)|boolean|Handles key events|
-|[TextBox:TextBox](#textbox-textbox-direction-x-y)|boolean|Handles mouse scroll events|
-|[TextBox:TextBox](#textbox-textbox-button-x-y)|boolean|Handles mouse click events|
-|[TextBox:TextBox](#textbox-textbox)|-|Handles paste events|
-|[TextBox:TextBox](#textbox-textbox-text)|TextBox|Sets the text of the TextBox|
-|[TextBox:TextBox](#textbox-textbox)|string|Gets the text of the TextBox|
-|[TextBox:TextBox](#textbox-textbox)|-|Renders the TextBox with syntax highlighting|
+|[TextBox:addSyntaxPattern](#textbox-addsyntaxpattern)|TextBox|Adds a new syntax highlighting pattern
+|[TextBox:getText](#textbox-gettext)|string|Gets the text of the TextBox
+|[TextBox:setText](#textbox-settext)|TextBox|Sets the text of the TextBox
+|[TextBox:updateViewport](#textbox-updateviewport)|TextBox|Updates the viewport to keep the cursor in view
 
-## TextBox.new()
 
-Creates a new TextBox instance
+## Protected Functions
 
-### Returns
-* `TextBox` `self` The newly created TextBox instance
-
-## TextBox:TextBox(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `TextBox` `self` The initialized instance
-
-## TextBox:TextBox(pattern, color)
+|Method|Returns|Description|
+|---|---|---|
+|TextBox:char|boolean|Handles character input
+|TextBox:init|TextBox|Initializes the TextBox instance
+|TextBox:key|boolean|Handles key events
+|TextBox:mouse_click|boolean|Handles mouse click events
+|TextBox:mouse_scroll|boolean|Handles mouse scroll events
+|TextBox:render|-|Renders the TextBox with syntax highlighting
 
+## TextBox:addSyntaxPattern(pattern, color)
 Adds a new syntax highlighting pattern
 
 ### Parameters
@@ -59,48 +45,13 @@ Adds a new syntax highlighting pattern
 ### Returns
 * `TextBox` `self` The TextBox instance
 
-## TextBox:TextBox()
-
-Updates the viewport to keep the cursor in view
+## TextBox:getText()
+Gets the text of the TextBox
 
 ### Returns
-* `TextBox` `self` The TextBox instance
-
-## TextBox:TextBox(char)
-### Parameters
-* `char` `string` The character that was typed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## TextBox:TextBox(key)
-### Parameters
-* `key` `number` The key that was pressed
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## TextBox:TextBox(direction, x, y)
-### Parameters
-* `direction` `number` The scroll direction
-* `x` `number` The x position of the scroll
-* `y` `number` The y position of the scroll
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## TextBox:TextBox(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `handled` Whether the event was handled
-
-## TextBox:TextBox()
-## TextBox:TextBox(text)
+* `string` `text` The text of the TextBox
 
+## TextBox:setText(text)
 Sets the text of the TextBox
 
 ### Parameters
@@ -109,11 +60,10 @@ Sets the text of the TextBox
 ### Returns
 * `TextBox` `self` The TextBox instance
 
-## TextBox:TextBox()
-
-Gets the text of the TextBox
+## TextBox:updateViewport()
+Updates the viewport to keep the cursor in view
 
 ### Returns
-* `string` `text` The text of the TextBox
+* `TextBox` `self` The TextBox instance
+
 
-## TextBox:TextBox()
\ No newline at end of file
diff --git a/docs/references/elements/Tree.md b/docs/references/elements/Tree.md
index 750c2f1..040025b 100644
--- a/docs/references/elements/Tree.md
+++ b/docs/references/elements/Tree.md
@@ -1,65 +1,40 @@
-# Tree
-_This is the tree class. It provides a hierarchical view of nodes that can be expanded and collapsed,
-with support for selection and scrolling._
-
-Extends: `VisualElement`
+# Tree : VisualElement
+This is the tree class. It provides a hierarchical view of nodes that can be expanded and collapsed,
+with support for selection and scrolling.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|nodes|table|{}|The tree structure containing node objects with {text, children} properties|
-|expandedNodes|table|{}|Table of nodes that are currently expanded|
-|scrollOffset|number|0|Current vertical scroll position|
-|horizontalOffset|number|0|Current horizontal scroll position|
-|nodeColor|color|white|Color of unselected nodes|
-|selectedColor|color|lightBlue|Background color of selected node|
+|nodes|table|{}|The tree structure containing node objects with {text, children} properties
+|selectedNode|table?|nil|Currently selected node
+|expandedNodes|table|{}|Table of nodes that are currently expanded
+|scrollOffset|number|0|Current vertical scroll position
+|horizontalOffset|number|0|Current horizontal scroll position
+|nodeColor|color|white|Color of unselected nodes
+|selectedColor|color|lightBlue|Background color of selected node
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Tree.new](#tree-new)|Tree|Creates a new Tree instance|
-|[Tree:Tree](#tree-tree-props-basalt)|Tree|Initializes the Tree instance|
-|[Tree:Tree](#tree-tree-node)|Tree|Expands a node to show its children|
-|[Tree:Tree](#tree-tree-node)|Tree|Collapses a node to hide its children|
-|[Tree:Tree](#tree-tree-node)|Tree|Toggles between expanded and collapsed state|
-|[Tree:Tree](#tree-tree-button-x-y)|boolean|Handles mouse click events for node selection and expansion|
-|[Tree:Tree](#tree-tree-callback)|Tree|Registers a callback for when a node is selected|
-|[Tree:Tree](#tree-tree-direction-x-y)|boolean|Handles mouse scroll events for vertical scrolling|
-|[Tree:Tree](#tree-tree)|number, number|Gets the size of the tree|
-|[Tree:Tree](#tree-tree)|-|Renders the tree with nodes, selection and scrolling|
+|[Tree:collapseNode](#tree-collapsenode)|Tree|Collapses a node to hide its children
+|[Tree:expandNode](#tree-expandnode)|Tree|Expands a node to show its children
+|[Tree:getNodeSize](#tree-getnodesize)|number|Gets the size of the tree
+|[Tree:onSelect](#tree-onselect)|Tree|Registers a callback for when a node is selected
+|[Tree:toggleNode](#tree-togglenode)|Tree|Toggles between expanded and collapsed state
 
-## Tree.new()
 
-Creates a new Tree instance
+## Protected Functions
 
-### Returns
-* `Tree` `self` The newly created Tree instance
-
-## Tree:Tree(props, basalt)
-
-Initializes the Tree instance
-
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-### Returns
-* `Tree` `self` The initialized instance
-
-## Tree:Tree(node)
-
-Expands a node
-
-### Parameters
-* `node` `table` The node to expand
-
-### Returns
-* `Tree` `self` The Tree instance
-
-## Tree:Tree(node)
+|Method|Returns|Description|
+|---|---|---|
+|Tree:init|Tree|Initializes the Tree instance
+|Tree:mouse_click|boolean|Handles mouse click events for node selection and expansion
+|Tree:mouse_scroll|boolean|Handles mouse scroll events for vertical scrolling
+|Tree:render|-|Renders the tree with nodes, selection and scrolling
 
+## Tree:collapseNode(node)
 Collapses a node
 
 ### Parameters
@@ -68,30 +43,23 @@ Collapses a node
 ### Returns
 * `Tree` `self` The Tree instance
 
-## Tree:Tree(node)
-
-Toggles a node's expanded state
+## Tree:expandNode(node)
+Expands a node
 
 ### Parameters
-* `node` `table` The node to toggle
+* `node` `table` The node to expand
 
 ### Returns
 * `Tree` `self` The Tree instance
 
-## Tree:Tree(button, x, y)
-
-Handles mouse click events
-
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
+## Tree:getNodeSize()
+Gets the size of the tree
 
 ### Returns
-* `boolean` `handled` Whether the event was handled
-
-## Tree:Tree(callback)
+* `number` `width` The width of the tree
+* `number` `height` The height of the tree
 
+## Tree:onSelect(callback)
 Registers a callback for when a node is selected
 
 ### Parameters
@@ -100,21 +68,13 @@ Registers a callback for when a node is selected
 ### Returns
 * `Tree` `self` The Tree instance
 
-## Tree:Tree(direction, x, y)
+## Tree:toggleNode(node)
+Toggles a node's expanded state
+
 ### Parameters
-* `direction` `number` The scroll direction (1 for up, -1 for down)
-* `x` `number` The x position of the scroll
-* `y` `number` The y position of the scroll
+* `node` `table` The node to toggle
 
 ### Returns
-* `boolean` `handled` Whether the event was handled
+* `Tree` `self` The Tree instance
 
-## Tree:Tree()
 
-Gets the size of the tree
-
-### Returns
-* `number` `width` The width of the tree
-* `number` `height` The height of the tree
-
-## Tree:Tree()
\ No newline at end of file
diff --git a/docs/references/elements/VisualElement.md b/docs/references/elements/VisualElement.md
index c950da5..ae5c797 100644
--- a/docs/references/elements/VisualElement.md
+++ b/docs/references/elements/VisualElement.md
@@ -1,193 +1,102 @@
-# VisualElement
-_This is the visual element class. It serves as the base class for all visual UI elements
-and provides core functionality for positioning, sizing, colors, and rendering._
-
-Extends: `BaseElement`
+# VisualElement : BaseElement
+This is the visual element class. It serves as the base class for all visual UI elements
+and provides core functionality for positioning, sizing, colors, and rendering.
 
 ## Properties
 
 |Property|Type|Default|Description|
 |---|---|---|---|
-|x|number|1|The horizontal position relative to parent|
-|y|number|1|The vertical position relative to parent|
-|z|number|1|The z-index for layering elements|
-|width|number|1|The width of the element|
-|height|number|1|The height of the element|
-|background|color|black|The background color|
-|foreground|color|white|The text/foreground color|
-|clicked|boolean|false|Whether the element is currently clicked|
-|hover|boolean|false|Whether the mouse is currently hover over the element (Craftos-PC only)|
-|backgroundEnabled|boolean|true|Whether to render the background|
-|focused|boolean|false|Whether the element has input focus|
-|visible|boolean|true|Whether the element is visible|
-|ignoreOffset|boolean|false|Whether to ignore the parent's offset|
+|x|number|1|The horizontal position relative to parent
+|y|number|1|The vertical position relative to parent
+|z|number|1|The z-index for layering elements
+|width|number|1|The width of the element
+|height|number|1|The height of the element
+|background|color|black|The background color
+|foreground|color|white|The text/foreground color
+|clicked|boolean|false|Whether the element is currently clicked
+|hover|boolean|false|Whether the mouse is currently hover over the element (Craftos-PC only)
+|backgroundEnabled|boolean|true|Whether to render the background
+|focused|boolean|false|Whether the element has input focus
+|visible|boolean|true|Whether the element is visible
+|ignoreOffset|boolean|false|Whether to ignore the parent's offset
+
+## Combined Properties
+
+|Name|Properties|Description|
+|---|---|---|
+|position|`x number, y number`|Combined x, y position|
+|size|`width number, height number`|Combined width, height|
+|color|`foreground number, background number`|Combined foreground, background colors|
 
 ## Events
 
 |Event|Parameters|Description|
 |---|---|---|
 |onClick|`button string, x number, y number`|Fired on mouse click|
+|onMouseUp|`button, x, y`|Fired on mouse button release|
+|onRelease|`button, x, y`|Fired when mouse leaves while clicked|
+|onDrag|`button, x, y`|Fired when mouse moves while clicked|
+|onScroll|`direction, x, y`|Fired on mouse scroll|
+|onEnter|`-`|Fired when mouse enters element|
+|onLeave|`-`|Fired when mouse leaves element|
+|onFocus|`-`|Fired when element receives focus|
+|onBlur|`-`|Fired when element loses focus|
+|onKey|`key`|Fired on key press|
+|onKeyUp|`key`|Fired on key release|
+|onChar|`char`|Fired on character input|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[VisualElement.new](#visualelement-new)|VisualElement|Creates a new visual element|
-|[VisualElement:VisualElement](#visualelement-visualelement-props-basalt)|-|Initializes a new visual element with properties|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y-width-height-text-fg-bg)|-|Multi-character drawing with colors|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y-text-fg)|-|Draws text with foreground color|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y-text-bg)|-|Draws text with background color|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y-text-fg-bg)|-|Draws text with both colors|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y)|boolean|Checks if point is within bounds|
-|[VisualElement:VisualElement](#visualelement-visualelement-button-x-y)|boolean|Handles a mouse click event|
-|[VisualElement:VisualElement](#visualelement-visualelement-button-x-y)|boolean|Handles a mouse up event|
-|[VisualElement:VisualElement](#visualelement-visualelement-button-x-y)|-|Handles a mouse release event|
-|[VisualElement:VisualElement](#visualelement-visualelement---x-y)|boolean|Handles a mouse move event|
-|[VisualElement:VisualElement](#visualelement-visualelement-direction-x-y)|boolean|Handles a mouse scroll event|
-|[VisualElement:VisualElement](#visualelement-visualelement-button-x-y)|boolean|Handles a mouse drag event|
-|[VisualElement:VisualElement](#visualelement-visualelement)|-|Handles a focus event|
-|[VisualElement:VisualElement](#visualelement-visualelement)|-|Handles a blur event|
-|[VisualElement:VisualElement](#visualelement-visualelement-key)|-|Handles a key event|
-|[VisualElement:VisualElement](#visualelement-visualelement-key)|-|Handles a key up event|
-|[VisualElement:VisualElement](#visualelement-visualelement-char)|-|Handles a character event|
-|[VisualElement:VisualElement](#visualelement-visualelement)|number, number|Calculates the position of the element|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y)|number, number|Returns the absolute position of the element|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y)|number, number|Returns the relative position of the element|
-|[VisualElement:VisualElement](#visualelement-visualelement-x-y-blink-color)|VisualElement|Sets the cursor position|
-|[VisualElement:VisualElement](#visualelement-visualelement)|VisualElement|Prioritizes the element by moving it to the top of its parent's children|
-|[VisualElement:VisualElement](#visualelement-visualelement)|-|Renders the element|
-|[VisualElement:VisualElement](#visualelement-visualelement)|-|Post-rendering function for the element|
+|[VisualElement:calculatePosition](#visualelement-calculateposition)|number|Calculates the position of the element
+|[VisualElement:drawBg](#visualelement-drawbg)|-|
+|[VisualElement:drawFg](#visualelement-drawfg)|-|
+|[VisualElement:drawText](#visualelement-drawtext)|-|
+|[VisualElement:getAbsolutePosition](#visualelement-getabsoluteposition)|number|Returns the absolute position of the element
+|[VisualElement:getRelativePosition](#visualelement-getrelativeposition)|number|Returns the relative position of the element
+|[VisualElement:isInBounds](#visualelement-isinbounds)|boolean|Checks if point is within bounds
+|[VisualElement:prioritize](#visualelement-prioritize)|VisualElement|Prioritizes the element by moving it to the top of its parent's children
 
-## VisualElement.new()
 
-Creates a new VisualElement instance
+## Protected Functions
 
-### Returns
-* `VisualElement` `object` The newly created VisualElement instance
-
-## VisualElement:VisualElement(props, basalt)
-### Parameters
-* `props` `table` The properties to initialize the element with
-* `basalt` `table` The basalt instance
-
-## VisualElement:VisualElement(x, y, width, height, text, fg, bg)
-### Parameters
-* `x` `number` The x position to draw
-* `y` `number` The y position to draw
-* `width` `number` The width of the area to draw
-* `height` `number` The height of the area to draw
-* `text` `string` The text to draw
-* `fg` `string` The foreground color
-* `bg` `string` The background color
-
-## VisualElement:VisualElement(x, y, text, fg)
-### Parameters
-* `x` `number` The x position to draw
-* `y` `number` The y position to draw
-* `text` `string` The text char to draw
-* `fg` `color` The foreground color
-
-## VisualElement:VisualElement(x, y, text, bg)
-### Parameters
-* `x` `number` The x position to draw
-* `y` `number` The y position to draw
-* `text` `string` The text char to draw
-* `bg` `color` The background color
-
-## VisualElement:VisualElement(x, y, text, fg, bg)
-### Parameters
-* `x` `number` The x position to draw
-* `y` `number` The y position to draw
-* `text` `string` The text char to draw
-* `fg` `string` The foreground color
-* `bg` `string` The background color
-
-## VisualElement:VisualElement(x, y)
-
-Checks if the specified coordinates are within the bounds of the element
-
-### Parameters
-* `x` `number` The x position to check
-* `y` `number` The y position to check
-
-### Returns
-* `boolean` `isInBounds` Whether the coordinates are within the bounds of the element
-
-## VisualElement:VisualElement(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked
-* `x` `number` The x position of the click
-* `y` `number` The y position of the click
-
-### Returns
-* `boolean` `clicked` Whether the element was clicked
-
-## VisualElement:VisualElement(button, x, y)
-### Parameters
-* `button` `number` The button that was released
-* `x` `number` The x position of the release
-* `y` `number` The y position of the release
-
-### Returns
-* `boolean` `release` Whether the element was released on the element
-
-## VisualElement:VisualElement(button, x, y)
-### Parameters
-* `button` `number` The button that was released
-* `x` `number` The x position of the release
-* `y` `number` The y position of the release
-
-## VisualElement:VisualElement(_, x, y)
-### Parameters
-* `_` `number` unknown
-* `x` `number` The x position of the mouse
-* `y` `number` The y position of the mouse
-
-### Returns
-* `boolean` `hover` Whether the mouse has moved over the element
-
-## VisualElement:VisualElement(direction, x, y)
-### Parameters
-* `direction` `number` The scroll direction
-* `x` `number` The x position of the scroll
-* `y` `number` The y position of the scroll
-
-### Returns
-* `boolean` `scroll` Whether the element was scrolled
-
-## VisualElement:VisualElement(button, x, y)
-### Parameters
-* `button` `number` The button that was clicked while dragging
-* `x` `number` The x position of the drag
-* `y` `number` The y position of the drag
-
-### Returns
-* `boolean` `drag` Whether the element was dragged
-
-## VisualElement:VisualElement()
-## VisualElement:VisualElement()
-## VisualElement:VisualElement(key)
-### Parameters
-* `key` `number` The key that was pressed
-
-## VisualElement:VisualElement(key)
-### Parameters
-* `key` `number` The key that was released
-
-## VisualElement:VisualElement(char)
-### Parameters
-* `char` `string` The character that was pressed
-
-## VisualElement:VisualElement()
+|Method|Returns|Description|
+|---|---|---|
+|VisualElement:blit|-|Draws text with both colors
+|VisualElement:blur|-|Handles a blur event
+|VisualElement:char|-|Handles a character event
+|VisualElement:focus|-|Handles a focus event
+|VisualElement:init|-|Initializes a new visual element with properties
+|VisualElement:key|-|Handles a key event
+|VisualElement:key_up|-|Handles a key up event
+|VisualElement:mouse_click|boolean|Handles a mouse click event
+|VisualElement:mouse_drag|boolean|Handles a mouse drag event
+|VisualElement:mouse_move|boolean|Handles a mouse move event
+|VisualElement:mouse_release|-|Handles a mouse release event
+|VisualElement:mouse_scroll|boolean|Handles a mouse scroll event
+|VisualElement:mouse_up|boolean|Handles a mouse up event
+|VisualElement:multiBlit|-|Multi-character drawing with colors
+|VisualElement:postRender|-|Post-rendering function for the element
+|VisualElement:render|-|Renders the element
+|VisualElement:setCursor|VisualElement|Sets the cursor position
+|VisualElement:textBg|-|Draws text with background color
+|VisualElement:textFg|-|Draws text with foreground color
 
+## VisualElement:calculatePosition()
 Calculates the position of the element relative to its parent
 
 ### Returns
 * `number` `x` The x position
 * `number` `y` The y position
 
-## VisualElement:VisualElement(x?, y?)
+## VisualElement:drawBg()
 
+## VisualElement:drawFg()
+
+## VisualElement:drawText()
+
+## VisualElement:getAbsolutePosition(x?, y?)
 Returns the absolute position of the element or the given coordinates.
 
 ### Parameters
@@ -198,8 +107,7 @@ Returns the absolute position of the element or the given coordinates.
 * `number` `x` The absolute x position
 * `number` `y` The absolute y position
 
-## VisualElement:VisualElement(x?, y?)
-
+## VisualElement:getRelativePosition(x?, y?)
 Returns the relative position of the element or the given coordinates.
 
 ### Parameters
@@ -210,22 +118,20 @@ Returns the relative position of the element or the given coordinates.
 * `number` `x` The relative x position
 * `number` `y` The relative y position
 
-## VisualElement:VisualElement(x, y, blink, color)
+## VisualElement:isInBounds(x, y)
+Checks if the specified coordinates are within the bounds of the element
+
 ### Parameters
-* `x` `number` The x position of the cursor
-* `y` `number` The y position of the cursor
-* `blink` `boolean` Whether the cursor should blink
-* `color` `number` The color of the cursor
+* `x` `number` The x position to check
+* `y` `number` The y position to check
 
 ### Returns
-* `VisualElement` `self` The VisualElement instance
-
-## VisualElement:VisualElement()
+* `boolean` `isInBounds` Whether the coordinates are within the bounds of the element
 
+## VisualElement:prioritize()
 This function is used to prioritize the element by moving it to the top of its parent's children. It removes the element from its parent and adds it back, effectively changing its order.
 
 ### Returns
 * `VisualElement` `self` The VisualElement instance
 
-## VisualElement:VisualElement()
-## VisualElement:VisualElement()
\ No newline at end of file
+
diff --git a/docs/references/errorManager.md b/docs/references/errorManager.md
index dcf14f9..20e1996 100644
--- a/docs/references/errorManager.md
+++ b/docs/references/errorManager.md
@@ -1,20 +1,29 @@
 # ErrorHandler
-_This is Basalt's error handler. All the errors are handled by this module._
+This is Basalt's error handler. All the errors are handled by this module.
+
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|tracebackEnabled|`boolean`|If the error handler should print a stack trace|
+|header|`string`|The header of the error message|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[ErrorHandler.error](#errorhandler-error-errmsg)|-|Handles an error|
+|[errorHandler.error](#errorhandler-error)|-|
 
-## ErrorHandler.error(errMsg)
 
+## errorHandler.error(errMsg)
 Handles an error
 
 ### Parameters
 * `errMsg` `string` The error message
 
 ### Usage
-```lua
+ ```lua
 errorHandler.error("An error occurred")
 ```
+
+
diff --git a/docs/references/libraries/expect.md b/docs/references/libraries/expect.md
index d5e0c13..e69de29 100644
--- a/docs/references/libraries/expect.md
+++ b/docs/references/libraries/expect.md
@@ -1 +0,0 @@
-Simple type checking without stack traces
diff --git a/docs/references/libraries/utils.md b/docs/references/libraries/utils.md
index f90a422..e69de29 100644
--- a/docs/references/libraries/utils.md
+++ b/docs/references/libraries/utils.md
@@ -1,12 +0,0 @@
-## utils.copy()
-
-## utils.deepCopy()
-
-## utils.getCenteredPosition()
-
-## utils.reverse()
-
-## utils.split()
-
-## utils.uuid()
-
diff --git a/docs/references/log.md b/docs/references/log.md
index 39c325d..86604b0 100644
--- a/docs/references/log.md
+++ b/docs/references/log.md
@@ -1,57 +1,76 @@
 # Log
-_Logger module for Basalt. Logs messages to the console and optionally to a file._
+Logger module for Basalt. Logs messages to the console and optionally to a file.
+
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|_logs|`table`|The complete log history|
+|_enabled|`boolean`|If the logger is enabled|
+|_logToFile|`boolean`|If the logger should log to a file|
+|_logFile|`string`|The file to log to|
+|LEVEL|`table`|The log levels|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Log.setLogToFile](#log-setlogtofile)|-|Sets if the logger should log to a file|
-|[Log.setEnabled](#log-setenabled)|-|Sets if the logger should log|
-|[Log.debug](#log-debug)|-|Sends a debug message|
-|[Log.info](#log-info)|-|Sends an info message|
-|[Log.warn](#log-warn)|-|Sends a warning message|
-|[Log.error](#log-error)|-|Sends an error message|
+|[Log.debug](#log-debug)|-|Sends a debug message
+|[Log.error](#log-error)|-|Sends an error message
+|[Log.info](#log-info)|-|Sends an info message
+|[Log.setEnabled](#log-setenabled)|-|Sets if the logger should log
+|[Log.setLogToFile](#log-setlogtofile)|-|Sets if the logger should log to a file
+|[Log.warn](#log-warn)|-|Sends a warning message
 
-## Log.setLogToFile()
-
-Sets if the logger should log to a file.
-
-## Log.setEnabled()
-
-Sets if the logger should log
-
-## Log.debug()
 
+## Log.debug(...)
 Sends a debug message to the logger.
 
+### Parameters
+* `...` *(vararg)* `string` The message to log
+
 ### Usage
-```lua
+ ```lua
 Log.debug("This is a debug message")
 ```
 
-## Log.info()
+## Log.error(...)
+Sends an error message to the logger.
 
-Sends an info message to the logger.
+### Parameters
+* `...` *(vararg)* `string` The message to log
 
 ### Usage
-```lua
+ ```lua
+Log.error("This is an error message")
+```
+
+## Log.info(...)
+Sends an info message to the logger.
+
+### Parameters
+* `...` *(vararg)* `string` The message to log
+
+### Usage
+ ```lua
 Log.info("This is an info message")
 ```
 
-## Log.warn()
+## Log.setEnabled()
+Sets if the logger should log
 
+## Log.setLogToFile()
+Sets if the logger should log to a file.
+
+## Log.warn(...)
 Sends a warning message to the logger.
 
+### Parameters
+* `...` *(vararg)* `string` The message to log
+
 ### Usage
-```lua
+ ```lua
 Log.warn("This is a warning message")
 ```
 
-## Log.error()
 
-Sends an error message to the logger.
-
-### Usage
-```lua
-Log.error("This is an error message")
-```
diff --git a/docs/references/main.md b/docs/references/main.md
index 64a60c0..ae35fd0 100644
--- a/docs/references/main.md
+++ b/docs/references/main.md
@@ -1,32 +1,50 @@
 # basalt
-_This is the UI Manager and the starting point for your project. The following functions allow you to influence the default behavior of Basalt.
+This is the UI Manager and the starting point for your project. The following functions allow you to influence the default behavior of Basalt.
 
 Before you can access Basalt, you need to add the following code on top of your file:
-What this code does is it loads basalt into the project, and you can access it by using the variable defined as "basalt"._
+
+### Usage
+ ```lua
+local basalt = require("basalt")
+```
+
+What this code does is it loads basalt into the project, and you can access it by using the variable defined as "basalt".
+
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|traceback|`boolean`|Whether to show a traceback on errors|
+|_events|`table`|A table of events and their callbacks|
+|_schedule|`function[]`|A table of scheduled functions|
+|_plugins|`table`|A table of plugins|
+|isRunning|`boolean`|Whether the Basalt runtime is active|
+|LOGGER|`Log`|The logger instance|
+|path|`string`|The path to the Basalt library|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[basalt.create](#basalt-create-type-properties)|table|Creates a new UI element|
-|[basalt.createFrame](#basalt-createframe)|BaseFrame|Creates a new BaseFrame|
-|[basalt.getElementManager](#basalt-getelementmanager)|table|Returns the element manager|
-|[basalt.getErrorManager](#basalt-geterrormanager)|table|Returns the error manager|
-|[basalt.getMainFrame](#basalt-getmainframe)|BaseFrame|Gets or creates the main frame|
-|[basalt.setActiveFrame](#basalt-setactiveframe-frame-setactive)|-|Sets the active frame|
-|[basalt.getActiveFrame](#basalt-getactiveframe-t)|BaseFrame|Returns the active frame|
-|[basalt.setFocus](#basalt-setfocus-frame)|-|Sets a frame as focused|
-|[basalt.getFocus](#basalt-getfocus)|BaseFrame|Returns the focused frame|
-|[basalt.schedule](#basalt-schedule-func)|thread|Schedules a function to run in a coroutine|
-|[basalt.removeSchedule](#basalt-removeschedule-func)|boolean|Removes a scheduled update|
-|[basalt.update](#basalt-update)|-|Runs basalt once|
-|[basalt.stop](#basalt-stop)|-|Stops the Basalt runtime|
-|[basalt.run](#basalt-run-isactive)|-|Starts the Basalt runtime|
-|[basalt.getElementClass](#basalt-getelementclass-name)|table|Returns an element class|
-|[basalt.getAPI](#basalt-getapi-name)|table|Returns a Plugin API|
+|[basalt.create](#basalt-create)|table|Creates a new UI element
+|[basalt.createFrame](#basalt-createframe)|BaseFrame|Creates a new BaseFrame
+|[basalt.getAPI](#basalt-getapi)|table|Returns a Plugin API
+|[basalt.getActiveFrame](#basalt-getactiveframe)|BaseFrame?|Returns the active frame
+|[basalt.getElementClass](#basalt-getelementclass)|table|Returns an element class
+|[basalt.getElementManager](#basalt-getelementmanager)|table|Returns the element manager
+|[basalt.getErrorManager](#basalt-geterrormanager)|table|Returns the error manager
+|[basalt.getFocus](#basalt-getfocus)|BaseFrame?|Returns the focused frame
+|[basalt.getMainFrame](#basalt-getmainframe)|BaseFrame|Gets or creates the main frame
+|[basalt.removeSchedule](#basalt-removeschedule)|boolean|Removes a scheduled update
+|[basalt.run](#basalt-run)|-|Starts the Basalt runtime
+|[basalt.schedule](#basalt-schedule)|thread|Schedules a function to run in a coroutine
+|[basalt.setActiveFrame](#basalt-setactiveframe)|-|Sets the active frame
+|[basalt.setFocus](#basalt-setfocus)|-|Sets a frame as focused
+|[basalt.stop](#basalt-stop)|-|Stops the Basalt runtime
+|[basalt.update](#basalt-update)|-|Runs basalt once
+
 
 ## basalt.create(type, properties?)
-
 Creates and returns a new UI element of the specified type.
 
 ### Parameters
@@ -37,107 +55,35 @@ Creates and returns a new UI element of the specified type.
 * `table` `element` The created element instance
 
 ### Usage
-```lua
+ ```lua
 local button = basalt.create("Button")
 ```
 
 ## basalt.createFrame()
-
 Creates and returns a new BaseFrame
 
 ### Returns
 * `BaseFrame` `BaseFrame` The created frame instance
 
-## basalt.getElementManager()
-
-Returns the element manager instance
-
-### Returns
-* `table` `ElementManager` The element manager
-
-## basalt.getErrorManager()
-
-Returns the error manager instance
-
-### Returns
-* `table` `ErrorManager` The error manager
-
-## basalt.getMainFrame()
-
-Gets or creates the main frame
-
-### Returns
-* `BaseFrame` `BaseFrame` The main frame instance
-
-## basalt.setActiveFrame(frame, setActive?)
-
-Sets the active frame
+## basalt.getAPI(name)
+Returns a Plugin API
 
 ### Parameters
-* `frame` `BaseFrame` The frame to set as active
-* `setActive` *(optional)* `boolean` Whether to set the frame as active (default: true)
+* `name` `string` The name of the plugin
+
+### Returns
+* `table` `Plugin` The plugin API
 
 ## basalt.getActiveFrame(t?)
-
 Returns the active frame
 
 ### Parameters
 * `t` *(optional)* `term` The term to get the active frame for (default: current term)
 
 ### Returns
-* `BaseFrame` `The` frame to set as active
-
-## basalt.setFocus(frame)
-
-Sets a frame as focused
-
-### Parameters
-* `frame` `BaseFrame` The frame to set as focused
-
-## basalt.getFocus()
-
-Returns the focused frame
-
-### Returns
-* `BaseFrame` `The` focused frame
-
-## basalt.schedule(func)
-
-Schedules a function to run in a coroutine
-
-### Parameters
-* `func` `function` The function to schedule
-
-### Returns
-* `thread` `func` The scheduled function
-
-## basalt.removeSchedule(func)
-
-Removes a scheduled update
-
-### Parameters
-* `func` `thread` The scheduled function to remove
-
-### Returns
-* `boolean` `success` Whether the scheduled function was removed
-
-## basalt.update()
-
-Runs basalt once, can be used to update the UI manually, but you have to feed it the events
-
-## basalt.stop()
-
-Stops the Basalt runtime
-
-## basalt.run(isActive?)
-
-Starts the Basalt runtime
-
-### Parameters
-* `isActive` *(optional)* `boolean` Whether to start active (default: true)
+* `BaseFrame?` `BaseFrame` The frame to set as active
 
 ## basalt.getElementClass(name)
-
 Returns an element's class without creating a instance
 
 ### Parameters
@@ -146,12 +92,74 @@ Returns an element's class without creating a instance
 ### Returns
 * `table` `Element` The element class
 
-## basalt.getAPI(name)
-
-Returns a Plugin API
-
-### Parameters
-* `name` `string` The name of the plugin
+## basalt.getElementManager()
+Returns the element manager instance
 
 ### Returns
-* `table` `Plugin` The plugin API
+* `table` `ElementManager` The element manager
+
+## basalt.getErrorManager()
+Returns the error manager instance
+
+### Returns
+* `table` `ErrorManager` The error manager
+
+## basalt.getFocus()
+Returns the focused frame
+
+### Returns
+* `BaseFrame?` `BaseFrame` The focused frame
+
+## basalt.getMainFrame()
+Gets or creates the main frame
+
+### Returns
+* `BaseFrame` `BaseFrame` The main frame instance
+
+## basalt.removeSchedule(func)
+Removes a scheduled update
+
+### Parameters
+* `func` `thread` The scheduled function to remove
+
+### Returns
+* `boolean` `success` Whether the scheduled function was removed
+
+## basalt.run(isActive?)
+Starts the Basalt runtime
+
+### Parameters
+* `isActive` *(optional)* `boolean` Whether to start active (default: true)
+
+## basalt.schedule(func)
+Schedules a function to run in a coroutine
+
+### Parameters
+* `func` `function` The function to schedule
+
+### Returns
+* `thread` `func` The scheduled function
+
+## basalt.setActiveFrame(frame, setActive?)
+Sets the active frame
+
+### Parameters
+* `frame` `BaseFrame` The frame to set as active
+* `setActive` *(optional)* `boolean` Whether to set the frame as active (default: true)
+
+## basalt.setFocus(frame)
+Sets a frame as focused
+
+### Parameters
+* `frame` `BaseFrame` The frame to set as focused
+
+## basalt.stop()
+Stops the Basalt runtime
+
+## basalt.update(...)
+Runs basalt once, can be used to update the UI manually, but you have to feed it the events
+
+### Parameters
+* `...` *(vararg)* `any` The event to run with
+
+
diff --git a/docs/references/plugins/benchmark.md b/docs/references/plugins/benchmark.md
index bb7dfaf..d28c6a9 100644
--- a/docs/references/plugins/benchmark.md
+++ b/docs/references/plugins/benchmark.md
@@ -1,175 +1,48 @@
-# BaseElement
-
-## Functions
-
-|Method|Returns|Description|
-|---|---|---|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|BaseElement|Starts timing a method call|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|BaseElement|Ends timing a method call and records statistics|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|BaseElement|Enables performance measurement for a method|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|BaseElement|Logs benchmark statistics for a method|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|BaseElement|Disables performance measurement for a method|
-|[BaseElement:BaseElement](#baseelement-baseelement-methodname)|stats|Retrieves benchmark statistics for a method|
-
-## BaseElement:BaseElement(methodName)
-
-Starts profiling a method
-
-### Parameters
-* `methodName` `string` The name of the method to profile
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(methodName)
-
-Ends profiling a method
-
-### Parameters
-* `methodName` `string` The name of the method to stop profiling
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(methodName)
-
-Enables benchmarking for a method
-
-### Parameters
-* `methodName` `string` The name of the method to benchmark
-
-### Returns
-* `BaseElement` `self` The element instance
-
-### Usage
-```lua
-element:benchmark("render")
-```
-
-## BaseElement:BaseElement(methodName)
-
-Logs benchmark statistics for a method
-
-### Parameters
-* `methodName` `string` The name of the method to log
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(methodName)
-
-Stops benchmarking for a method
-
-### Parameters
-* `methodName` `string` The name of the method to stop benchmarking
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(methodName)
-
-Gets benchmark statistics for a method
-
-### Parameters
-* `methodName` `string` The name of the method to get statistics for
-
-### Returns
-* `stats` `The` benchmark statistics or nil
-
-# Container
-
-Extends: `VisualElement`
-
-## Functions
-
-|Method|Returns|Description|
-|---|---|---|
-|[Container:Container](#container-container-methodname)|Container|Recursively enables benchmarking|
-|[Container:Container](#container-container-methodname)|Container|Recursively logs benchmark statistics|
-|[Container:Container](#container-container-methodname)|Container|Recursively stops benchmarking|
-
-## Container:Container(methodName)
-
-Enables benchmarking for a container and all its children
-
-### Parameters
-* `methodName` `string` The method to benchmark
-
-### Returns
-* `Container` `self` The container instance
-
-### Usage
-```lua
-container:benchmarkContainer("render")
-```
-
-## Container:Container(methodName)
-
-Logs benchmark statistics for a container and all its children
-
-### Parameters
-* `methodName` `string` The method to log
-
-### Returns
-* `Container` `self` The container instance
-
-## Container:Container(methodName)
-
-Stops benchmarking for a container and all its children
-
-### Parameters
-* `methodName` `string` The method to stop benchmarking
-
-### Returns
-* `Container` `self` The container instance
-
 # Benchmark
-_This is the benchmark plugin. It provides performance measurement tools for elements and methods,
+This is the benchmark plugin. It provides performance measurement tools for elements and methods,
 with support for hierarchical profiling and detailed statistics. The plugin is meant to be used for very big projects
-where performance is critical. It allows you to measure the time taken by specific methods and log the results._
+where performance is critical. It allows you to measure the time taken by specific methods and log the results.
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Benchmark.start](#benchmark-start-name-options)|-|Starts timing a custom operation|
-|[Benchmark.stop](#benchmark-stop-name)|-|Stops timing and logs results|
-|[Benchmark.getStats](#benchmark-getstats-name)|stats|Retrieves benchmark statistics|
-|[Benchmark.clear](#benchmark-clear-name)|-|Removes a benchmark's data|
-|[Benchmark.clearAll](#benchmark-clearall)|-|Removes all custom benchmark data|
+|[API.clear](#api-clear)|-|Removes a benchmark's data
+|[API.clearAll](#api-clearall)|-|Removes all custom benchmark data
+|[API.getStats](#api-getstats)|table?|Retrieves benchmark statistics
+|[API.start](#api-start)|-|Starts timing a custom operation
+|[API.stop](#api-stop)|-|Stops timing and logs results
 
-## Benchmark.start(name, options?)
 
-Starts a custom benchmark
+## API.clear(name)
+Clears a specific benchmark
 
 ### Parameters
-* `name` `string` The name of the benchmark
-* `options` *(optional)* `table` Optional configuration 
+* `name` `string` The name of the benchmark to clear
 
-## Benchmark.stop(name)
-
-Stops a custom benchmark
-
-### Parameters
-* `name` `string` The name of the benchmark to stop
-
-## Benchmark.getStats(name)
+## API.clearAll()
+Clears all custom benchmarks
 
+## API.getStats(name)
 Gets statistics for a benchmark
 
 ### Parameters
 * `name` `string` The name of the benchmark
 
 ### Returns
-* `stats` `The` benchmark statistics or nil
+* `table?` `stats` The benchmark statistics or nil
 
-## Benchmark.clear(name)
-
-Clears a specific benchmark
+## API.start(name, options?)
+Starts a custom benchmark
 
 ### Parameters
-* `name` `string` The name of the benchmark to clear
+* `name` `string` The name of the benchmark
+* `options` *(optional)* `table` Optional configuration 
+
+## API.stop(name)
+Stops a custom benchmark
+
+### Parameters
+* `name` `string` The name of the benchmark to stop
 
-## Benchmark.clearAll()
 
-Clears all custom benchmarks
diff --git a/docs/references/plugins/debug.md b/docs/references/plugins/debug.md
index 9544a62..5713bae 100644
--- a/docs/references/plugins/debug.md
+++ b/docs/references/plugins/debug.md
@@ -1,15 +1,15 @@
 # BaseElement
-_No Description_
+No Description
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseElement.debug](#baseelement-debug-self-level)|-|Enables debugging for this element|
-|[BaseElement.dumpDebug](#baseelement-dumpdebug-self)|-|Dumps debug information|
+|[BaseElement.debug](#baseelement-debug)|-|Enables debugging for this element
+|[BaseElement.dumpDebug](#baseelement-dumpdebug)|-|Dumps debug information
+
 
 ## BaseElement.debug(self, level)
-
 Enables debugging for this element
 
 ### Parameters
@@ -17,55 +17,62 @@ Enables debugging for this element
 * `level` `number` The debug level
 
 ## BaseElement.dumpDebug(self)
-
 Dumps debug information for this element
 
 ### Parameters
 * `self` `BaseElement` The element to dump debug info for
 
+
+---
+<br>
+
 # BaseFrame
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseFrame.openConsole](#baseframe-openconsole-self)|-|Shows the debug log frame|
-|[BaseFrame.closeConsole](#baseframe-closeconsole-self)|-|Hides the debug log frame|
-|[BaseFrame.toggleConsole](#baseframe-toggleconsole-self)|-|Toggles the debug log frame|
+|[BaseFrame.closeConsole](#baseframe-closeconsole)|-|Hides the debug log frame
+|[BaseFrame.openConsole](#baseframe-openconsole)|-|Shows the debug log frame
+|[BaseFrame.toggleConsole](#baseframe-toggleconsole)|-|Toggles the debug log frame
 
-## BaseFrame.openConsole(self)
-
-Shows the debug log frame
-
-### Parameters
-* `self` `BaseFrame` The frame to show debug log in
 
 ## BaseFrame.closeConsole(self)
-
 Hides the debug log frame
 
 ### Parameters
 * `self` `BaseFrame` The frame to hide debug log for
 
-## BaseFrame.toggleConsole(self)
+## BaseFrame.openConsole(self)
+Shows the debug log frame
 
+### Parameters
+* `self` `BaseFrame` The frame to show debug log in
+
+## BaseFrame.toggleConsole(self)
 Toggles the debug log frame
 
 ### Parameters
 * `self` `BaseFrame` The frame to toggle debug log for
 
+
+---
+<br>
+
 # Container
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Container.debugChildren](#container-debugchildren-self-level)|-|Debug container and children|
+|[Container.debugChildren](#container-debugchildren)|-|Debug container and children
+
 
 ## Container.debugChildren(self, level)
-
 Enables debugging for this container and all its children
 
 ### Parameters
 * `self` `Container` The container to debug
 * `level` `number` The debug level
+
+
diff --git a/docs/references/plugins/reactive.md b/docs/references/plugins/reactive.md
index 6f50d0a..637d74c 100644
--- a/docs/references/plugins/reactive.md
+++ b/docs/references/plugins/reactive.md
@@ -1,3 +1,15 @@
 # Reactive
-_This module provides reactive functionality for elements, it adds no new functionality for elements. 
-It is used to evaluate expressions in property values and update the element when the expression changes._
+This module provides reactive functionality for elements, it adds no new functionality for elements. 
+It is used to evaluate expressions in property values and update the element when the expression changes.
+
+### Usage
+ ```lua
+local button = main:addButton({text="Exit"})
+button:setX("{parent.x - 12}")
+button:setBackground("{self.clicked and colors.red or colors.green}")
+button:setWidth("{self.text:len() + 2}")
+```
+
+
+
+
diff --git a/docs/references/plugins/state.md b/docs/references/plugins/state.md
index cd0a63b..006b50a 100644
--- a/docs/references/plugins/state.md
+++ b/docs/references/plugins/state.md
@@ -1,15 +1,92 @@
-# BaseFrame
-
-Extends: `Container`
+# BaseElement
+This is the state plugin. It provides a state management system for UI elements with support for
+persistent states, computed states, and state sharing between elements.
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseFrame:BaseFrame](#baseframe-baseframe-self-name-default-persist-path)|BaseFrame|Initializes a new state|
+|[BaseElement:bind](#baseelement-bind)|BaseElement|
+|[BaseElement:computed](#baseelement-computed)|-|
+|[BaseElement:getState](#baseelement-getstate)|any|Gets a state value
+|[BaseElement:onStateChange](#baseelement-onstatechange)|BaseElement|Watches for state changes
+|[BaseElement:removeStateChange](#baseelement-removestatechange)|BaseElement|Removes a state change observer
+|[BaseElement:setState](#baseelement-setstate)|BaseElement|Sets a state value
 
-## BaseFrame:BaseFrame(self, name, default, persist?, path?)
 
+## BaseElement:bind(self, propertyName, stateName)
+Binds a property to a state
+
+### Parameters
+* `self` `BaseElement` The element to bind
+* `propertyName` `string` The property to bind
+* `stateName` `string` The state to bind to (optional, uses propertyName if not provided)
+
+### Returns
+* `BaseElement` `self` The element instance
+
+## BaseElement:computed()
+
+## BaseElement:getState(self, name)
+Gets the value of a state
+
+### Parameters
+* `self` `BaseElement` The element to get state from
+* `name` `string` The name of the state
+
+### Returns
+* `any` `value` The current state value
+
+## BaseElement:onStateChange(self, stateName, callback)
+Registers a callback for state changes
+
+### Parameters
+* `self` `BaseElement` The element to watch
+* `stateName` `string` The state to watch
+* `callback` `function` Called with (element, newValue, oldValue)
+
+### Returns
+* `BaseElement` `self` The element instance
+
+## BaseElement:removeStateChange(self, stateName, callback)
+Removes a state change observer
+
+### Parameters
+* `self` `BaseElement` The element to remove observer from
+* `stateName` `string` The state to remove observer from
+* `callback` `function` The callback function to remove
+
+### Returns
+* `BaseElement` `self` The element instance
+
+## BaseElement:setState(self, name, value)
+Sets the value of a state
+
+### Parameters
+* `self` `BaseElement` The element to set state for
+* `name` `string` The name of the state
+* `value` `any` The new value for the state
+
+### Returns
+* `BaseElement` `self` The element instance
+
+
+---
+<br>
+
+# BaseFrame : Container
+
+## Functions
+
+|Method|Returns|Description|
+|---|---|---|
+|[BaseFrame.setup](#baseframe-setup)|-|
+|[BaseFrame:initializeState](#baseframe-initializestate)|BaseFrame|Initializes a new state
+
+
+## BaseFrame.setup()
+
+## BaseFrame:initializeState(self, name, default, persist?, path?)
 Initializes a new state for this element
 
 ### Parameters
@@ -22,75 +99,4 @@ Initializes a new state for this element
 ### Returns
 * `BaseFrame` `self` The element instance
 
-# BaseElement
-_This is the state plugin. It provides a state management system for UI elements with support for
-persistent states, computed states, and state sharing between elements._
 
-## Functions
-
-|Method|Returns|Description|
-|---|---|---|
-|[BaseElement:BaseElement](#baseelement-baseelement-self-name-value)|BaseElement|Sets a state value|
-|[BaseElement:BaseElement](#baseelement-baseelement-self-name)|any|Gets a state value|
-|[BaseElement:BaseElement](#baseelement-baseelement-self-statename-callback)|BaseElement|Watches for state changes|
-|[BaseElement:BaseElement](#baseelement-baseelement-self-statename-callback)|BaseElement|Removes a state change observer|
-|[BaseElement:BaseElement](#baseelement-baseelement-self-propertyname-statename)|BaseElement|Binds a property to a state|
-
-## BaseElement:BaseElement(self, name, value)
-
-Sets the value of a state
-
-### Parameters
-* `self` `BaseElement` The element to set state for
-* `name` `string` The name of the state
-* `value` `any` The new value for the state
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(self, name)
-
-Gets the value of a state
-
-### Parameters
-* `self` `BaseElement` The element to get state from
-* `name` `string` The name of the state
-
-### Returns
-* `any` `value` The current state value
-
-## BaseElement:BaseElement(self, stateName, callback)
-
-Registers a callback for state changes
-
-### Parameters
-* `self` `BaseElement` The element to watch
-* `stateName` `string` The state to watch
-* `callback` `function` Called with (element, newValue, oldValue)
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(self, stateName, callback)
-
-Removes a state change observer
-
-### Parameters
-* `self` `BaseElement` The element to remove observer from
-* `stateName` `string` The state to remove observer from
-* `callback` `function` The callback function to remove
-
-### Returns
-* `BaseElement` `self` The element instance
-
-## BaseElement:BaseElement(self, propertyName, stateName)
-
-Binds a property to a state
-
-### Parameters
-* `self` `BaseElement` The element to bind
-* `propertyName` `string` The property to bind
-* `stateName` `string` The state to bind to (optional, uses propertyName if not provided)
-
-### Returns
-* `BaseElement` `self` The element instance
diff --git a/docs/references/plugins/theme.md b/docs/references/plugins/theme.md
index 10613b6..a53f364 100644
--- a/docs/references/plugins/theme.md
+++ b/docs/references/plugins/theme.md
@@ -1,29 +1,26 @@
 # BaseElement
-_This is the theme plugin. It provides a theming system that allows for consistent styling across elements
-with support for inheritance, named styles, and dynamic theme switching._
+This is the theme plugin. It provides a theming system that allows for consistent styling across elements
+with support for inheritance, named styles, and dynamic theme switching.
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[BaseElement.____getElementPath](#baseelement-----getelementpath)|-||
-|[BaseElement:BaseElement](#baseelement-baseelement-self-applytochildren)|BaseElement|Applies theme styles to the element|
-|[BaseElement:BaseElement](#baseelement-baseelement-self)|table|Gets theme properties for the element|
+|[BaseElement:applyTheme](#baseelement-applytheme)|BaseElement|Applies theme styles to the element
+|[BaseElement:getTheme](#baseelement-gettheme)|table|Gets theme properties for the element
 
-## BaseElement.____getElementPath()
-## BaseElement:BaseElement(self, applyToChildren)
 
+## BaseElement:applyTheme(self, applyToChildren)
 Applies the current theme to this element
 
 ### Parameters
 * `self` `BaseElement` The element to apply theme to
-* `applyToChildren` `boolean` ? Whether to apply theme to child elements (default: true)
+* `applyToChildren` `boolean?` Whether to apply theme to child elements (default: true)
 
 ### Returns
 * `BaseElement` `self` The element instance
 
-## BaseElement:BaseElement(self)
-
+## BaseElement:getTheme(self)
 Gets the theme properties for this element
 
 ### Parameters
@@ -32,34 +29,38 @@ Gets the theme properties for this element
 ### Returns
 * `table` `styles` The theme properties
 
+
+---
+<br>
+
 # ThemeAPI
-_The Theme API provides methods for managing themes globally_
+The Theme API provides methods for managing themes globally
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[ThemeAPI.setTheme](#themeapi-settheme-newtheme)|-|Sets a new theme|
-|[ThemeAPI.getTheme](#themeapi-gettheme)|table|Gets the current theme|
-|[ThemeAPI.loadTheme](#themeapi-loadtheme-path)|-|Loads theme from JSON file|
+|[ThemeAPI.getTheme](#themeapi-gettheme)|table|Gets the current theme
+|[ThemeAPI.loadTheme](#themeapi-loadtheme)|-|Loads theme from JSON file
+|[ThemeAPI.setTheme](#themeapi-settheme)|-|Sets a new theme
 
-## ThemeAPI.setTheme(newTheme)
-
-Sets the current theme
-
-### Parameters
-* `newTheme` `table` The theme configuration to set
 
 ## ThemeAPI.getTheme()
-
 Gets the current theme configuration
 
 ### Returns
 * `table` `theme` The current theme configuration
 
 ## ThemeAPI.loadTheme(path)
-
 Loads a theme from a JSON file
 
 ### Parameters
 * `path` `string` Path to the theme JSON file
+
+## ThemeAPI.setTheme(newTheme)
+Sets the current theme
+
+### Parameters
+* `newTheme` `table` The theme configuration to set
+
+
diff --git a/docs/references/propertySystem.md b/docs/references/propertySystem.md
index 10be601..b97c02e 100644
--- a/docs/references/propertySystem.md
+++ b/docs/references/propertySystem.md
@@ -1,51 +1,43 @@
 # PropertySystem
-_PropertySystem is a class that allows Elements to have properties that can be observed and updated.
-It also allows for properties to have custom getters and setters. This is the base system for all Elements._
+PropertySystem is a class that allows Elements to have properties that can be observed and updated.
+It also allows for properties to have custom getters and setters. This is the base system for all Elements.
+
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|_properties|`table`|A table containing all property configurations|
+|_values|`table`|A table containing all property values|
+|_observers|`table`|A table containing all property observers|
+|set|`function`|A function to set a property value|
+|get|`function`|A function to get a property value|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[PropertySystem.addSetterHook](#propertysystem-addsetterhook-hook)|-|Adds a setter hook to the PropertySystem|
-|[PropertySystem.defineProperty](#propertysystem-defineproperty-class-name-config)|-|Defines a property for an element class|
-|[PropertySystem.combineProperties](#propertysystem-combineproperties-class-name)|-|Combines multiple properties|
-|[PropertySystem.blueprint](#propertysystem-blueprint-elementclass)|table|Creates a blueprint of an element class|
-|[PropertySystem.createFromBlueprint](#propertysystem-createfromblueprint-elementclass-blueprint)|table|Creates an element from a blueprint|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem)|table|Initializes the PropertySystem|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name-value)|table|Update call for a property|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name-callback)|table|Observers a property|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name-callback)|table|Removes an observer from a property|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name)|table|Removes all observers from a property|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name-config)|table|Adds a property to the PropertySystem on instance level|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name)|table|Removes a property from the PropertySystem|
-|[PropertySystem:PropertySystem](#propertysystem-propertysystem-name)|table|Gets a property configuration|
+|[PropertySystem.addSetterHook](#propertysystem-addsetterhook)|-|Adds a setter hook to the PropertySystem
+|[PropertySystem.blueprint](#propertysystem-blueprint)|table|Creates a blueprint of an element class
+|[PropertySystem.combineProperties](#propertysystem-combineproperties)|-|Combines multiple properties
+|[PropertySystem.createFromBlueprint](#propertysystem-createfromblueprint)|table|Creates an element from a blueprint
+|[PropertySystem.defineProperty](#propertysystem-defineproperty)|-|Defines a property for an element class
+|[PropertySystem:__init](#propertysystem-__init)|table|Initializes the PropertySystem
+|[PropertySystem:_updateProperty](#propertysystem-_updateproperty)|table|Update call for a property
+|[PropertySystem:getPropertyConfig](#propertysystem-getpropertyconfig)|table|Gets a property configuration
+|[PropertySystem:instanceProperty](#propertysystem-instanceproperty)|table|Adds a property to the PropertySystem on instance level
+|[PropertySystem:observe](#propertysystem-observe)|table|Observers a property
+|[PropertySystem:removeAllObservers](#propertysystem-removeallobservers)|table|Removes all observers from a property
+|[PropertySystem:removeObserver](#propertysystem-removeobserver)|table|Removes an observer from a property
+|[PropertySystem:removeProperty](#propertysystem-removeproperty)|table|Removes a property from the PropertySystem
+
 
 ## PropertySystem.addSetterHook(hook)
-
 Adds a setter hook to the PropertySystem. Setter hooks are functions that are called before a property is set.
 
 ### Parameters
 * `hook` `function` The hook function to add
 
-## PropertySystem.defineProperty(class, name, config)
-
-Defines a property for an element class
-
-### Parameters
-* `class` `table` The element class to define the property for
-* `name` `string` The name of the property
-* `config` `table` The configuration of the property
-
-## PropertySystem.combineProperties(class, name)
-
-Combines multiple properties into a single getter and setter
-
-### Parameters
-* `class` `table` The element class to combine the properties for
-* `name` `string` The name of the combined property
-
 ## PropertySystem.blueprint(elementClass)
-
 Creates a blueprint of an element class with all its properties
 
 ### Parameters
@@ -54,8 +46,15 @@ Creates a blueprint of an element class with all its properties
 ### Returns
 * `table` `blueprint` A table containing all property definitions
 
-## PropertySystem.createFromBlueprint(elementClass, blueprint)
+## PropertySystem.combineProperties(class, name...)
+Combines multiple properties into a single getter and setter
 
+### Parameters
+* `class` `table` The element class to combine the properties for
+* `name` `string` The name of the combined property
+* `...` *(vararg)* `string` The names of the properties to combine
+
+## PropertySystem.createFromBlueprint(elementClass, blueprint)
 Creates an element from a blueprint
 
 ### Parameters
@@ -65,15 +64,21 @@ Creates an element from a blueprint
 ### Returns
 * `table` `element` The created element
 
-## PropertySystem:PropertySystem()
+## PropertySystem.defineProperty(class, name, config)
+Defines a property for an element class
 
+### Parameters
+* `class` `table` The element class to define the property for
+* `name` `string` The name of the property
+* `config` `table` The configuration of the property
+
+## PropertySystem:__init()
 Initializes the PropertySystem IS USED INTERNALLY
 
 ### Returns
 * `table` `self` The PropertySystem
 
-## PropertySystem:PropertySystem(name, value)
-
+## PropertySystem:_updateProperty(name, value)
 Update call for a property IS USED INTERNALLY
 
 ### Parameters
@@ -83,40 +88,16 @@ Update call for a property IS USED INTERNALLY
 ### Returns
 * `table` `self` The PropertySystem
 
-## PropertySystem:PropertySystem(name, callback)
-
-Observers a property
+## PropertySystem:getPropertyConfig(name)
+Gets a property configuration
 
 ### Parameters
 * `name` `string` The name of the property
-* `callback` `function` The callback function to call when the property changes
 
 ### Returns
-* `table` `self` The PropertySystem
-
-## PropertySystem:PropertySystem(name, callback)
-
-Removes an observer from a property
-
-### Parameters
-* `name` `string` The name of the property
-* `callback` `function` The callback function to remove
-
-### Returns
-* `table` `self` The PropertySystem
-
-## PropertySystem:PropertySystem(name?)
-
-Removes all observers from a property
-
-### Parameters
-* `name` *(optional)* `string` The name of the property
-
-### Returns
-* `table` `self` The PropertySystem
-
-## PropertySystem:PropertySystem(name, config)
+* `table` `config` The configuration of the property
 
+## PropertySystem:instanceProperty(name, config)
 Adds a property to the PropertySystem on instance level
 
 ### Parameters
@@ -126,8 +107,36 @@ Adds a property to the PropertySystem on instance level
 ### Returns
 * `table` `self` The PropertySystem
 
-## PropertySystem:PropertySystem(name)
+## PropertySystem:observe(name, callback)
+Observers a property
 
+### Parameters
+* `name` `string` The name of the property
+* `callback` `function` The callback function to call when the property changes
+
+### Returns
+* `table` `self` The PropertySystem
+
+## PropertySystem:removeAllObservers(name)
+Removes all observers from a property
+
+### Parameters
+* `name` `string` The name of the property
+
+### Returns
+* `table` `self` The PropertySystem
+
+## PropertySystem:removeObserver(name, callback)
+Removes an observer from a property
+
+### Parameters
+* `name` `string` The name of the property
+* `callback` `function` The callback function to remove
+
+### Returns
+* `table` `self` The PropertySystem
+
+## PropertySystem:removeProperty(name)
 Removes a property from the PropertySystem on instance level
 
 ### Parameters
@@ -136,12 +145,4 @@ Removes a property from the PropertySystem on instance level
 ### Returns
 * `table` `self` The PropertySystem
 
-## PropertySystem:PropertySystem(name)
 
-Gets a property configuration
-
-### Parameters
-* `name` `string` The name of the property
-
-### Returns
-* `table` `config` The configuration of the property
diff --git a/docs/references/render.md b/docs/references/render.md
index 5e32813..1d587ea 100644
--- a/docs/references/render.md
+++ b/docs/references/render.md
@@ -1,44 +1,55 @@
 # Render
-_This is the render module for Basalt. It tries to mimic the functionality of the `term` API. but with additional 
-functionality. It also has a buffer system to reduce the number of calls_
+This is the render module for Basalt. It tries to mimic the functionality of the `term` API. but with additional 
+functionality. It also has a buffer system to reduce the number of calls
+
+## Fields
+
+|Field|Type|Description|
+|---|---|---|
+|terminal|`table`|The terminal object to render to|
+|width|`number`|The width of the render|
+|height|`number`|The height of the render|
+|buffer|`table`|The buffer to render|
+|xCursor|`number`|The x position of the cursor|
+|yCursor|`number`|The y position of the cursor|
+|blink|`boolean`|Whether the cursor should blink|
 
 ## Functions
 
 |Method|Returns|Description|
 |---|---|---|
-|[Render.new](#render-new-terminal)|Render|Creates a new Render object|
-|[Render:Render](#render-render-x-y-width-height)|Render|Adds a dirty rectangle to the buffer|
-|[Render:Render](#render-render-x-y-text-fg-bg)|Render|Blits text to the screen|
-|[Render:Render](#render-render-x-y-width-height-text-fg-bg)|Render|Blits text to the screen with multiple lines|
-|[Render:Render](#render-render-x-y-text-fg)|Render|Blits text to the screen with a foreground color|
-|[Render:Render](#render-render-x-y-text-bg)|Render|Blits text to the screen with a background color|
-|[Render:Render](#render-render-x-y-text)|Render|Renders the text to the screen|
-|[Render:Render](#render-render-x-y-fg)|Render|Blits a foreground color to the screen|
-|[Render:Render](#render-render-x-y-bg)|Render|Blits a background color to the screen|
-|[Render:Render](#render-render-x-y-text)|Render|Blits text to the screen|
-|[Render:Render](#render-render-x-y-fg)|Render|Blits a foreground color to the screen|
-|[Render:Render](#render-render-x-y-bg)|Render|Blits a background color to the screen|
-|[Render:Render](#render-render-bg)|Render|Clears the screen|
-|[Render:Render](#render-render)|Render|Renders the buffer to the screen|
-|[Render:Render](#render-render-r1-r2)|boolean|Checks if two rectangles overlap|
-|[Render:Render](#render-render-target-source)|Render|Merges two rectangles|
-|[Render:Render](#render-render-x-y-blink)|Render|Sets the cursor position|
-|[Render:Render](#render-render-x-y-width-height-bg)|Render|Clears an area of the screen|
-|[Render:Render](#render-render)|number|Gets the size of the render|
-|[Render:Render](#render-render-width-height)|Render|Sets the size of the render|
+|[Render.new](#render-new)|Render|
+|[Render:addDirtyRect](#render-adddirtyrect)|Render|
+|[Render:bg](#render-bg)|Render|
+|[Render:bg](#render-bg)|Render|
+|[Render:blit](#render-blit)|Render|
+|[Render:clear](#render-clear)|Render|
+|[Render:clearArea](#render-cleararea)|Render|
+|[Render:fg](#render-fg)|Render|
+|[Render:fg](#render-fg)|Render|
+|[Render:getSize](#render-getsize)|number,|
+|[Render:mergeRects](#render-mergerects)|Render|
+|[Render:multiBlit](#render-multiblit)|Render|
+|[Render:rectOverlaps](#render-rectoverlaps)|boolean|
+|[Render:render](#render-render)|Render|
+|[Render:setCursor](#render-setcursor)|Render|
+|[Render:setSize](#render-setsize)|Render|
+|[Render:text](#render-text)|Render|
+|[Render:text](#render-text)|Render|
+|[Render:textBg](#render-textbg)|Render|
+|[Render:textFg](#render-textfg)|Render|
+
 
 ## Render.new(terminal)
-
 Creates a new Render object
 
 ### Parameters
 * `terminal` `table` The terminal object to render to
 
 ### Returns
-* `Render`
-
-## Render:Render(x, y, width, height)
+* `nil` `nil` nil
 
+## Render:addDirtyRect(x, y, width, height)
 Adds a dirty rectangle to the buffer
 
 ### Parameters
@@ -48,10 +59,31 @@ Adds a dirty rectangle to the buffer
 * `height` `number` The height of the rectangle
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, text, fg, bg)
+## Render:bg(x, y, bg)
+Blits a background color to the screen
 
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `bg` `string` The background color to blit
+
+### Returns
+* `nil` `nil` nil
+
+## Render:bg(x, y, bg)
+Blits a background color to the screen
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `bg` `string` The background color to blit
+
+### Returns
+* `nil` `nil` nil
+
+## Render:blit(x, y, text, fg, bg)
 Blits text to the screen
 
 ### Parameters
@@ -62,10 +94,69 @@ Blits text to the screen
 * `bg` `string` The background color of the text
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, width, height, text, fg, bg)
+## Render:clear(bg)
+Clears the screen
 
+### Parameters
+* `bg` `colors` The background color to clear the screen with
+
+### Returns
+* `nil` `nil` nil
+
+## Render:clearArea(x, y, width, height, bg)
+Clears an area of the screen
+
+### Parameters
+* `x` `number` The x position of the area
+* `y` `number` The y position of the area
+* `width` `number` The width of the area
+* `height` `number` The height of the area
+* `bg` `colors` The background color to clear the area with
+
+### Returns
+* `nil` `nil` nil
+
+## Render:fg(x, y, fg)
+Blits a foreground color to the screen
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `fg` `string` The foreground color to blit
+
+### Returns
+* `nil` `nil` nil
+
+## Render:fg(x, y, fg)
+Blits a foreground color to the screen
+
+### Parameters
+* `x` `number` The x position
+* `y` `number` The y position
+* `fg` `string` The foreground color to blit
+
+### Returns
+* `nil` `nil` nil
+
+## Render:getSize()
+Gets the size of the render
+
+### Returns
+* `nil` `nil` nil
+
+## Render:mergeRects(target, source)
+Merges two rectangles
+
+### Parameters
+* `target` `table` The target rectangle
+* `source` `table` The source rectangle
+
+### Returns
+* `nil` `nil` nil
+
+## Render:multiBlit(x, y, width, height, text, fg, bg)
 Blits text to the screen with multiple lines
 
 ### Parameters
@@ -78,23 +169,68 @@ Blits text to the screen with multiple lines
 * `bg` `colors` The background color of the text
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, text, fg)
+## Render:rectOverlaps(r1, r2)
+Checks if two rectangles overlap
 
-Blits text to the screen with a foreground color
+### Parameters
+* `r1` `table` The first rectangle
+* `r2` `table` The second rectangle
+
+### Returns
+* `nil` `nil` nil
+
+## Render:render()
+Renders the buffer to the screen
+
+### Returns
+* `nil` `nil` nil
+
+## Render:setCursor(x, y, blink)
+Sets the cursor position
+
+### Parameters
+* `x` `number` The x position of the cursor
+* `y` `number` The y position of the cursor
+* `blink` `boolean` Whether the cursor should blink
+
+### Returns
+* `nil` `nil` nil
+
+## Render:setSize(width, height)
+Sets the size of the render
+
+### Parameters
+* `width` `number` The width of the render
+* `height` `number` The height of the render
+
+### Returns
+* `nil` `nil` nil
+
+## Render:text(x, y, text)
+Blits text to the screen
 
 ### Parameters
 * `x` `number` The x position to blit to
 * `y` `number` The y position to blit to
 * `text` `string` The text to blit
-* `fg` `colors` The foreground color of the text
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, text, bg)
+## Render:text(x, y, text)
+Renders the text to the screen
 
+### Parameters
+* `x` `number` The x position to blit to
+* `y` `number` The y position to blit to
+* `text` `string` The text to blit
+
+### Returns
+* `nil` `nil` nil
+
+## Render:textBg(x, y, text, bg)
 Blits text to the screen with a background color
 
 ### Parameters
@@ -104,159 +240,18 @@ Blits text to the screen with a background color
 * `bg` `colors` The background color of the text
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, text)
-
-Renders the text to the screen
+## Render:textFg(x, y, text, fg)
+Blits text to the screen with a foreground color
 
 ### Parameters
 * `x` `number` The x position to blit to
 * `y` `number` The y position to blit to
 * `text` `string` The text to blit
+* `fg` `colors` The foreground color of the text
 
 ### Returns
-* `Render`
+* `nil` `nil` nil
 
-## Render:Render(x, y, fg)
 
-Blits a foreground color to the screen
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `fg` `string` The foreground color to blit
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, bg)
-
-Blits a background color to the screen
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `bg` `string` The background color to blit
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, text)
-
-Blits text to the screen
-
-### Parameters
-* `x` `number` The x position to blit to
-* `y` `number` The y position to blit to
-* `text` `string` The text to blit
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, fg)
-
-Blits a foreground color to the screen
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `fg` `string` The foreground color to blit
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, bg)
-
-Blits a background color to the screen
-
-### Parameters
-* `x` `number` The x position
-* `y` `number` The y position
-* `bg` `string` The background color to blit
-
-### Returns
-* `Render`
-
-## Render:Render(bg)
-
-Clears the screen
-
-### Parameters
-* `bg` `colors` The background color to clear the screen with
-
-### Returns
-* `Render`
-
-## Render:Render()
-
-Renders the buffer to the screen
-
-### Returns
-* `Render`
-
-## Render:Render(r1, r2)
-
-Checks if two rectangles overlap
-
-### Parameters
-* `r1` `table` The first rectangle
-* `r2` `table` The second rectangle
-
-### Returns
-* `boolean`
-
-## Render:Render(target, source)
-
-Merges two rectangles
-
-### Parameters
-* `target` `table` The target rectangle
-* `source` `table` The source rectangle
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, blink)
-
-Sets the cursor position
-
-### Parameters
-* `x` `number` The x position of the cursor
-* `y` `number` The y position of the cursor
-* `blink` `boolean` Whether the cursor should blink
-
-### Returns
-* `Render`
-
-## Render:Render(x, y, width, height, bg)
-
-Clears an area of the screen
-
-### Parameters
-* `x` `number` The x position of the area
-* `y` `number` The y position of the area
-* `width` `number` The width of the area
-* `height` `number` The height of the area
-* `bg` `colors` The background color to clear the area with
-
-### Returns
-* `Render`
-
-## Render:Render()
-
-Gets the size of the render
-
-### Returns
-* `number`
-
-## Render:Render(width, height)
-
-Sets the size of the render
-
-### Parameters
-* `width` `number` The width of the render
-* `height` `number` The height of the render
-
-### Returns
-* `Render`