update according 1.7.6

src/content/docs/config/custom-service.md

@@ -117,7 +117,7 @@ const slider = Widget.Slider({
 });
 
 const label = Label({
-    label: brightness.bind('screen-value').transform(v => `${v}`),
+    label: brightness.bind('screen-value').as(v => `${v}`),
     setup: self => self.hook(brightness, (self, screenValue) => {
         // screenValue is the passed parameter from the 'screen-changed' signal
         self.label = screenValue ?? 0;

src/content/docs/config/first-widgets.md

@@ -196,7 +196,7 @@ const bar = Widget.Window({
     name: 'bar',
     anchor: ['top', 'left', 'right'],
     child: Widget.Label({
-        label: myVariable.bind().transform(v => `value: ${v}`)
+        label: myVariable.bind().as(v => `value: ${v}`)
     }),
 })
 
@@ -227,7 +227,7 @@ pactl.connect('changed', ({ value }) => {
 })
 
 const label = Widget.Label({
-    label: pactl.bind().transform(({ count, msg }) => {
+    label: pactl.bind().as(({ count, msg }) => {
         return `${msg} ${count}`
     }),
 })
@@ -250,7 +250,7 @@ of a single `value` they have more attributes and methods on them.
 const battery = await Service.import('battery')
 
 const batteryProgress = Widget.CircularProgress({
-    value: battery.bind('percent').transform(p => p / 100),
+    value: battery.bind('percent').as(p => p / 100),
     child: Widget.Icon({
         icon: battery.bind('icon_name'),
     }),

src/content/docs/config/reactivity.md

@@ -81,7 +81,7 @@ and [Variables](./variables) that can be used inside constructors.
 Label({
     label: Battery
         .bind('percent')
-        .transform(p => `${p}%`)
+        .as(p => `${p}%`)
 })
 ```
 
@@ -91,7 +91,7 @@ const text = Variable('hello')
 Label({
     label: text
         .bind()
-        .transform(v => `transformed ${v}`)
+        .as(v => `transformed ${v}`)
 })
 ```
 

src/content/docs/config/services.md

@@ -17,20 +17,30 @@ const widget = Widget.Label()
         self.label = 'new label'
     }, 'changed')
 
-    // [prop, Service, targetProp, transfrom = out => out]
+    // [prop, Service, targetProp, transform = out => out]
     .bind('label', SomeService, 'service-prop', function(serviceProp) {
         return `transformed ${serviceProp}`
     })
 ```
 
 ```js
 Widget.Label({
-    label: someService.bind('service-prop').transfrom(serviceProp => {
+    label: someService.bind('service-prop').as(serviceProp => {
         return `transformed ${serviceProp}`
     }),
 })
 ```
 
+Utility to have multiple bindings as one
+
+```js
+Widget.Label({
+    label: Utils.merge([service1.bind("prop1"), service2.bind("prop2")], (p1, p2) => {
+        return `service1.prop1: ${p1}, service2.prop2: ${p2}`
+    }),
+})
+```
+
 Services can be also connected outside of widgets
 
 ```js

src/content/docs/config/subclassing-gtk-widgets.md

@@ -51,7 +51,7 @@ function CounterButton(({ color = 'aqua', ...rest })) {
     const count = Variable(0);
 
     const label = Widget.Label({
-        label: count.bind().transform(v => `count: ${v}`),
+        label: count.bind().as(v => `count: ${v}`),
         style: `color: ${color}`,
     });
 

src/content/docs/config/utils.md

@@ -90,25 +90,26 @@ proc.force_exit()
 ```ts
 function readFile(file: string | Gio.File): string
 function readFileAsync(file: string | Gio.File): Promise<string>
+
+function writeFileSync(string: string, path: string): Gio.File
+function writeFile(string: string, path: string): Promise<Gio.File>
 ```
 
-### Synchronously reading, returns a string
+### Synchronously
 
 ```js
-const contents = Utils.readFile('path-to-file')
+const contents = Utils.readFile('/path/to/file')
+
+Utils.writeFileSync('/path/to/file', 'some content')
 ```
 
-### Asynchronously reading, returns a Promise
+### Asynchronously
 
 ```js
 Utils.readFileAsync('path-to-file')
     .then(content => print('contents of the file: ' + content))
     .catch(logError)
-```
-
-### Asynchronously writing, returns a Promise
 
-```js
 Utils.writeFile('Contents: Hi Mom', 'path-to-file')
     .then(file => print('file is the Gio.File'))
     .catch(err => print(err))
@@ -120,7 +121,6 @@ Utils.writeFile('Contents: Hi Mom', 'path-to-file')
 function monitorFile(
     path: string,
     callback?: (file: Gio.File, event: Gio.FileMonitorEvent) => void,
-    type: 'file' | 'directory' = 'file',
     flags = Gio.FileMonitorFlags.NONE,
 ): Gio.FileMonitor | null
 ```

src/content/docs/config/variables.md

@@ -50,6 +50,20 @@ myVar.value = 'new-value'
 myVar.setValue('new-value')
 ```
 
+:::caution
+using `setValue` will force a new value and thus signal `changed`,
+while setting `value` only signal if it gets a new value
+
+```js
+const myVar = Variable({ key: "value" })
+const value = myVar.value
+value["new-key"] = "value"
+myVar.value = value // won't emit, because its still the same object
+myVar.setValue(value) // will emit the signal
+```
+
+:::
+
 ### Getting its value
 
 ```js
@@ -87,7 +101,7 @@ const label = Widget.Label({
     label: myVar.bind(),
 
     // optional transform method
-    label: myVar.bind().transform(value => value.toString()),
+    label: myVar.bind().as(value => value.toString()),
 
     // hook to do more than an assignment on changed
     setup: self => self.hook(myVar, () => {
@@ -139,3 +153,16 @@ const ramProgress = Widget.CircularProgress({
     value: ram.bind()
 })
 ```
+
+## Derived Variables
+
+```js
+const a = Variable(2)
+const b = Variable(3)
+
+// first argument is a list of dependencies
+// second argument is a transform function
+const c = Utils.derive([a, b], (a, b) => {
+    return a * b
+})
+```

src/content/docs/config/widgets.md

@@ -172,7 +172,7 @@ const progress = Widget.CircularProgress({
         'background-color: #131313;' + // set its bg color
         'color: aqua;', // set its fg color
 
-    value: battery.bind('percent').transform(p => p / 100),
+    value: battery.bind('percent').as(p => p / 100),
     child: Widget.Icon({
         icon: battery.bind('icon-name'),
     }),

src/content/docs/services/battery.md

@@ -29,7 +29,7 @@ const batteryProgress = Widget.CircularProgress({
         icon: battery.bind('icon_name')
     }),
     visible: battery.bind('available'),
-    value: battery.bind('percent').transform(p => p > 0 ? p / 100 : 0),
-    class_name: battery.bind('charging').transform(ch => ch ? 'charging' : ''),
+    value: battery.bind('percent').as(p => p > 0 ? p / 100 : 0),
+    class_name: battery.bind('charging').as(ch => ch ? 'charging' : ''),
 })
 ```

src/content/docs/services/bluetooth.md

@@ -59,7 +59,7 @@ const connectedList = Widget.Box({
 })
 
 const indicator = Widget.Icon({
-    icon: bluetooth.bind('enabled').transform(on =>
+    icon: bluetooth.bind('enabled').as(on =>
         `bluetooth-${on ? 'active' : 'disabled'}-symbolic`),
 })
 ```

src/content/docs/services/hyprland.md

@@ -8,10 +8,10 @@ title: Hyprland
 * `urgent-window`: `(windowaddress: int)`
 * `keyboard-layout`: `(keyboardname: string, layoutname: string)`
 * `submap`: `(name: string)`
-* `monitor-added`: `(name: string)`
-* `monitor-removed`: `(name: string)`
-* `workspace-added`: `(name: string)`
-* `workspace-removed`: `(name: string)`
+* `monitor-added`: `(name: number)`
+* `monitor-removed`: `(name: number)`
+* `workspace-added`: `(name: number)`
+* `workspace-removed`: `(name: number)`
 * `client-added`: `(address: string)`
 * `client-removed`: `(address: string)`
 
@@ -27,7 +27,8 @@ title: Hyprland
 * `getMonitor`: `(id: number) => Monitor`
 * `getWorkspace`: `(id: number) => Workspace`
 * `getClient`: `(address: string) => Client`
-* `sendMessage`: `(msg: string) => Promise<string>`: send a message to the [hyprland socket](https://wiki.hyprland.org/IPC/#tmphyprhissocketsock)
+* `message`: `(msg: string) => string`: send a message to the [hyprland socket](https://wiki.hyprland.org/IPC/#tmphyprhissocketsock)
+* `messageAsync`: `(msg: string) => Promise<string>`: async version of message
 
 ## Active
 
@@ -78,10 +79,10 @@ const hyprland = await Service.import('hyprland')
 const focusedTitle = Widget.Label({
     label: hyprland.active.client.bind('title'),
     visible: hyprland.active.client.bind('address')
-        .transform(addr => !!addr),
+        .as(addr => !!addr),
 })
 
-const dispatch = ws => hyprland.sendMessage(`dispatch workspace ${ws}`);
+const dispatch = ws => hyprland.messageAsync(`dispatch workspace ${ws}`);
 
 const Workspaces = () => Widget.EventBox({
     onScrollUp: () => dispatch('+1'),

src/content/docs/services/mpris.md

@@ -75,6 +75,6 @@ const Player = player => Widget.Button({
 })
 
 const players = Widget.Box({
-    children: mpris.bind('players').transform(p => p.map(Player))
+    children: mpris.bind('players').as(p => p.map(Player))
 })
 ```

src/content/docs/services/network.md

@@ -68,7 +68,7 @@ const WifiIndicator = () => Widget.Box({
         }),
         Widget.Label({
             label: network.wifi.bind('ssid')
-                .transform(ssid => ssid || 'Unknown'),
+                .as(ssid => ssid || 'Unknown'),
         }),
     ],
 })
@@ -82,6 +82,6 @@ const NetworkIndicator = () => Widget.Stack({
         ['wifi', WifiIndicator()],
         ['wired', WiredIndicator()],
     ],
-    shown: network.bind('primary').transform(p => p || 'wifi'),
+    shown: network.bind('primary').as(p => p || 'wifi'),
 })
 ```

src/content/docs/services/systemtray.md

@@ -59,6 +59,6 @@ const SysTrayItem = item => Widget.Button({
 });
 
 const sysTray = Widget.Box({
-    children: systemtray.bind('items').transform(i => i.map(SysTrayItem))
+    children: systemtray.bind('items').as(i => i.map(SysTrayItem))
 })
 ```