Writing documentation in widgets.md, will deploy doxygen API reference tomorrow.

docs/widgets.md

@@ -1,12 +1,81 @@
-<details>
+## JUI Widget Directory
-<summary>Widget</summary>
+Updated on 2025-06-25 / Release-6.4 [^1]
-This is some information about the Widget class.
+
+See also:
+
+[Animation](animation.md)   <br/>
+[Layout](layout.md)         <br/>
+[Overview](overview.md)     <br/>
+[Styling](styling.md)       <br/>
+[Full API Reference](https://doc.redacted.cc/jui) <br/>
+[Repository](https://git.redacted.cc/josh/ReJUI)
+
+<details><summary>Widget</summary>
+
+* The [Widget](doc.redacted.cc/jui/) is the basis of all GUI elements in JUI. 
+  * It is an abstract class, and you should not directly instantiate `Widget` for use in your UI. 
+    * Instead, create its concrete derived types (`Button`, `Text`, `Slider`) or your own custom derivation.
+      * `class Widget` serves as the starting point for creating custom widgets.
+* Widgets are organized in a tree-like hierarchy, where each widget can have multiple **children** and a single **parent**.
+  * This structure dictates rendering order, event propagation, and coordinate systems. 
+    * Operations like updating, drawing, and event dispatching typically traverse this hierarchy **recursively**.
+  * A Widget's on-screen position is always relative to its parent. This simplifies layout management, as moving a parent automatically moves all its children. Sizing is also handled in relation to the parent.
+* Widgets can be given a custom string identifier which can be used to search for it in the hierarchy later.
+  * ```Widget::Name("unique_element_4");```
+  
+```cpp
+// Dispatch a "MouseMovement" event until a widget indicates that it has "observed" the event.
+for (auto* widget : my_element->GetChildren()) {
+    if (widget->ObserveMouseMovement({420, 420}) return;
+}
+
+// Listens for an event of a child widget being added.
+// These event-hooks are provided to make customization easier without requiring you to derive the class.
+my_element->ChildAdded += [] (Widget* child) {
+    child->Name("New Child Element!");
+};
+```
 </details>
 
+<details><summary>Scene</summary>
+
+
+* The [Scene]() widget acts as the **root container** for all your JUI elements within a window or application.
+  * It's the top-level `Widget` that manages the entire hierarchy of your UI.
+    * You'll typically have one `Scene` per window, serving as the canvas upon which all other widgets are placed and rendered.
+* Every JUI application or window requires a `Scene` to host its user interface. 
+  * All other widgets become descendants of the `Scene`.
+  * A scene is a **mandatory** component for a JUI application. You cannot display widgets without placing them in a `Scene`.
+* Unlike other `Widget` types, a `Scene` does not have a parent itself. It's the **root** of the hierarchy.
+* Event Sink - Events from the OS / Framework (mouse clicks, key presses) are first received by the `Scene`, which then initiates the recursive dispatch process down its tree.
+* Z-Ordering: While individual widgets use Z-Index for sibling ordering, the `Scene` ensures that its entire content is rendered correctly, typically on top of the OpenGL scene if applicable.
+* A scene's viewport (aka canvas size) can be set to the window viewport, or an arbitrary value.
+  * The scene provides a GlobalUIScale property, that can be used to scale an entire GUI uniformly.
+
+```cpp
+auto* scene = new JUI::Scene();
+
+auto* text = new JUI::Text(scene);
+text->Content("Hello, World!");
+
+void app_key_press(Key key) {
+    // Returns whether any widget should have "consumed" the event.
+    bool sunk = scene->ObserveKeyInput(key, true); 
+}
+
+void app_key_release(Key key) {
+    // Returns whether any widget should have "consumed" the event.
+    bool sunk = scene->ObserveKeyInput(key, false); 
+}
+```
+
+</details>
 
 <details>
 <summary>BindMenu</summary>
-This is some information about the Widget class.
+
+### The BindMenu Widget is a work-in-progress. Check back in Prerelease 7.
+
 </details>
 
 <details>
@@ -16,12 +85,29 @@ This is some information about the Widget class.
 
 
 <details><summary>Checkbox</summary>
-This is some information about the Widget class.
+
+* The `Checkbox` widget provides a simple binary toggle input, allowing users to select or deselect an option.
+  * Typically Consists of a small square box
+* Also see LabeledCheckbox for a Checkbox with integrated text.
 </details>
 
 
 <details><summary>Collapsible</summary>
-This is some information about the Widget class.
+
+* The `Collapsible` widget provides a way to **show or hide** a section of UI content with a single click, typically on a header or title bar.
+  * It's a space-saving component that allows users to expand details when needed and collapse them to reduce visual clutter.
+    * It's ideal for settings panels, property inspectors, or long lists of categorized information.
+* Usages:
+  * Settings Panel - Group related settings that can be expanded individually.
+  * Accordions - Create a series of Collapsibles where only one can be open at a time, by combining them with custom logic on the open/close events.
+  * Property Inspectors - Display object properties that can be shown or hidden.
+  * Information Hiding - Presenting advanced options or less frequently used details that don't need to be visible by default.
+  * Debug Overlays - Containing logs or diagnostic tools that can be toggled open.
+* Notes
+  * Content Container
+  * Toggle Mechanism
+  * Layout Impact
+  * Initial State
 </details>
 
 <details><summary>ColorPicker</summary>
@@ -116,9 +202,7 @@ This is some information about the Widget class.
 This is some information about the Widget class.
 </details>
 
-<details><summary>Scene</summary>
+
-This is some information about the Widget class.
-</details>
 
 <details><summary>ScrollingRect</summary>
 This is some information about the Widget class.
@@ -129,7 +213,39 @@ This is some information about the Widget class.
 </details>
 
 <details><summary>Slider</summary>
-This is some information about the Widget class.
+
+* The `Slider` Widget allows users to select a value from a continuous or discrete range by moving a **scrubber** (or thumb, dragger, etc.) along a **track**.
+* `Slider` is a specialization of the `Rect` widget.
+* Usages:
+  * Volume Control
+  * Brightess/Contrast
+  * Color Picker (JUI actually has [one](ColorPicker) built-in that uses `Sliders`!)
+  * Progress Indicator (Just kidding, use a `ProgressBar` for this!);
+  * Game Settings
+    * Field-of-view.
+    * Sensitivity
+    * Spell power, physics parameters.
+  * Numerical Input (Range-Bound): An alternative to a text input field when the allowed values are within a known, limited range.
+* Notes:
+  * Orientation: ===Currently, JUI does not **yet** have vertical sliders.===
+  * Range and Step:  You can define a minimum and maximum value for the slider;
+    * As well as a "step" quantity, forcing the slider to snap to discrete increments (ie. multiples of 5, or increments of 0.25)
+  * Event-Driven - The "value changed" event fires when the user moves the scrubber or the value is set programmatically.
+
+```cpp
+
+auto* sfx_volume_slider = new JUI::Slider(my_scene);
+
+sfx_volume_slider->Minimum(0);
+sfx_volume_slider->Maximum(100);
+sfx_volume_slider->Interval(1);
+sfx_volume_slider->CurrentValue(50);
+sfx_volume_slider->ValueChanged += [](float value) {
+    // set audio engine SFX volume.
+};
+
+```
+* Also see `LabeledSlider` for a slider with text.
 </details>
 
 <details><summary>Table</summary>

src/JUI/Widgets/Tooltip.cpp

@@ -6,14 +6,13 @@ void JUI::Tooltip::Update(float delta) {
     {
         auto coords = InputService::GetMousePosition();
 
-
         auto rel_pos = parent->GetAbsolutePosition();
 
         auto rel_udim = UDim2::FromPixels(rel_pos.x, rel_pos.y);
 
         auto anchor = AnchorPoint();
 
-        Position(UDim2::FromPixels(coords.x - rel_pos.x, coords.y - rel_pos.y));
+        Position(UDim2::FromPixels(coords.x - rel_pos.x, coords.y - rel_pos.y - GetAbsoluteSize().y));
         Visible(true);
     } else
         Visible(false);