✨ ags,hypr: initial code!

ags/widget/bar/CCToggle.tsx

@@ -0,0 +1,11 @@
+import {Process} from "astal";
+import { Box, Button } from "astal/gtk3/widget";
+
+export function CCToggle() {
+    return (
+        <Box className={"cc-toggle"}>
+            <Button onClick={() => Process.exec("eww open --toggle control-center")} 
+                    label={"󰂚"}/>
+        </Box>
+    )
+}

ags/widget/bar/Clock.tsx

@@ -0,0 +1,14 @@
+import { Box, Button } from "astal/gtk3/widget";
+import { GLib, Variable } from "astal";
+
+const dateTimeFormat = "%A %d, %H:%M"
+const time = new Variable<string>("").poll(600, () => 
+    GLib.DateTime.new_now_local().format(dateTimeFormat)!);
+
+export function Clock(): JSX.Element {
+    return (
+        <Box className={"clock"}>
+            <Button label={time()} />
+        </Box>
+    )
+}

ags/widget/bar/Logo.tsx

@@ -0,0 +1,10 @@
+import { Box, Button } from "astal/gtk3/widget";
+import { Process } from "astal";
+
+export function Logo() {
+    return (
+        <Box className={"logo"}>
+            <Button onClick={ () => Process.exec("hyprctl dispatch exec anyrun") } label={""} />
+        </Box>
+    )
+}

ags/widget/bar/Tray.tsx

@@ -0,0 +1,17 @@
+import { Box, Label } from "astal/gtk3/widget";
+import AstalTray from "gi://AstalTray"
+
+const astalTray = AstalTray.get_default();
+let items: Array<AstalTray.TrayItem> = astalTray.items;
+
+const handlerId = astalTray.connect("item-added", () => {
+    items = astalTray.items;
+    console.log(astalTray.items);
+}) as number;
+
+export function Tray() {
+    return (
+        <Box className={"tray"}>
+        </Box>
+    );
+}

ags/widget/bar/Workspaces.tsx

@@ -0,0 +1,21 @@
+import { bind } from "astal";
+import { Widget } from "astal/gtk3";
+import AstalHyprland from "gi://AstalHyprland";
+
+const hyprland = AstalHyprland.get_default();
+
+export function Workspaces() {
+    return new Widget.Box({
+        className: "workspaces",
+        children: bind(hyprland, "workspaces").as((workspaces) =>
+            workspaces.sort((a: AstalHyprland.Workspace, b: AstalHyprland.Workspace) =>
+                    a.get_id() - b.get_id())
+            .map((workspace: AstalHyprland.Workspace) => 
+                new Widget.Button({
+                    className: bind(hyprland, "focusedWorkspace").as((focusedWs: AstalHyprland.Workspace) => workspace === focusedWs ? "focus" : ""),
+                    onClicked: () => workspace.focus()
+                } as Widget.ButtonProps)
+            )
+        )
+    } as Widget.BoxProps);
+}