add(sizing): grow configuration

Currently the 'grid' and 'mixed' examples are not working yet.

examples/demo.zig

@@ -61,7 +61,9 @@ pub fn main() !void {
             .padding = .vertical(2),
             .direction = .vertical,
         },
-        .size = .{ .y = 90 },
+        .size = .{
+            .dim = .{ .y = 90 },
+        },
     }, .{});
     try box.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .light_green },
@@ -91,11 +93,15 @@ pub fn main() !void {
             .color = .light_blue,
             .sides = .all,
         },
-        .size = .{ .x = 100 },
+        .size = .{
+            .dim = .{ .x = 100 },
+        },
     }, .{}));
     try container.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .blue },
-        .size = .{ .x = 30 },
+        .size = .{
+            .dim = .{ .x = 30 },
+        },
     }, .{}));
     defer container.deinit(); // also de-initializes the children
 

examples/elements/scrollable.zig

@@ -98,15 +98,21 @@ pub fn main() !void {
     }, .{});
     try top_box.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .light_green },
-        .size = .{ .y = 30 },
+        .size = .{
+            .dim = .{ .y = 30 },
+        },
     }, .{}));
     try top_box.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .light_green },
-        .size = .{ .y = 5 },
+        .size = .{
+            .dim = .{ .y = 5 },
+        },
     }, element));
     try top_box.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .light_green },
-        .size = .{ .y = 2 },
+        .size = .{
+            .dim = .{ .y = 2 },
+        },
     }, .{}));
     defer top_box.deinit();
 
@@ -123,6 +129,9 @@ pub fn main() !void {
             .direction = .vertical,
             .padding = .vertical(1),
         },
+        .size = .{
+            .dim = .{ .y = 30 },
+        },
     }, .{});
     try bottom_box.append(try App.Container.init(allocator, .{
         .rectangle = .{ .fill = .grey },

examples/styles/palette.zig

@@ -64,7 +64,7 @@ pub fn main() !void {
         if (comptime field.value == 0) continue; // zterm.Color.default == 0 -> skip
         try box.append(try App.Container.init(allocator, .{ .rectangle = .{ .fill = @enumFromInt(field.value) } }, .{}));
     }
-    var scrollable: App.Scrollable = .init(box, .{ .x = 3 * std.meta.fields(zterm.Color).len }); // ensure enough columns to render all colors -> scrollable otherwise
+    var scrollable: App.Scrollable = .{ .container = box };
     try container.append(try App.Container.init(allocator, .{}, scrollable.element()));
 
     try app.start();

examples/styles/text.zig

@@ -114,10 +114,7 @@ pub fn main() !void {
     }, text_styles.element());
     defer box.deinit();
 
-    var scrollable: App.Scrollable = .init(box, .{
-        .x = std.meta.fields(zterm.Style.Emphasis).len * TextStyles.text.len,
-        .y = (std.meta.fields(zterm.Color).len - 1) * (std.meta.fields(zterm.Color).len - 2),
-    }); // ensure enough rows and/or columns to render all text styles -> scrollable otherwise
+    var scrollable: App.Scrollable = .{ .container = box };
     try container.append(try App.Container.init(allocator, .{}, scrollable.element()));
 
     try app.start();