ags/widget/Bar.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

import { App, Astal, Gtk, Gdk, Widget } from "astal/gtk3"
import { Variable } from "astal"
import { BoxProps, CenterBoxProps } from "astal/gtk3/widget"

const { TOP, LEFT, RIGHT, BOTTOM } = Astal.WindowAnchor
const { START, CENTER, END } = Gtk.Align

const time = Variable("").poll(1000, "date")

function VerticalCenterBox(props: CenterBoxProps) {
  return <centerbox
    {...props}
    vertical
  />
}

function VerticalBox(props: BoxProps) {
  return <box
    {...props}
    vertical
  />
}

export default function Bar(gdkmonitor: Gdk.Monitor) {
  return <window
    name="Bar"
    className="Bar"
    gdkmonitor={gdkmonitor}
    exclusivity={Astal.Exclusivity.EXCLUSIVE}
    anchor={TOP | LEFT | BOTTOM}
    application={App}>
    <VerticalCenterBox>
      <button
        onClicked="echo hello"
        halign={CENTER}
        valign={START}
      >
        Welcome to AGS!
      </button>
      <VerticalBox>
        <label>CIAO</label>
        <label>CIAO</label>
      </VerticalBox>
      <button
        onClicked={() => print("hello")}
        halign={CENTER}
        valign={END}
      >
        <label label={time()} />
      </button>
    </VerticalCenterBox>
  </window>
}