Migrate Utils and Thener to new structure

docs/in-production.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 5
+sidebar_position: 6
 ---
 
 # Use In Production

docs/intro.md

@@ -25,7 +25,7 @@ OnyxUI is structured as a collection of modules, separated by folders. This is u
 local OnyxUI = require(path.to.OnyxUI)
 
 -- Utils
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Color)
 
 -- Components

docs/styling-props.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 4
+sidebar_position: 5
 ---
 
 # Styling Props

docs/themer.md

@@ -0,0 +1,20 @@
+---
+sidebar_position: 3
+---
+
+# Themer
+
+Themer allows you to customize components throughout OnyxUI, with support for things like colors, corner radiuses, paddings, etc. You'll also probably want to incorporate it within your own UI for a more consistent design.
+
+## Sample themes
+
+- [OnyxNight](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/OnyxNight.lua)
+- [BitCave](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/BitCave.lua)
+
+## Making your own theme
+
+:::tip
+Check out the [`ThemeTemplate`](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/ThemeTemplate.lua) file for a reference of properties you can specify in your theme. Make sure to not include Fusion `Value`s in yours.
+:::
+
+Once you've created your own theme, you can load it into OnyxUI with `Themer:Set()`.

docs/utils.md

@@ -1,30 +1,11 @@
 ---
-sidebar_position: 3
+sidebar_position: 4
 ---
 
 # Utils
 
 Important utilities for UI development. These are also used by OnyxUI itself!
 
-## Themer
-
-Themer allows you to customize components throughout OnyxUI, with support for things like colors, corner radiuses, paddings, etc. You'll also probably want to incorporate it within your own UI for a more consistent design.
-
-### Default themes
-
-Some themes are included by default, which can be seen here:
-
-- [OnyxNight](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/OnyxNight.lua)
-- [BitCave](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/BitCave.lua)
-
-### Making your own theme
-
-:::tip
-Check out the [`ThemeTemplate`](https://github.com/ImAvafe/OnyxUI/blob/main/src/Utils/Themer/ThemeTemplate.lua) file for a reference of properties you can specify in your theme.
-:::
-
-Once you've created your own theme, you can load it into OnyxUI with `Themer:Set()`.
-
 ## EnsureValue
 
 Want to ensure your component props are Fusion `Value`s? This makes it a one-line operation.

src/Components/Avatar.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Colors)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)

src/Components/Avatar.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Colors)
 
 local Children = Fusion.Children

src/Components/Badge.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local ColorUtils = require(OnyxUI.Parent.ColorUtils)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)

src/Components/Badge.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Colors)
 
 local Children = Fusion.Children

src/Components/Base.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/BaseButton.lua

@@ -3,7 +3,7 @@ local SoundService = game:GetService("SoundService")
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/Button.lua

@@ -8,7 +8,7 @@ local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local ColorUtils = require(OnyxUI.Parent.ColorUtils)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/Button.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/Card.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 
 local Computed = Fusion.Computed

src/Components/Card.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local New = Fusion.New
 local Children = Fusion.Children

src/Components/Checkbox.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local ColorUtils = require(OnyxUI.Parent.ColorUtils)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)

src/Components/Checkbox.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Colors)
 
 local Children = Fusion.Children

src/Components/Divider.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 

src/Components/IconButton.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 

src/Components/IconButton.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local Colors = require(OnyxUI.Utils.Colors)
 
 local Children = Fusion.Children

src/Components/Image.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local New = Fusion.New
 local Children = Fusion.Children

src/Components/MenuFrame.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 
 local Computed = Fusion.Computed

src/Components/MenuFrame.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/NumberSpinner/init.lua

@@ -2,7 +2,7 @@ local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local NumberSpinner = require(script.NumberSpinner)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/ProgressBar.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/ProgressBar.story.lua

@@ -3,7 +3,7 @@ local OnyxUI = script.Parent.Parent
 local Colors = require(ReplicatedStorage.OnyxUI.Packages.OnyxUI.Utils.Colors)
 local Fusion = require(OnyxUI.Parent.Fusion)
 local ColorUtils = require(OnyxUI.Parent.ColorUtils)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Value = Fusion.Value

src/Components/ScrollingFrame.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)

src/Components/SwitchGroup.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 
 local BaseButton = require(script.Parent.BaseButton)

src/Components/SwitchInput.lua

@@ -2,7 +2,7 @@ local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 local ColorUtils = require(OnyxUI.Parent.ColorUtils)

src/Components/SwitchInput.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/Text.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Computed = Fusion.Computed
 local Hydrate = Fusion.Hydrate

src/Components/TextArea.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/TextInput.lua

@@ -3,7 +3,7 @@ local SoundService = game:GetService("SoundService")
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/TextInput.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Components/TitleBar.lua

@@ -1,7 +1,7 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
 local EnsureValue = require(OnyxUI.Utils.EnsureValue)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local PubTypes = require(OnyxUI.Utils.PubTypes)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 

src/Components/TitleBar.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local Children = Fusion.Children
 local Computed = Fusion.Computed

src/Examples/SettingsMenu.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 local CombineProps = require(OnyxUI.Utils.CombineProps)
 
 local Children = Fusion.Children

src/Examples/SettingsMenu.story.lua

@@ -1,6 +1,6 @@
 local OnyxUI = script.Parent.Parent
 local Fusion = require(OnyxUI.Parent.Fusion)
-local Themer = require(OnyxUI.Utils.Themer)
+local Themer = require(OnyxUI.Themer)
 
 local New = Fusion.New
 local Children = Fusion.Children

src/Utils/init.lua

@@ -5,15 +5,13 @@
 ]=]
 
 local Colors = require(script.Colors)
-local Themer = require(script.Themer)
 local EnsureValue = require(script.EnsureValue)
 local CombineProp = require(script.CombineProps)
 local ReconcileValues = require(script.ReconcileValues)
 local GetValue = require(script.GetValue)
 
 return {
 	Colors = Colors,
-	Themer = Themer,
 	EnsureValue = EnsureValue,
 	CombineProp = CombineProp,
 	ReconcileValues = ReconcileValues,