DNDGamePlayer: Electron редактор сцен, презентация, упаковка electron-builder

Made-with: Cursor

app/renderer/shared/effects/PxiEffectsOverlay.module.css

@@ -0,0 +1,12 @@
+.host {
+  position: absolute;
+  inset: 0;
+}
+
+.hostInteractive {
+  pointer-events: auto;
+}
+
+.hostPassthrough {
+  pointer-events: none;
+}

app/renderer/shared/effects/PxiEffectsOverlay.pointer.test.ts

@@ -0,0 +1,12 @@
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import test from 'node:test';
+import { fileURLToPath } from 'node:url';
+
+const here = path.dirname(fileURLToPath(import.meta.url));
+
+void test('PxiEffectsOverlay: canvas не перехватывает указатель в режиме без interactive', () => {
+  const src = fs.readFileSync(path.join(here, 'PxiEffectsOverlay.tsx'), 'utf8');
+  assert.ok(src.includes("app.canvas.style.pointerEvents = interactive ? 'auto' : 'none'"));
+});

app/renderer/shared/effects/useEffectsState.ts

@@ -0,0 +1,31 @@
+import { useEffect, useState } from 'react';
+
+import { ipcChannels } from '../../../shared/ipc/contracts';
+import type { EffectsEvent, EffectsState } from '../../../shared/types';
+import { getDndApi } from '../dndApi';
+
+export function useEffectsState(): readonly [
+  EffectsState | null,
+  { dispatch: (event: EffectsEvent) => Promise<void> },
+] {
+  const api = getDndApi();
+  const [state, setState] = useState<EffectsState | null>(null);
+
+  useEffect(() => {
+    void api.invoke(ipcChannels.effects.getState, {}).then((r) => {
+      setState(r.state);
+    });
+    return api.on(ipcChannels.effects.stateChanged, ({ state: next }) => {
+      setState(next);
+    });
+  }, [api]);
+
+  return [
+    state,
+    {
+      dispatch: async (event) => {
+        await api.invoke(ipcChannels.effects.dispatch, { event });
+      },
+    },
+  ] as const;
+}