library: Add Calendar Entry (#239)

Author: SoNiC-HeRE

src/Library/demos/Calendar/main.blp

@@ -0,0 +1,25 @@
+using Gtk 4.0;
+using Adw 1;
+
+Adw.StatusPage {
+  title: "Calendar";
+  description: "Display a Gregorian calendar, one month at a time";
+
+  Box {
+    orientation: vertical;
+    halign: center;
+
+    Calendar calendar {
+      show-day-names: true;
+      show-week-numbers: false;
+      show-heading: true;
+      margin-bottom: 18;
+      day: 1;
+    }
+
+    LinkButton {
+      label: "API Reference";
+      uri: "https://docs.gtk.org/gtk4/class.Calendar.html";
+    }
+  }
+}

src/Library/demos/Calendar/main.js

@@ -0,0 +1,22 @@
+const calendar = workbench.builder.get_object("calendar");
+
+// calendar.get_date() returns a GLib.DateTime object
+// https://docs.gtk.org/glib/struct.DateTime.html
+
+calendar.connect("notify::day", () => {
+  console.log(calendar.get_date().format("%e"));
+});
+
+calendar.connect("notify::month", () => {
+  console.log(calendar.get_date().format("%B"));
+});
+
+calendar.connect("notify::year", () => {
+  console.log(calendar.get_date().format("%Y"));
+});
+
+calendar.connect("day-selected", () => {
+  console.log(calendar.get_date().format_iso8601());
+});
+
+calendar.mark_day(15);

src/Library/demos/Calendar/main.json

@@ -0,0 +1,10 @@
+{
+  "name": "Calendar",
+  "category": "user_interface",
+  "description": "Display a Gregorian calendar, one month at a time",
+  "panels": [
+    "ui",
+    "preview"
+  ],
+  "autorun": true
+}