✨ ags: new window management system, adjustments, use adwaita sans

ags/widget/control-center/Pages.ts

@@ -2,20 +2,29 @@ import { timeout, Variable } from "astal";
 import { Gtk, Widget } from "astal/gtk3";
 import { Page } from "./pages/Page";
 
-const currentPage = new Variable<Page|undefined>(undefined);
+const currentPage = new Variable<Page | undefined>(undefined);
+let pagesInstance: (Widget.Revealer | undefined);
 
-export const PagesWidget: Widget.Revealer = new Widget.Revealer({
-    revealChild: false,
-    className: "pages",
-    transitionType: Gtk.RevealerTransitionType.SLIDE_DOWN,
-    transitionDuration: 360,
-    child: currentPage((page: (Page|undefined)) => 
-        !page ? new Widget.Box() : page.getPage())
-} as Widget.RevealerProps);
+export const PagesWidget = () => {
+    const revealer = new Widget.Revealer({
+        revealChild: false,
+        className: "pages",
+        transitionType: Gtk.RevealerTransitionType.SLIDE_DOWN,
+        transitionDuration: 360,
+        child: currentPage((page: (Page|undefined)) => 
+            !page ? new Widget.Box() : page.getPage())
+    } as Widget.RevealerProps);
+
+    pagesInstance = revealer;
+
+    return revealer;
+}
 
 export function showPages(page: Page): void {
+    if(!pagesInstance) return;
+
     currentPage.set(page);
-    PagesWidget.set_reveal_child(true);
+    pagesInstance.set_reveal_child(true);
     page.props.onOpen && page.props.onOpen();
 }
 
@@ -24,7 +33,9 @@ export function getPage(): (Page|undefined) {
 }
 
 export function togglePage(page: Page): void {
-    if(!PagesWidget.revealChild) {
+    if(!pagesInstance) return;
+
+    if(!pagesInstance.revealChild) {
         showPages(page);
         return;
     }
@@ -33,10 +44,12 @@ export function togglePage(page: Page): void {
 }
 
 export function hidePages() {
-    PagesWidget.set_reveal_child(false);
+    if(!pagesInstance) return;
+
+    pagesInstance.set_reveal_child(false);
     if(!currentPage.get()) return;
 
-    timeout(500, () => {
+    timeout(pagesInstance.transitionDuration || 500, () => {
         if(currentPage.get() && currentPage.get()?.props.onClose) 
             currentPage.get()!.props.onClose!();