feat: native Wayland support and NixOS dev setup

.envrc

@@ -0,0 +1 @@
+use flake .

.gitignore

@@ -58,4 +58,7 @@ packages/react-devtools-extensions/.tempUserDataDir
 out
 
 # Cursor files
-.cursorrules
+.cursorrules
+
+# direnv local cache (committed: .envrc)
+.direnv

README.md

@@ -8,13 +8,36 @@ An Electron application with React and TypeScript
 
 ## Project Setup
 
-### Install
+### Using Nix (Recommended for NixOS users)
+
+With [direnv](https://direnv.net/) and [nix-direnv](https://github.com/nix-community/nix-direnv):
+
+```bash
+direnv allow   # one-time, auto-loads the flake on every cd
+npm install
+npm run dev
+```
+
+Without direnv:
+
+```bash
+nix develop
+npm install
+npm run dev
+```
+
+The flake provides a NixOS-patched Electron binary via `ELECTRON_OVERRIDE_DIST_PATH`,
+so no `LD_LIBRARY_PATH` exports are needed.
+
+### Manual Setup
+
+#### Install
 
 ```bash
 $ npm install
 ```
 
-### Development
+#### Development
 
 ```bash
 $ npm run dev

flake.nix

@@ -0,0 +1,26 @@
+{
+  inputs.nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
+
+  outputs =
+    { nixpkgs, ... }:
+    let
+      systems = [
+        "x86_64-linux"
+        "aarch64-linux"
+      ];
+      forAllSystems = f: nixpkgs.lib.genAttrs systems (system: f nixpkgs.legacyPackages.${system});
+    in
+    {
+      devShells = forAllSystems (pkgs: {
+        default = pkgs.mkShell {
+          packages = [ pkgs.nodejs pkgs.electron ];
+          # Use the NixOS-patched Electron instead of the pre-built npm binary.
+          # pkgs.electron has correct RPATHs baked in, supports native Wayland
+          # (ozone/Chromium), and needs no LD_LIBRARY_PATH workarounds.
+          # electron-vite reads ELECTRON_EXEC_PATH before falling back to
+          # node_modules/electron/dist/electron.
+          ELECTRON_EXEC_PATH = "${pkgs.electron}/bin/electron";
+        };
+      });
+    };
+}

src/main/index.ts

@@ -4,6 +4,15 @@ import { electronApp, optimizer } from "@electron-toolkit/utils";
 import { WindowManager } from "./window-manager";
 import { MenuManager } from "./menu-manager";
 
+// Fix GBM buffer object creation failures with DRM format modifiers on Wayland.
+// These switches must be set before app.whenReady().
+if (process.platform === 'linux' && (process.env.WAYLAND_DISPLAY || process.env.XDG_SESSION_TYPE === 'wayland')) {
+  app.commandLine.appendSwitch('disable-features', 'UseChromeOSDirectVideoDecoder,VaapiVideoDecoder');
+  // Disable DMA-buf zero-copy scanout path that triggers GBM BO modifier allocation failures
+  // on some GPU/driver combinations when Electron resizes GPU-backed surfaces on Wayland.
+  app.commandLine.appendSwitch('disable-zero-copy');
+}
+
 let windowManager: WindowManager;
 let menuManager: MenuManager;
 let isQuitting = false;
@@ -71,6 +80,7 @@ function setupIPC(): void {
     const sources = await desktopCapturer.getSources({ types: ['screen'] });
     return sources[0].id;
   });
+
 }
 
 app.whenReady().then(() => {

src/main/window-manager.ts

@@ -5,6 +5,9 @@ import { join } from 'path';
 import { is } from '@electron-toolkit/utils';
 
 const isMac = process.platform === 'darwin';
+const isWayland =
+  process.platform === 'linux' &&
+  (!!process.env.WAYLAND_DISPLAY || process.env.XDG_SESSION_TYPE === 'wayland');
 
 export class WindowManager {
   private window: BrowserWindow | null = null;
@@ -179,7 +182,7 @@ export class WindowManager {
       });
     }
 
-    this.window?.setIgnoreMouseEvents(false, { forward: true });
+    this.window.setIgnoreMouseEvents(false);
 
     this.window.webContents.send('mode-changed', 'window');
   }
@@ -203,24 +206,20 @@ export class WindowManager {
 
   private continueSetWindowModePet(): void {
     if (!this.window) return;
-    // Calculate the bounding rectangle that covers all connected displays.
-    // This allows the transparent pet-mode window to span across monitors,
-    // so the avatar can be dragged freely between them.
+
+    // Span all connected displays so the avatar can be dragged freely between monitors.
+    // On Wayland the overlay works identically — applyIgnoreMouseEvents strips the
+    // X11-only { forward: true } flag which was the original crash trigger.
     const displays = screen.getAllDisplays();
     const minX = Math.min(...displays.map((d) => d.bounds.x));
     const minY = Math.min(...displays.map((d) => d.bounds.y));
     const maxX = Math.max(...displays.map((d) => d.bounds.x + d.bounds.width));
     const maxY = Math.max(...displays.map((d) => d.bounds.y + d.bounds.height));
-    const combinedWidth = maxX - minX;
-    const combinedHeight = maxY - minY;
-
-    // Resize and position the window to cover the entire virtual screen
-    // so the avatar is not clipped when dragged to a second monitor.
     this.window.setBounds({
       x: minX,
       y: minY,
-      width: combinedWidth,
-      height: combinedHeight,
+      width: maxX - minX,
+      height: maxY - minY,
     });
 
     if (isMac) this.window.setWindowButtonVisibility(false);
@@ -229,32 +228,32 @@ export class WindowManager {
     this.window.setFocusable(false);
 
     if (isMac) {
-      this.window.setIgnoreMouseEvents(true);
-      this.window.setVisibleOnAllWorkspaces(true, {
-        visibleOnFullScreen: true,
-      });
-    } else {
-      this.window.setIgnoreMouseEvents(true, { forward: true });
+      this.window.setVisibleOnAllWorkspaces(true, { visibleOnFullScreen: true });
     }
 
+    this.applyIgnoreMouseEvents(true);
     this.window.webContents.send('mode-changed', 'pet');
   }
-  
+
   getWindow(): BrowserWindow | null {
     return this.window;
   }
 
-  setIgnoreMouseEvents(ignore: boolean): void {
+  // Applies setIgnoreMouseEvents with platform-correct options.
+  // { forward: true } is an X11 input-shape feature — on Wayland it causes compositor crashes.
+  private applyIgnoreMouseEvents(ignore: boolean): void {
     if (!this.window) return;
-
-    if (isMac) {
+    if (isMac || isWayland) {
       this.window.setIgnoreMouseEvents(ignore);
-      // this.window.setIgnoreMouseEvents(ignore, { forward: true });
     } else {
       this.window.setIgnoreMouseEvents(ignore, { forward: true });
     }
   }
 
+  setIgnoreMouseEvents(ignore: boolean): void {
+    this.applyIgnoreMouseEvents(ignore);
+  }
+
   maximizeWindow(): void {
     if (!this.window) return;
 
@@ -295,11 +294,7 @@ export class WindowManager {
 
     if (this.window) {
       const shouldIgnore = this.hoveringComponents.size === 0;
-      if (isMac) {
-        this.window.setIgnoreMouseEvents(shouldIgnore);
-      } else {
-        this.window.setIgnoreMouseEvents(shouldIgnore, { forward: true });
-      }
+      this.applyIgnoreMouseEvents(shouldIgnore);
       if (!shouldIgnore) {
         this.window.setFocusable(true);
       }
@@ -309,25 +304,8 @@ export class WindowManager {
   // Toggle force ignore mouse events
   toggleForceIgnoreMouse(): void {
     this.forceIgnoreMouse = !this.forceIgnoreMouse;
-
-    // Apply the new setting immediately
-    if (this.forceIgnoreMouse) {
-      if (isMac) {
-        this.window?.setIgnoreMouseEvents(true);
-      } else {
-        this.window?.setIgnoreMouseEvents(true, { forward: true });
-      }
-    } else {
-      // Reapply normal behavior based on hovering components
-      const shouldIgnore = this.hoveringComponents.size === 0;
-      if (isMac) {
-        this.window?.setIgnoreMouseEvents(shouldIgnore);
-      } else {
-        this.window?.setIgnoreMouseEvents(shouldIgnore, { forward: true });
-      }
-    }
-
-    // Notify renderer about the change
+    const shouldIgnore = this.forceIgnoreMouse || this.hoveringComponents.size === 0;
+    this.applyIgnoreMouseEvents(shouldIgnore);
     this.window?.webContents.send('force-ignore-mouse-changed', this.forceIgnoreMouse);
   }
 

src/renderer/src/hooks/canvas/use-live2d-model.ts

@@ -238,6 +238,7 @@ export const useLive2DModel = ({
         const matrix = model._modelMatrix.getArray();
         modelStartPos.current = { x: matrix[12], y: matrix[13] };
       }
+
     }
   }, [canvasRef, modelInfo]);
 

src/renderer/src/hooks/canvas/use-live2d-resize.ts

@@ -13,6 +13,7 @@ const MAX_SCALE = 5.0;
 const EASING_FACTOR = 0.3; // Controls animation smoothness
 const WHEEL_SCALE_STEP = 0.03; // Scale change per wheel tick
 const DEFAULT_SCALE = 1.0; // Default scale if not specified
+const SCALE_EPSILON = 0.0005; // Convergence threshold for animation loop
 
 interface UseLive2DResizeProps {
   containerRef: RefObject<HTMLDivElement>;
@@ -39,6 +40,23 @@ export const applyScale = (scale: number) => {
   }
 };
 
+/**
+ * Reads the current model matrix scale (X axis).
+ * Returns undefined if the model isn't ready.
+ */
+const readModelScale = (): number | undefined => {
+  try {
+    const manager = LAppLive2DManager.getInstance();
+    if (!manager) return undefined;
+    const model = manager.getModel(0);
+    if (!model) return undefined;
+    // @ts-ignore
+    return model._modelMatrix.getScaleX();
+  } catch {
+    return undefined;
+  }
+};
+
 /**
  * Hook to handle Live2D model resizing and scaling
  * Provides smooth scaling animation and window resize handling
@@ -102,6 +120,13 @@ export const useLive2DResize = ({
     const currentScale = lastScaleRef.current;
     const diff = clampedTargetScale - currentScale;
 
+    if (Math.abs(diff) < SCALE_EPSILON) {
+      applyScale(clampedTargetScale);
+      lastScaleRef.current = clampedTargetScale;
+      isAnimatingRef.current = false;
+      return;
+    }
+
     const newScale = currentScale + diff * EASING_FACTOR;
     applyScale(newScale);
     lastScaleRef.current = newScale;
@@ -117,6 +142,15 @@ export const useLive2DResize = ({
     e.preventDefault();
     if (!modelInfo?.scrollToResize) return;
 
+    // Sync from actual model scale before computing new target to prevent
+    // jumps when refs drifted (e.g. after model reload while animation was stopped).
+    if (!isAnimatingRef.current) {
+      const actual = readModelScale();
+      if (actual !== undefined && actual > 0) {
+        lastScaleRef.current = actual;
+      }
+    }
+
     const direction = e.deltaY > 0 ? -1 : 1;
     const increment = WHEEL_SCALE_STEP * direction;
 
@@ -205,6 +239,16 @@ export const useLive2DResize = ({
         console.warn('[Resize] LAppDelegate instance not found.');
       }
 
+      // Sync scale refs with the actual model matrix to prevent desync
+      // after model reloads or external scale changes (e.g. onUpdate setWidth).
+      if (!isAnimatingRef.current) {
+        const actualScale = readModelScale();
+        if (actualScale !== undefined && actualScale > 0) {
+          lastScaleRef.current = actualScale;
+          targetScaleRef.current = actualScale;
+        }
+      }
+
       isResizingRef.current = false;
     } catch (error) {
       isResizingRef.current = false;