const Hyprland = await Service.import('hyprland'); const { Box, EventBox, Revealer, Window } = Widget; // Types import { Variable as Var } from 'types/variable'; import { BoxGeneric, DefaultProps } from 'global-types'; const BarCloser = (variable: Var) => Window({ name: 'bar-closer', visible: false, anchor: ['top', 'bottom', 'left', 'right'], layer: 'overlay', child: EventBox({ on_hover: (self) => { variable.value = false; const parent = self.get_parent(); if (parent) { parent.visible = false; } }, child: Box({ css: 'padding: 1px', }), }), }); export default (props?: DefaultProps) => { const Revealed = Variable(true); const barCloser = BarCloser(Revealed); return Box({ css: 'min-height: 1px', hexpand: true, vertical: true, setup: (self) => { const checkCurrentWsFsState = () => { const workspace = Hyprland.getWorkspace( Hyprland.active.workspace.id, ); if (workspace) { Revealed.value = !workspace['hasfullscreen']; } }; const checkGlobalFsState = (_: BoxGeneric, fullscreen: boolean) => { Revealed.value = !fullscreen; }; self .hook(Hyprland.active, checkCurrentWsFsState) .hook(Hyprland, checkGlobalFsState, 'fullscreen'); }, children: [ Revealer({ ...props, transition: 'slide_down', reveal_child: true, }).bind('reveal_child', Revealed), Revealer({ reveal_child: Revealed.bind() .transform((v) => !v), child: EventBox({ on_hover: () => { barCloser.visible = true; Revealed.value = true; }, child: Box({ css: 'min-height: 5px;', }), }), }), ], }); };