- Added Layout System

- Added Grid Layout
- Removed Flexbox

this will make it easy to apply layouts on all container types.

Author: NoryiE

layouts/grid.lua

@@ -0,0 +1,59 @@
+local grid = {}
+
+--- Calculates positions for all children in a grid layout
+--- @param instance table The layout instance
+---   - container: the container to layout
+---   - options: layout options
+---     - rows: number of rows (optional, auto-calculated if not provided)
+---     - columns: number of columns (optional, auto-calculated if not provided)
+---     - spacing: gap between cells (default: 0)
+---     - padding: padding around the grid (default: 0)
+function grid.calculate(instance)
+    local container = instance.container
+    local options = instance.options or {}
+
+    local children = container.get("children")
+    local containerWidth = container.get("width")
+    local containerHeight = container.get("height")
+
+    local spacing = options.spacing or 0
+    local padding = options.padding or 0
+    local rows = options.rows
+    local columns = options.columns
+
+    local childCount = #children
+    if not rows and not columns then
+        columns = math.ceil(math.sqrt(childCount))
+        rows = math.ceil(childCount / columns)
+    elseif rows and not columns then
+        columns = math.ceil(childCount / rows)
+    elseif columns and not rows then
+        rows = math.ceil(childCount / columns)
+    end
+
+    local availableWidth = containerWidth - (2 * padding) - ((columns - 1) * spacing)
+    local availableHeight = containerHeight - (2 * padding) - ((rows - 1) * spacing)
+    local cellWidth = math.floor(availableWidth / columns)
+    local cellHeight = math.floor(availableHeight / rows)
+
+    local positions = {}
+
+    for i, child in ipairs(children) do
+        local row = math.floor((i - 1) / columns)
+        local col = (i - 1) % columns
+
+        local x = padding + 1 + (col * (cellWidth + spacing))
+        local y = padding + 1 + (row * (cellHeight + spacing))
+
+        positions[child] = {
+            x = x,
+            y = y,
+            width = cellWidth,
+            height = cellHeight
+        }
+    end
+
+    instance._positions = positions
+end
+
+return grid

src/elements/Container.lua

@@ -205,6 +205,9 @@ end
 function Container:sortChildren()
     self.set("visibleChildren", sortAndFilterChildren(self, self._values.children))
     self.set("childrenSorted", true)
+    if self._layoutInstance then
+        self:updateLayout()
+    end
     return self
 end
 
@@ -685,6 +688,49 @@ function Container:render()
     end
 end
 
+--- Applies a layout from a file to this container
+--- @shortDescription Applies a layout to the container
+--- @param layoutPath string Path to the layout file (e.g. "layouts/grid")
+--- @param options? table Optional layout-specific options
+--- @return Container self For method chaining
+function Container:applyLayout(layoutPath, options)
+    local LayoutManager = require("layoutManager")
+
+    if self._layoutInstance then
+        LayoutManager.destroy(self._layoutInstance)
+    end
+
+    self._layoutInstance = LayoutManager.apply(self, layoutPath)
+    if options then
+        self._layoutInstance.options = options
+    end
+
+    return self
+end
+
+--- Updates the current layout (recalculates positions)
+--- @shortDescription Updates the layout
+--- @return Container self For method chaining
+function Container:updateLayout()
+    if self._layoutInstance then
+        local LayoutManager = require("layoutManager")
+        LayoutManager.update(self._layoutInstance)
+    end
+    return self
+end
+
+--- Removes the current layout
+--- @shortDescription Clears the layout
+--- @return Container self For method chaining
+function Container:clearLayout()
+    if self._layoutInstance then
+        local LayoutManager = require("layoutManager")
+        LayoutManager.destroy(self._layoutInstance)
+        self._layoutInstance = nil
+    end
+    return self
+end
+
 
 --- @private
 function Container:destroy()