Add theme customizer.

src/SettingsDialog.zig

@@ -32,6 +32,7 @@ const gobject = @import("gobject");
 const gtk = @import("gtk");
 
 const Layouts = @import("Layouts.zig");
+const PaletteEditor = @import("PaletteEditor.zig");
 const Settings = @import("Settings.zig");
 const appearance = @import("appearance.zig");
 
@@ -95,6 +96,10 @@ ctx: ?*anyopaque,
 /// re-checked without asking each button what it stands for.
 theme_buttons: [std.enums.values(Settings.Theme).len]*gtk.ToggleButton,
 
+/// The palette editor under the theme picker. Held because changing the scheme
+/// changes which palette it is editing, so it has to be told.
+colors: *PaletteEditor,
+
 /// Container the startup rows live in, so rows can be added and removed after
 /// the page is already on screen.
 startup_box: *gtk.Box,
@@ -129,10 +134,17 @@ pub fn present(alloc: std.mem.Allocator, parent: *gtk.Window, opts: Options) !vo
         .on_capture = opts.on_capture,
         .ctx = opts.ctx,
         .theme_buttons = undefined,
+        .colors = undefined,
         .startup_box = gtk.Box.new(.vertical, 6),
         .error_label = gtk.Label.new(null),
     };
 
+    self.colors = try PaletteEditor.create(alloc, .{
+        .on_report = &onEditorReport,
+        .ctx = self,
+    });
+    errdefer self.colors.destroy();
+
     self.window.setTitle("Settings");
     self.window.setTransientFor(parent);
     self.window.setModal(1);
@@ -196,7 +208,7 @@ pub fn close() void {
 // -------------------------------------------------------------------------
 // Appearance
 
-/// The Appearance section: one row, the colour scheme.
+/// The Appearance section: the colour scheme, and the palette it resolves to.
 fn buildAppearance(self: *SettingsDialog) *gtk.Widget {
     const group = gtk.Box.new(.vertical, 10);
     group.as(gtk.Widget).addCssClass("playpen-settings-group");
@@ -227,10 +239,19 @@ fn buildAppearance(self: *SettingsDialog) *gtk.Widget {
     row.append(self.buildThemeChoice());
 
     group.append(row.as(gtk.Widget));
+    group.append(self.colors.widget());
 
     return group.as(gtk.Widget);
 }
 
+/// The palette editor's half of the error label the startup list below already
+/// reports through, so a settings file that can't be written says so in one
+/// place however the edit arrived.
+fn onEditorReport(ctx: ?*anyopaque, message: ?[:0]const u8) void {
+    const self: *SettingsDialog = @ptrCast(@alignCast(ctx.?));
+    self.showError(message);
+}
+
 /// The scheme picker: one toggle per choice, drawn as a single linked control.
 ///
 /// They are not put in a GTK radio group. Grouped toggles can't be unchecked by
@@ -292,6 +313,10 @@ fn onThemeToggled(button: *gtk.ToggleButton, self: *SettingsDialog) callconv(.c)
     }
 
     appearance.setTheme(values[index]);
+
+    // The palette editor edits whichever scheme is on screen, and that is what
+    // just changed: its swatches now stand for the other palette's colours.
+    self.colors.refresh();
 }
 
 // -------------------------------------------------------------------------
@@ -757,6 +782,7 @@ fn onDestroy(_: *gtk.Window, self: *SettingsDialog) callconv(.c) void {
 
     for (self.startup.items) |row| self.freeRow(row);
     self.startup.deinit(self.alloc);
+    self.colors.destroy();
     self.alloc.destroy(self);
 }