ags/widget/bar/bar.tsx

46 lines
1.5 KiB
TypeScript

import { App, Astal, Gdk, Gtk } from "astal/gtk4"
import { Binding } from "astal"
import Battery from "gi://AstalBattery";
import { BatteryInfo } from "./components/battery";
import DateTime from "@lib/widgets/datetime";
import Workspace from "./workspace";
import TrayView from "./tray";
export default function Bar(monitor_id: number) {
const { BOTTOM, LEFT, RIGHT } = Astal.WindowAnchor
const CENTER = Gtk.Align.CENTER;
const battery = Battery.get_default();
const openQuickSettings = (_self: Gtk.Button, state: Gdk.ButtonEvent) => {
if (state.get_button() === Gdk.BUTTON_PRIMARY)
App.get_window("quick_settings")?.show()
}
return <window
visible
name={`bar_${monitor_id}`}
monitor={monitor_id}
cssClasses={["bar"]}
exclusivity={Astal.Exclusivity.EXCLUSIVE}
anchor={BOTTOM | LEFT | RIGHT}
application={App}>
<box halign={CENTER} cssClasses={["inner"]}>
{[
Workspace(),
<menubutton hasFrame={false}>
<DateTime format="%d.%m.%Y %H:%M:%S" interval={1000} />
<popover>
<Gtk.Calendar />
</popover>
</menubutton>,
BatteryInfo({ battery }),
<button hasFrame={false} iconName={"applications-system-symbolic"} onButtonPressed={openQuickSettings} />,
TrayView()
]}
</box>
</window>
}