Added calendar widget

The widget is an embedded gtk4 calendar which can be styled as such.

Written with the assistance of Qwen Code.

Author: trevarj

README.md

@@ -93,6 +93,7 @@ These widgets can be customized, added, removed and even reordered
 - Do Not Disturb
 - Notifications (Will always be visible)
 - Label
+- Calendar
 - Mpris (Media player controls for Spotify, Firefox, Chrome, etc...)
 - Menubar with dropdown and buttons
 - Button grid

data/style/style.scss

@@ -398,3 +398,5 @@ notificationwindow, blankwindow {
 @import "widgets/backlight";
 /* Inhibitors widget */
 @import "widgets/inhibitors";
+/* Calendar widget */
+@import "widgets/calendar";

data/style/widgets/calendar.scss

@@ -0,0 +1,28 @@
+// Calendar widget styling
+.widget-calendar {
+  padding: 12px;
+  margin: 8px;
+
+  .day-label {
+    font-size: 18px;
+    font-weight: bold;
+    color: var(--text-color);
+    margin-bottom: 2px;
+  }
+
+  .date-label {
+    font-size: 14px;
+    color: var(--text-color);
+    opacity: 0.8;
+    margin-bottom: 8px;
+  }
+
+  calendar {
+    background: rgba(var(--noti-bg), var(--noti-bg-alpha));
+    border: var(--border);
+    border-radius: var(--border-radius);
+    padding: 8px;
+    color: var(--text-color);
+    font-size: 14px;
+  }
+}

src/configSchema.json

@@ -423,6 +423,9 @@
         "^inhibitors(#[a-zA-Z0-9_-]{1,}){0,1}?$": {
           "$comment": "References the widget structure from \"widgets\" below",
           "$ref": "#/widgets/inhibitors"
+        },
+        "^calendar(#[a-zA-Z0-9_-]{1,}){0,1}?$": {
+          "$ref": "#/widgets/calendar"
         }
       }
     }
@@ -790,6 +793,23 @@
           "default": "Clear All"
         }
       }
+    },
+    "calendar": {
+      "type": "object",
+      "description": "Control Center Calendar Widget",
+      "additionalProperties": false,
+      "properties": {
+        "show-day-label": {
+          "type": "boolean",
+          "description": "Whether to show the day label (e.g., \"Monday\")",
+          "default": true
+        },
+        "show-date-label": {
+          "type": "boolean",
+          "description": "Whether to show the date label (e.g., \"January 1, 2024\")",
+          "default": true
+        }
+      }
     }
   }
 }

src/controlCenter/widgets/calendar/calendar.vala

@@ -0,0 +1,72 @@
+using GLib;
+
+namespace SwayNotificationCenter.Widgets {
+    public class Calendar : BaseWidget {
+        public override string widget_name {
+            get {
+                return "calendar";
+            }
+        }
+
+        Gtk.Calendar calendar;
+        Gtk.Label date_label;
+        Gtk.Label day_label;
+
+        public Calendar (string suffix) {
+            base (suffix);
+
+            Json.Object ?config = get_config (this);
+
+            var container = new Gtk.Box (Gtk.Orientation.VERTICAL, 6);
+            container.set_margin_start (12);
+            container.set_margin_end (12);
+            container.set_margin_top (12);
+            container.set_margin_bottom (12);
+            container.set_hexpand (true);
+
+            day_label = new Gtk.Label ("");
+            day_label.add_css_class ("day-label");
+            day_label.set_halign (Gtk.Align.START);
+
+            date_label = new Gtk.Label ("");
+            date_label.add_css_class ("date-label");
+            date_label.set_halign (Gtk.Align.START);
+
+            calendar = new Gtk.Calendar ();
+            calendar.set_hexpand (true);
+            calendar.add_css_class ("calendar-widget");
+
+            if (config != null) {
+                bool ?show_day_label = get_prop<bool> (config, "show-day-label", null);
+                if (show_day_label == false) {
+                    day_label.hide ();
+                }
+
+                bool ?show_date_label = get_prop<bool> (config, "show-date-label", null);
+                if (show_date_label == false) {
+                    date_label.hide ();
+                }
+            }
+
+            container.append (day_label);
+            container.append (date_label);
+            container.append (calendar);
+            append (container);
+
+            calendar.day_selected.connect (update_labels);
+            update_labels ();
+        }
+
+        void update_labels () {
+            var now = new GLib.DateTime.now_local ();
+            day_label.set_label (now.format ("%A"));
+            date_label.set_label (now.format ("%B %-d, %Y"));
+        }
+
+        public override void on_cc_visibility_change (bool value) {
+            if (value) {
+                update_labels ();
+            }
+        }
+    }
+}

src/controlCenter/widgets/factory.vala

@@ -37,6 +37,9 @@ namespace SwayNotificationCenter.Widgets {
             case "slider":
                 widget = new Slider (suffix);
                 break;
+            case "calendar":
+                widget = new Calendar (suffix);
+                break;
 #if HAVE_PULSE_AUDIO
             case "volume":
                 widget = new Volume (suffix);

src/meson.build

@@ -50,6 +50,8 @@ widget_sources = [
   'controlCenter/widgets/backlight/backlightUtil.vala',
   # Widget: Inhibitors
   'controlCenter/widgets/inhibitors/inhibitors.vala',
+  # Widget: Calendar
+  'controlCenter/widgets/calendar/calendar.vala',
 ]
 
 app_sources = [