# useMousePosition

Fluxlay デスクトップアプリからストリーミングされるグローバルマウス位置イベントをサブスクライブします。

## インポート

```tsx
import { useMousePosition } from "@fluxlay/react";
```

## シグネチャ

```tsx
function useMousePosition(): { x: number; y: number };
```

## 戻り値

マウス位置は**壁紙ウィンドウに対して正規化**されており、両軸とも `-1` 〜 `1` の範囲です。

| プロパティ | 範囲       | 説明                                                       |
| ---------- | ---------- | ---------------------------------------------------------- |
| `x`        | `-1` … `1` | `-1` がウィンドウ左端、`1` が右端。                        |
| `y`        | `-1` … `1` | `-1` がウィンドウ下端、`1` が上端（数学的 Y 軸: 上が正）。 |

最初のイベントを受信するまで `{ x: 0, y: 0 }` を返します。

## ピクセル座標への変換

ビューポートサイズを掛けて、Y は CSS と反対なので反転させます。

```tsx
const px = ((x + 1) / 2) * window.innerWidth;
const py = (1 - (y + 1) / 2) * window.innerHeight;
```

## 備考

- Y 軸は数学的座標系（上が正）です。CSS は上が負（下が正）なので、`top` や `translateY` に使う前に変換してください。
- ウィンドウラベルは `window_label` クエリパラメータから読み取られ、デフォルトは `"main"` です。
- サブスクリプションはウィンドウ単位で、各壁紙ウィンドウは自分自身に対して正規化された座標を受け取ります。
- Fluxlay デスクトップアプリの外では `{ x: 0, y: 0 }` を返します。