working bar

widget/battery.tsx

@@ -0,0 +1,14 @@
+import { bind } from "astal"
+import Battery from "gi://AstalBattery"
+
+export default function BatteryLevel() {
+  const bat = Battery.get_default()
+
+  return <box
+    cssClasses={["Battery"]}
+    visible={bind(bat, "isPresent")}>
+    <image iconName={bind(bat, "batteryIconName")} />
+    <label label={bind(bat, "percentage").as(p => `${Math.floor(p * 100)}%`)} />
+  </box>
+
+}