Sync online documentation

docs/docs/about.md

@@ -1,9 +1,9 @@
 ---
-sidebar_position: 1
+sidebar_position: 0
 ---
 
 # About StarOpenSource UI
-StarOpenSource UI (`sui` for short) is a collection of common ui elements for the [Godot Engine](https://godotengine.org). SUI requires the [CORE Framework](https://core.staropensource.de) to function.
+StarOpenSource UI (`SUI` for short) is a collection of common ui elements for the [Godot Engine](https://godotengine.org). SUI requires the [CORE Framework](https://core.staropensource.de) to function.
 
 # Roadmap
 - [x] Text and Headings

docs/docs/getting-started/_category_.json

@@ -1,6 +1,6 @@
 {
   "label": "Getting started",
-  "position": 2,
+  "position": 1,
   "link": {
     "type": "generated-index",
     "description": "Helps you get SUI set up in your project."

docs/docs/getting-started/setting-up.mdx

@@ -18,6 +18,9 @@ It does not matter which framework branch you choose as StarOpenSource UI only u
 :::
 
 ## Using git
+:::note
+You'll need to execute all commands in your project root.
+:::
 ### Installing SUI
 <Tabs groupId="git">
 <TabItem value="direct-develop" label="Develop branch">

docs/docs/reference/_category_.json

@@ -1,8 +1,8 @@
 {
   "label": "Reference",
-  "position": 3,
+  "position": 2,
   "link": {
     "type": "generated-index",
-    "description": "UI element documentation"
+    "description": "StarOpenSource UI reference"
   }
 }

docs/docs/reference/classes/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "Class reference",
+  "position": 0,
+  "link": {
+    "type": "generated-index",
+    "description": "Classes reference"
+  }
+}

docs/docs/reference/classes/baseclass.md

@@ -0,0 +1,40 @@
+---
+sidebar_position: 1
+---
+
+# `SuiBaseClass`
+A template that can be used to build custom UI elements.
+
+## Variables
+### *Core* <u>core</u>
+Reference to the CORE Object. Set by `_ready()`.
+### *CoreLoggerInstance* <u>logger</u> = *null*
+Reference to a CoreLoggerInstance. Must be set manually.
+
+## Configuration
+:::note
+These are variables, we just labeled them differently.
+:::
+### *bool* <u>editor_process</u> = *true*
+Determines if the element should be updated automatically **while running in the editor**.
+### *bool* <u>runtime_process</u> = *true*
+Determines if the element should be updated automatically, **during your game/application's runtime**.
+
+## Functions
+### *void* <u>_ready</u>()
+Initializes the base class. \
+To run additional code in `_ready()`, use this example:
+```gdscript
+func _ready() -> void:
+  super()
+  # Your code here
+```
+### *void* <u>_process</u>(*float* <u>_delta</u>)
+Calls `update_element()` if allowed to execute.
+### *void* <u>update_element</u>()
+This method is intended to be extended by a child script. \
+Use this to implement your own element update logic.
+### *bool* <u>execute_process</u>()
+Determines if `_process()` is allowed to execute.
+### *bool* <u>in_editor</u>()
+Determines if running inside or outside the editor.

docs/docs/reference/classes/types.md

@@ -0,0 +1,27 @@
+---
+sidebar_position: 0
+---
+
+# `SuiTypes`
+Defines various enums used throughout most user interface elements.
+
+## Enums
+### <u>ScrollVisiblity</u>
+Used for determining the visibility of scroll bars.
+#### Avaiable values
+- AUTO
+- SHOWN
+- HIDDEN
+### <u>ScrollMode</u>
+Used for determining how to get the result of various things.
+#### Available values
+- MULTIPLY_VIEWPORT
+- MULTIPLY_CUSTOM_VALUE
+- CUSTOM_VALUE
+### <u>ScrollDirection</u>
+Indicates some scrolling direction.
+#### Available values
+- UP
+- DOWN
+- LEFT
+- RIGHT

docs/docs/reference/elements/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "Elements reference",
+  "position": 1,
+  "link": {
+    "type": "generated-index",
+    "description": "UI elements reference"
+  }
+}

docs/docs/reference/elements/header.md

@@ -0,0 +1,21 @@
+---
+sidebar_position: 0
+---
+
+# `SuiHeader`
+
+## Variables
+### *bool* <u>bbcode_support</u> = *true*
+Enables support for BBCode.
+### *String* <u>text</u> = *"[center]SuiHeader[/center]"*
+The text you want to display.
+### *int* <u>font_size</u> = *35*
+The size your text should have.
+### *bool* <u>editor_process</u> = *true*
+Determines if the element should be updated automatically **while running in the editor**.
+### *bool* <u>runtime_process</u> = *true*
+Determines if the element should be updated automatically **during your game/application's runtime**.
+
+## Functions
+### *void* <u>update_element</u>()
+Updates the element.

docs/docs/reference/elements/iconbutton.md

@@ -0,0 +1,57 @@
+---
+sidebar_position: 3
+---
+
+# `SuiIconButton`
+
+## Signals
+### <u>down</u>
+- Signature: *none*
+### <u>up</u>
+- Signature: *none*
+### <u>pressed</u>
+- Signature: *none*
+### <u>toggled</u>
+- Signature: *bool* <u>toggled_on</u>
+
+## Variables
+### *bool* <u>disabled</u> = *false*
+Makes the button unable to be interacted with.
+### *bool* <u>toggle_mode</u> = *false*
+Makes the button toggleable.
+### *bool* <u>button_pressed</u> = *false*
+Forwarded from the internal `Button`. Will be overridden with the internal button's value, any changes to this variable will not be reflected.
+### *Texture2D* <u>image</u>
+The image you want to display.
+### *Rect2D* <u>region_rect</u> = *Rect2(0, 0, 0, 0)*
+See [NinePatchRect.region_rect](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-region-rect).
+### *bool* <u>draw_center</u> = *true*
+See [NinePatchRect.draw_center](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-draw-center).
+### *int* <u>ip_left</u> = *0*
+Icon padding (left side).
+### *int* <u>ip_top</u> = *0*
+Icon padding (top side).
+### *int* <u>ip_right</u> = *0*
+Icon padding (right side).
+### *int* <u>ip_bottom</u> = *0*
+Icon padding (bottom side).
+### *int* <u>pm_left</u> = *0*
+See [NinePatchRect.patch_margin_left](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-left).
+### *int* <u>pm_top</u> = *0*
+See [NinePatchRect.patch_margin_top](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-top).
+### *int* <u>pm_right</u> = *0*
+See [NinePatchRect.patch_margin_right](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-right).
+### *int* <u>pm_bottom</u> = *0*
+See [NinePatchRect.patch_margin_bottom](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-bottom).
+### *NinePatchRect.AxisStretchMode* <u>as_horizontal</u> = *0*
+See [NinePatchRect.axis_stretch_horizontal](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-axis-stretch-horizontal).
+### *NinePatchRect.AxisStretchMode* <u>as_vertical</u> = *0*
+See [NinePatchRect.axis_stretch_vertical](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-axis-stretch-vertical).
+### *bool* <u>editor_process</u> = *true*
+Determines if the element should be updated automatically **while running in the editor**.
+### *bool* <u>runtime_process</u> = *true*
+Determines if the element should be updated automatically **during your game/application's runtime**.
+
+## Functions
+### *void* <u>update_element</u>()
+Updates the element.

docs/docs/reference/elements/text.md

@@ -0,0 +1,35 @@
+---
+sidebar_position: 1
+---
+
+# `SuiText`
+
+## Signals
+### <u>meta_clicked</u>
+- Signature: *Variant* <u>meta</u>
+
+Emitted when some interactive BBCode tag (e.g. url) is clicked
+### <u>meta_hover_started</u>
+- Signature: *Variant* <u>meta</u>
+
+Emitted when some interactive BBCode tag (e.g. url) is hovered over
+### <u>meta_hover_ended</u>
+- Signature: *Variant* <u>meta</u>
+
+Emitted when some interactive BBCode tag (e.g. url) is no longre being hovered over
+
+## Variables
+### *bool* <u>bbcode_support</u> = *true*
+Enables support for BBCode
+### *String* <u>text</u> = *"[center]SuiText[/center]"*
+The text you want to display.
+### *int* <u>font_size</u> = *25*
+The size your text should have.
+### *bool* <u>editor_process</u> = *true*
+Determines if the element should be updated automatically **while running in the editor**.
+### *bool* <u>runtime_process</u> = *true*
+Determines if the element should be updated automatically **during your game/application's runtime**.
+
+## Functions
+### *void* <u>update_element</u>()
+Updates the element.

docs/docs/reference/elements/textbutton.md

@@ -1,35 +1,37 @@
 ---
-sidebar_position: 3
+sidebar_position: 2
 ---
 
 # `SuiTextButton`
-A button with text.
 
 ## Signals
 ### <u>down</u>
+- Signature: *none*
 ### <u>up</u>
+- Signature: *none*
 ### <u>pressed</u>
+- Signature: *none*
 ### <u>toggled</u>
 - Signature: *bool* <u>toggled_on</u>
 
 ## Variables
 ### *bool* <u>disabled</u> = *false*
-Disables the button.
+Makes the button unable to be interacted with.
 ### *bool* <u>toggle_mode</u> = *false*
 Makes the button toggleable.
 ### *bool* <u>button_pressed</u> = *false*
-Indicates if the button is pressed/toggled. Will be overwritten with the internal button's value, any manual changes to this variable will not be reflected.
+Forwarded from the internal `Button`. Will be overridden with the internal button's value, any changes to this variable will not be reflected.
 ### *bool* <u>bbcode_support</u> = *true*
-Enables or disables BBCode.
+Enables support for BBCode.
 ### *String* <u>text</u> = *"[center]SuiTextButton[/center]"*
-The text you want it to display.
+The text you want to display.
 ### *int* <u>font_size</u> = *25*
-The size of all text fonts.
+The size your text should have.
 ### *bool* <u>editor_process</u> = *true*
-Determines if the editor script should be executed every frame.
+Determines if the element should be updated automatically **while running in the editor**.
 ### *bool* <u>runtime_process</u> = *true*
-Determines if the runtime script should be executed every frame. `update_element()` needs to be called manually if `false`.
+Determines if the element should be updated automatically **during your game/application's runtime**.
 
 ## Functions
 ### *void* <u>update_element</u>()
-Updates all internal nodes.
+Updates the element.

docs/docs/reference/header.md

@@ -1,22 +0,0 @@
----
-sidebar_position: 1
----
-
-# `SuiHeader`
-Used for headings.
-
-## Variables
-### *bool* <u>bbcode_support</u> = *true*
-Enables or disables BBCode.
-### *String* <u>text</u> = *"[center]SuiHeader[/center]"*
-The text you want it to display.
-### *int* <u>font_size</u> = *35*
-The size of all text fonts.
-### *bool* <u>editor_process</u> = *true*
-Determines if the editor script should be executed every frame.
-### *bool* <u>runtime_process</u> = *true*
-Determines if the runtime script should be executed every frame. `update_element()` needs to be called manually if `false`.
-
-## Functions
-### *void* <u>update_element</u>()
-Updates all internal nodes.

docs/docs/reference/iconbutton.md

@@ -1,60 +0,0 @@
----
-sidebar_position: 4
----
-
-# `SuiIconButton`
-A button with an image.
-
-## Signals
-### <u>down</u>
-### <u>up</u>
-### <u>pressed</u>
-### <u>toggled</u>
-- Signature: *bool* <u>toggled_on</u>
-
-## Variables
-### *bool* <u>disabled</u> = *false*
-Disables the button.
-### *bool* <u>toggle_mode</u> = *false*
-Makes the button toggleable.
-### *bool* <u>button_pressed</u> = *false*
-Indicates if the button is pressed/toggled. Will be overwritten with the internal button's value, any manual changes to this variable will not be reflected.
-### *Texture2D* <u>image</u>
-The image you want to display. \
-Is unset in the script but is set to [Tux](https://en.wikipedia.org/wiki/Tux_(mascot)) in the scene file.
-### *Rect2D* <u>region_rect</u> = *Rect2(0, 0, 0, 0)*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-region-rect)
-### *bool* <u>draw_center</u> = *true*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-draw-center)
-### *int* <u>ip_left</u> = *0*
-The icon padding on the left side. \
-Is set to `0` in the script but is set to `5` in the scene file.
-### *int* <u>ip_top</u> = *0*
-The icon padding on the top side. \
-Is set to `0` in the script but is set to `5` in the scene file.
-### *int* <u>ip_right</u> = *0*
-The icon padding on the right side. \
-Is set to `0` in the script but is set to `5` in the scene file.
-### *int* <u>ip_bottom</u> = *0*
-The icon padding on the bottom side. \
-Is set to `0` in the script but is set to `5` in the scene file.
-### *int* <u>pm_left</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-left)
-### *int* <u>pm_top</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-top)
-### *int* <u>pm_right</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-right)
-### *int* <u>pm_bottom</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-patch-margin-bottom)
-### *NinePatchRect.AxisStretchMode* <u>as_horizontal</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-axis-stretch-horizontal)
-### *NinePatchRect.AxisStretchMode* <u>as_vertical</u> = *0*
-[View in the Godot documentation.](https://docs.godotengine.org/en/4.2/classes/class_ninepatchrect.html#class-ninepatchrect-property-axis-stretch-vertical)
-### *bool* <u>editor_process</u> = *true*
-Determines if the editor script should be executed every frame.
-### *bool* <u>runtime_process</u> = *true*
-Determines if the runtime script should be executed every frame. `update_element()` needs to be called manually if `false`.
-
-## Functions
-### *void* <u>update_element</u>()
-Updates all internal nodes.

docs/docs/reference/text.md

@@ -1,30 +0,0 @@
----
-sidebar_position: 2
----
-
-# `SuiText`
-Used for texts.
-
-## Signals
-### <u>meta_clicked</u>
-- Signature: *Variant* <u>meta</u>
-### <u>meta_hover_started</u>
-- Signature: *Variant* <u>meta</u>
-### <u>meta_hover_ended</u>
-- Signature: *Variant* <u>meta</u>
-
-## Variables
-### *bool* <u>bbcode_support</u> = *true*
-Enables or disables BBCode.
-### *String* <u>text</u> = *"[center]SuiText[/center]"*
-The text you want it to display.
-### *int* <u>font_size</u> = *25*
-The size of all text fonts.
-### *bool* <u>editor_process</u> = *true*
-Determines if the editor script should be executed every frame.
-### *bool* <u>runtime_process</u> = *true*
-Determines if the runtime script should be executed every frame. `update_element()` needs to be called manually if `false`.
-
-## Functions
-### *void* <u>update_element</u>()
-Updates all internal nodes.

docs/package.json

@@ -15,22 +15,22 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@docusaurus/core": "3.1.1",
+    "@docusaurus/core": "3.3.2",
-    "@docusaurus/plugin-client-redirects": "^3.1.1",
+    "@docusaurus/plugin-client-redirects": "^3.3.2",
-    "@docusaurus/plugin-content-docs": "^3.1.1",
+    "@docusaurus/plugin-content-docs": "^3.3.2",
-    "@docusaurus/plugin-sitemap": "^3.1.1",
+    "@docusaurus/plugin-sitemap": "^3.3.2",
-    "@docusaurus/preset-classic": "3.1.1",
+    "@docusaurus/preset-classic": "3.3.2",
-    "@mdx-js/react": "^3.0.0",
+    "@mdx-js/react": "^3.0.1",
-    "clsx": "^2.0.0",
+    "clsx": "^2.1.1",
-    "prism-react-renderer": "^2.3.0",
+    "prism-react-renderer": "^2.3.1",
-    "react": "^18.0.0",
+    "react": "^18.3.1",
-    "react-dom": "^18.0.0"
+    "react-dom": "^18.3.1"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "3.1.1",
+    "@docusaurus/module-type-aliases": "3.3.2",
-    "@docusaurus/tsconfig": "3.1.1",
+    "@docusaurus/tsconfig": "3.3.2",
-    "@docusaurus/types": "3.1.1",
+    "@docusaurus/types": "3.3.2",
-    "@types/node": "^20.11.0",
+    "@types/node": "^20.12.11",
     "typescript": "~5.2.2"
   },
   "browserslist": {

sui/src/SuiBaseClass.gd

@@ -2,9 +2,9 @@
 extends Control
 class_name SuiBaseClass
 
-## Reference to the [CORE] Object.
+## Reference to the [CORE] Object. Set by [method _ready].
 var core: Core
-## Reference to a [CoreLoggerInstance]
+## Reference to a [CoreLoggerInstance]. Must be set manually.
 var logger: CoreLoggerInstance = null
 
 @export_category("Debugging")
@@ -14,26 +14,32 @@ var logger: CoreLoggerInstance = null
 @export var runtime_process: bool = true
 
 # +++ initialization and process methods +++
-# Initializes the base class
+## Initializes the base class.[br]
+## To run additional code in `_ready()`, use this example:
+## [/codeblock]
+## func _ready() -> void:
+##     super()
+##     # Your code here
+## [/codeblock]
 func _ready() -> void:
 	if !in_editor(): core = get_node("/root/CORE")
 
-# Calls 'update_element()' if allowed to execute
+## Calls [method update_element] if allowed to execute
 func _process(_delta: float):
 	if execute_process(): update_element()
 
 # +++ element updating +++
-# This should be used by the element extending this script
+## This method is intended to be extended by a child script.[br]
-# to provide their own update logic.
+## Use this to implement your own element update logic.
 func update_element() -> void: pass
 
 # +++ etc +++
-# Determines if '_process()' is allowed to execute
+## Determines if [method _process] is allowed to execute-
 func execute_process() -> bool:
 	if in_editor() and !editor_process: return false
 	elif !in_editor() and !runtime_process: return false
 	else: return true
 
-# Determines if running inside the editor
+## Determines if running inside or outside the editor-
 func in_editor() -> bool:
 	return get_node_or_null("/root/CORE") == null

sui/src/SuiHeader.gd

@@ -7,7 +7,7 @@ extends SuiBaseClass
 @export var bbcode_support: bool = true
 ## The text you want to display.
 @export_multiline var text: String = "[center]SuiHeader[/center]"
-## The size your font should have.
+## The size your text should have.
 @export var font_size: int = 35
 
 func update_element() -> void:

sui/src/SuiIconButton.gd

@@ -7,25 +7,33 @@ extends SuiBaseClass
 @export var disabled: bool = false
 ## Makes the button toggleable.
 @export var toggle_mode: bool = false
-## Forwarded from the internal [Button]. Will be overwritten with the internal button's value, any manual changes to this variable will not be reflected.
+## Forwarded from the internal [Button]. Will be overriden with the internal button's value, any changes to this variable will not be reflected.
 @export var button_pressed: bool = false
 @export_subgroup("Icon")
 ## The image you want to display.
 @export var image: Texture2D
-## See [member NinePatchRect.region_rect]
+## See [member NinePatchRect.region_rect].
 @export var region_rect: Rect2 = Rect2(0, 0, 0, 0)
-## See [member NinePatchRect.draw_center]
+## See [member NinePatchRect.draw_center].
 @export var draw_center: bool = true
 @export_category("Advanced Configuration")
 @export_subgroup("Icon Padding")
+## Icon padding (left side)
 @export var ip_left: int = 0
+## Icon padding (top side)
 @export var ip_top: int = 0
+## Icon padding (right side)
 @export var ip_right: int = 0
+## Icon padding (bottom side)
 @export var ip_bottom: int = 0
 @export_subgroup("Patch Margin")
+## See [member NinePatchRect.patch_margin_left].
 @export var pm_left: int = 0
+## See [member NinePatchRect.patch_margin_top].
 @export var pm_top: int = 0
+## See [member NinePatchRect.patch_margin_right].
 @export var pm_right: int = 0
+## See [member NinePatchRect.patch_margin_bottom].
 @export var pm_bottom: int = 0
 @export_subgroup("Axis Stretch")
 ## See [member NinePathRect.axis_stretch_horizontal].

sui/src/SuiText.gd

@@ -7,7 +7,7 @@ extends SuiBaseClass
 @export var bbcode_support: bool = true
 ## The text you want to display.
 @export_multiline var text: String = "[center]SuiText[/center]"
-## The size your font should have.
+## The size your text should have.
 @export var font_size: int = 25
 
 ## Emitted when some interactive BBCode tag (e.g. url) is clicked

sui/src/SuiTypes.gd

@@ -1,16 +1,19 @@
 extends Node
 class_name SuiTypes
 
+## Used for determining the visibility of scroll bars.
 enum ScrollVisibility {
 	AUTO,
 	SHOWN,
 	HIDDEN
 }
+## Used for determining how to get the result of various things.
 enum ScrollMode {
 	MULTIPLY_VIEWPORT,
 	MULTIPLY_CUSTOM_VALUE,
 	CUSTOM_VALUE
 }
+## Indicates some scrolling direction.
 enum ScrollDirection {
 	UP,
 	DOWN,