react-native-chess-kit 0.4.2 → 0.5.1

package/src/use-board-pieces.ts

@@ -1,158 +1,158 @@
-import { useMemo, useRef } from 'react';
-
-import type { ChessColor, BoardPiece, ParsedPiece } from './types';
-
-const FEN_PIECE_MAP: Record<string, { code: string; color: 'w' | 'b' }> = {
-  p: { code: 'bp', color: 'b' },
-  r: { code: 'br', color: 'b' },
-  n: { code: 'bn', color: 'b' },
-  b: { code: 'bb', color: 'b' },
-  q: { code: 'bq', color: 'b' },
-  k: { code: 'bk', color: 'b' },
-  P: { code: 'wp', color: 'w' },
-  R: { code: 'wr', color: 'w' },
-  N: { code: 'wn', color: 'w' },
-  B: { code: 'wb', color: 'w' },
-  Q: { code: 'wq', color: 'w' },
-  K: { code: 'wk', color: 'w' },
-};
-
-const FILES = 'abcdefgh';
-
-/**
- * Parse the piece-placement part of a FEN string into an array of pieces.
- * Pure function — no React dependencies, suitable for worklets if needed.
- */
-function parseFenPieces(fen: string): ParsedPiece[] {
-  const placement = fen.split(' ')[0];
-  const ranks = placement.split('/');
-  const pieces: ParsedPiece[] = [];
-
-  for (let rankIdx = 0; rankIdx < ranks.length; rankIdx++) {
-    const rank = ranks[rankIdx];
-    let fileIdx = 0;
-
-    for (const char of rank) {
-      if (char >= '1' && char <= '8') {
-        fileIdx += parseInt(char, 10);
-        continue;
-      }
-
-      const mapping = FEN_PIECE_MAP[char];
-      if (mapping) {
-        // FEN ranks are from rank 8 (index 0) down to rank 1 (index 7)
-        const square = `${FILES[fileIdx]}${8 - rankIdx}`;
-        pieces.push({ code: mapping.code, square, color: mapping.color });
-      }
-      fileIdx++;
-    }
-  }
-
-  return pieces;
-}
-
-/**
- * Convert square notation to pixel coordinates (top-left corner).
- * Orientation-aware: flips the board when playing as black.
- */
-export function squareToXY(
-  square: string,
-  squareSize: number,
-  orientation: ChessColor,
-): { x: number; y: number } {
-  'worklet';
-  const fileIdx = square.charCodeAt(0) - 97; // 'a'=0 .. 'h'=7
-  const rankIdx = parseInt(square[1], 10) - 1; // '1'=0 .. '8'=7
-
-  const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
-  const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
-
-  return { x: col * squareSize, y: row * squareSize };
-}
-
-/**
- * Convert pixel coordinates to a square notation string.
- * Clamps to board bounds. Orientation-aware.
- */
-export function xyToSquare(
-  x: number,
-  y: number,
-  squareSize: number,
-  orientation: ChessColor,
-): string {
-  'worklet';
-  const col = Math.max(0, Math.min(7, Math.floor(x / squareSize)));
-  const row = Math.max(0, Math.min(7, Math.floor(y / squareSize)));
-
-  const fileIdx = orientation === 'white' ? col : 7 - col;
-  const rankIdx = orientation === 'white' ? 7 - row : row;
-
-  // String.fromCharCode not available in worklets — use lookup
-  const files = 'abcdefgh';
-  return `${files[fileIdx]}${rankIdx + 1}`;
-}
-
-/**
- * Manages the piece list derived from FEN, with stable IDs for React keys.
- *
- * Stable IDs prevent unmount/remount cycles when pieces change position.
- * A piece keeps its ID as long as it exists on the board — only capture
- * (removal) or promotion (code change) creates a new ID.
- */
-export function useBoardPieces(fen: string): BoardPiece[] {
-  // Track piece-code counters across renders for stable ID assignment
-  const idCounterRef = useRef<Record<string, number>>({});
-  const prevPiecesRef = useRef<BoardPiece[]>([]);
-
-  return useMemo(() => {
-    const parsed = parseFenPieces(fen);
-    const prev = prevPiecesRef.current;
-    const prevBySquare = new Map(prev.map((p) => [p.square, p]));
-
-    // Try to reuse IDs from previous render:
-    // 1. Same code on same square -> keep ID (piece didn't move)
-    // 2. Same code moved to a new square -> find unmatched previous piece of same code
-    const usedPrevIds = new Set<string>();
-    const result: BoardPiece[] = [];
-
-    // First pass: exact square matches (piece stayed or appeared on same square)
-    const unmatched: ParsedPiece[] = [];
-    for (const p of parsed) {
-      const existing = prevBySquare.get(p.square);
-      if (existing && existing.code === p.code && !usedPrevIds.has(existing.id)) {
-        usedPrevIds.add(existing.id);
-        result.push({ ...p, id: existing.id });
-      } else {
-        unmatched.push(p);
-      }
-    }
-
-    // Second pass: match unmatched pieces by code to previous pieces that moved
-    for (const p of unmatched) {
-      let matchedId: string | null = null;
-
-      for (const prevPiece of prev) {
-        if (
-          prevPiece.code === p.code &&
-          !usedPrevIds.has(prevPiece.id)
-        ) {
-          matchedId = prevPiece.id;
-          usedPrevIds.add(prevPiece.id);
-          break;
-        }
-      }
-
-      if (matchedId) {
-        result.push({ ...p, id: matchedId });
-      } else {
-        // New piece (promotion, or first render) — assign fresh ID
-        const counter = idCounterRef.current;
-        counter[p.code] = (counter[p.code] ?? 0) + 1;
-        result.push({ ...p, id: `${p.code}-${counter[p.code]}` });
-      }
-    }
-
-    prevPiecesRef.current = result;
-    return result;
-  }, [fen]);
-}
+import { useMemo, useRef } from 'react';
+
+import type { ChessColor, BoardPiece, ParsedPiece } from './types';
+
+const FEN_PIECE_MAP: Record<string, { code: string; color: 'w' | 'b' }> = {
+  p: { code: 'bp', color: 'b' },
+  r: { code: 'br', color: 'b' },
+  n: { code: 'bn', color: 'b' },
+  b: { code: 'bb', color: 'b' },
+  q: { code: 'bq', color: 'b' },
+  k: { code: 'bk', color: 'b' },
+  P: { code: 'wp', color: 'w' },
+  R: { code: 'wr', color: 'w' },
+  N: { code: 'wn', color: 'w' },
+  B: { code: 'wb', color: 'w' },
+  Q: { code: 'wq', color: 'w' },
+  K: { code: 'wk', color: 'w' },
+};
+
+const FILES = 'abcdefgh';
+
+/**
+ * Parse the piece-placement part of a FEN string into an array of pieces.
+ * Pure function — no React dependencies, suitable for worklets if needed.
+ */
+function parseFenPieces(fen: string): ParsedPiece[] {
+  const placement = fen.split(' ')[0];
+  const ranks = placement.split('/');
+  const pieces: ParsedPiece[] = [];
+
+  for (let rankIdx = 0; rankIdx < ranks.length; rankIdx++) {
+    const rank = ranks[rankIdx];
+    let fileIdx = 0;
+
+    for (const char of rank) {
+      if (char >= '1' && char <= '8') {
+        fileIdx += parseInt(char, 10);
+        continue;
+      }
+
+      const mapping = FEN_PIECE_MAP[char];
+      if (mapping) {
+        // FEN ranks are from rank 8 (index 0) down to rank 1 (index 7)
+        const square = `${FILES[fileIdx]}${8 - rankIdx}`;
+        pieces.push({ code: mapping.code, square, color: mapping.color });
+      }
+      fileIdx++;
+    }
+  }
+
+  return pieces;
+}
+
+/**
+ * Convert square notation to pixel coordinates (top-left corner).
+ * Orientation-aware: flips the board when playing as black.
+ */
+export function squareToXY(
+  square: string,
+  squareSize: number,
+  orientation: ChessColor,
+): { x: number; y: number } {
+  'worklet';
+  const fileIdx = square.charCodeAt(0) - 97; // 'a'=0 .. 'h'=7
+  const rankIdx = parseInt(square[1], 10) - 1; // '1'=0 .. '8'=7
+
+  const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
+  const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
+
+  return { x: col * squareSize, y: row * squareSize };
+}
+
+/**
+ * Convert pixel coordinates to a square notation string.
+ * Clamps to board bounds. Orientation-aware.
+ */
+export function xyToSquare(
+  x: number,
+  y: number,
+  squareSize: number,
+  orientation: ChessColor,
+): string {
+  'worklet';
+  const col = Math.max(0, Math.min(7, Math.floor(x / squareSize)));
+  const row = Math.max(0, Math.min(7, Math.floor(y / squareSize)));
+
+  const fileIdx = orientation === 'white' ? col : 7 - col;
+  const rankIdx = orientation === 'white' ? 7 - row : row;
+
+  // String.fromCharCode not available in worklets — use lookup
+  const files = 'abcdefgh';
+  return `${files[fileIdx]}${rankIdx + 1}`;
+}
+
+/**
+ * Manages the piece list derived from FEN, with stable IDs for React keys.
+ *
+ * Stable IDs prevent unmount/remount cycles when pieces change position.
+ * A piece keeps its ID as long as it exists on the board — only capture
+ * (removal) or promotion (code change) creates a new ID.
+ */
+export function useBoardPieces(fen: string): BoardPiece[] {
+  // Track piece-code counters across renders for stable ID assignment
+  const idCounterRef = useRef<Record<string, number>>({});
+  const prevPiecesRef = useRef<BoardPiece[]>([]);
+
+  return useMemo(() => {
+    const parsed = parseFenPieces(fen);
+    const prev = prevPiecesRef.current;
+    const prevBySquare = new Map(prev.map((p) => [p.square, p]));
+
+    // Try to reuse IDs from previous render:
+    // 1. Same code on same square -> keep ID (piece didn't move)
+    // 2. Same code moved to a new square -> find unmatched previous piece of same code
+    const usedPrevIds = new Set<string>();
+    const result: BoardPiece[] = [];
+
+    // First pass: exact square matches (piece stayed or appeared on same square)
+    const unmatched: ParsedPiece[] = [];
+    for (const p of parsed) {
+      const existing = prevBySquare.get(p.square);
+      if (existing && existing.code === p.code && !usedPrevIds.has(existing.id)) {
+        usedPrevIds.add(existing.id);
+        result.push({ ...p, id: existing.id });
+      } else {
+        unmatched.push(p);
+      }
+    }
+
+    // Second pass: match unmatched pieces by code to previous pieces that moved
+    for (const p of unmatched) {
+      let matchedId: string | null = null;
+
+      for (const prevPiece of prev) {
+        if (
+          prevPiece.code === p.code &&
+          !usedPrevIds.has(prevPiece.id)
+        ) {
+          matchedId = prevPiece.id;
+          usedPrevIds.add(prevPiece.id);
+          break;
+        }
+      }
+
+      if (matchedId) {
+        result.push({ ...p, id: matchedId });
+      } else {
+        // New piece (promotion, or first render) — assign fresh ID
+        const counter = idCounterRef.current;
+        counter[p.code] = (counter[p.code] ?? 0) + 1;
+        result.push({ ...p, id: `${p.code}-${counter[p.code]}` });
+      }
+    }
+
+    prevPiecesRef.current = result;
+    return result;
+  }, [fen]);
+}

package/src/use-board-state.ts

@@ -1,111 +1,111 @@
-import { useRef, useCallback, useMemo } from 'react';
-import { Chess } from 'chess.js';
-import type { Square } from 'chess.js';
-
-import type { ChessColor, BoardPiece, LegalMoveTarget } from './types';
-
-type MoveResult = {
-  /** Whether the move was applied to the internal chess.js instance */
-  applied: boolean;
-  /** The new FEN after the move (if applied) */
-  fen?: string;
-};
-
-type BoardStateReturn = {
-  /** Get legal moves for a piece on the given square */
-  getLegalMoves: (square: string) => LegalMoveTarget[];
-  /** Check if a given square has a piece belonging to the active player */
-  isPlayerPiece: (square: string, pieces: BoardPiece[], player: ChessColor | 'both') => boolean;
-  /** Apply a move to the internal chess state. Returns the new FEN if valid. */
-  applyMove: (from: string, to: string, promotion?: string) => MoveResult;
-  /** Undo the last move on the internal chess state */
-  undoMove: () => string | null;
-  /** Load a new FEN into the internal chess state */
-  loadFen: (fen: string) => void;
-  /** Get the current FEN from internal state */
-  getFen: () => string;
-  /** Get the current turn from internal state */
-  getTurn: () => 'w' | 'b';
-  /** Check if the current side to move is in check */
-  isInCheck: () => boolean;
-};
-
-/**
- * Manages the internal chess.js instance for legal move validation.
- *
- * This mirrors the visual board state. When the parent passes a new FEN,
- * the internal chess.js is synced. Legal move queries and move application
- * happen against this instance.
- *
- * The chess.js instance lives in a ref — no React state, no re-renders.
- */
-export function useBoardState(initialFen: string): BoardStateReturn {
-  const chessRef = useRef<Chess>(null!);
-  if (!chessRef.current) chessRef.current = new Chess(initialFen);
-
-  const getLegalMoves = useCallback((square: string): LegalMoveTarget[] => {
-    try {
-      const moves = chessRef.current.moves({ square: square as Square, verbose: true });
-      return moves.map((m) => ({
-        square: m.to,
-        isCapture: m.captured !== undefined,
-      }));
-    } catch {
-      return [];
-    }
-  }, []);
-
-  const isPlayerPiece = useCallback(
-    (square: string, pieces: BoardPiece[], player: ChessColor | 'both'): boolean => {
-      const piece = pieces.find((p) => p.square === square);
-      if (!piece) return false;
-
-      if (player === 'both') return true;
-
-      const pieceColor: ChessColor = piece.color === 'w' ? 'white' : 'black';
-      return pieceColor === player;
-    },
-    [],
-  );
-
-  const applyMove = useCallback((from: string, to: string, promotion?: string): MoveResult => {
-    try {
-      chessRef.current.move({
-        from: from as Square,
-        to: to as Square,
-        promotion: promotion as 'q' | 'r' | 'b' | 'n' | undefined,
-      });
-      return { applied: true, fen: chessRef.current.fen() };
-    } catch {
-      return { applied: false };
-    }
-  }, []);
-
-  const undoMove = useCallback((): string | null => {
-    const result = chessRef.current.undo();
-    return result ? chessRef.current.fen() : null;
-  }, []);
-
-  const loadFen = useCallback((fen: string) => {
-    chessRef.current.load(fen);
-  }, []);
-
-  const getFen = useCallback(() => chessRef.current.fen(), []);
-
-  const getTurn = useCallback(() => chessRef.current.turn(), []);
-
-  const isInCheck = useCallback(() => chessRef.current.isCheck(), []);
-
-  // Stable reference so Board's useEffect([fen, boardState]) only re-runs
-  // when the fen prop changes — not on every render.
-  return useMemo(() => ({
-    getLegalMoves,
-    isPlayerPiece,
-    applyMove,
-    undoMove,
-    loadFen,
-    getFen,
-    getTurn,
-    isInCheck,
-  }), [getLegalMoves, isPlayerPiece, applyMove, undoMove, loadFen, getFen, getTurn, isInCheck]);
-}
+import { useRef, useCallback, useMemo } from 'react';
+import { Chess } from 'chess.js';
+import type { Square } from 'chess.js';
+
+import type { ChessColor, BoardPiece, LegalMoveTarget } from './types';
+
+type MoveResult = {
+  /** Whether the move was applied to the internal chess.js instance */
+  applied: boolean;
+  /** The new FEN after the move (if applied) */
+  fen?: string;
+};
+
+type BoardStateReturn = {
+  /** Get legal moves for a piece on the given square */
+  getLegalMoves: (square: string) => LegalMoveTarget[];
+  /** Check if a given square has a piece belonging to the active player */
+  isPlayerPiece: (square: string, pieces: BoardPiece[], player: ChessColor | 'both') => boolean;
+  /** Apply a move to the internal chess state. Returns the new FEN if valid. */
+  applyMove: (from: string, to: string, promotion?: string) => MoveResult;
+  /** Undo the last move on the internal chess state */
+  undoMove: () => string | null;
+  /** Load a new FEN into the internal chess state */
+  loadFen: (fen: string) => void;
+  /** Get the current FEN from internal state */
+  getFen: () => string;
+  /** Get the current turn from internal state */
+  getTurn: () => 'w' | 'b';
+  /** Check if the current side to move is in check */
+  isInCheck: () => boolean;
+};
+
+/**
+ * Manages the internal chess.js instance for legal move validation.
+ *
+ * This mirrors the visual board state. When the parent passes a new FEN,
+ * the internal chess.js is synced. Legal move queries and move application
+ * happen against this instance.
+ *
+ * The chess.js instance lives in a ref — no React state, no re-renders.
+ */
+export function useBoardState(initialFen: string): BoardStateReturn {
+  const chessRef = useRef<Chess>(null!);
+  if (!chessRef.current) chessRef.current = new Chess(initialFen);
+
+  const getLegalMoves = useCallback((square: string): LegalMoveTarget[] => {
+    try {
+      const moves = chessRef.current.moves({ square: square as Square, verbose: true });
+      return moves.map((m) => ({
+        square: m.to,
+        isCapture: m.captured !== undefined,
+      }));
+    } catch {
+      return [];
+    }
+  }, []);
+
+  const isPlayerPiece = useCallback(
+    (square: string, pieces: BoardPiece[], player: ChessColor | 'both'): boolean => {
+      const piece = pieces.find((p) => p.square === square);
+      if (!piece) return false;
+
+      if (player === 'both') return true;
+
+      const pieceColor: ChessColor = piece.color === 'w' ? 'white' : 'black';
+      return pieceColor === player;
+    },
+    [],
+  );
+
+  const applyMove = useCallback((from: string, to: string, promotion?: string): MoveResult => {
+    try {
+      chessRef.current.move({
+        from: from as Square,
+        to: to as Square,
+        promotion: promotion as 'q' | 'r' | 'b' | 'n' | undefined,
+      });
+      return { applied: true, fen: chessRef.current.fen() };
+    } catch {
+      return { applied: false };
+    }
+  }, []);
+
+  const undoMove = useCallback((): string | null => {
+    const result = chessRef.current.undo();
+    return result ? chessRef.current.fen() : null;
+  }, []);
+
+  const loadFen = useCallback((fen: string) => {
+    chessRef.current.load(fen);
+  }, []);
+
+  const getFen = useCallback(() => chessRef.current.fen(), []);
+
+  const getTurn = useCallback(() => chessRef.current.turn(), []);
+
+  const isInCheck = useCallback(() => chessRef.current.isCheck(), []);
+
+  // Stable reference so Board's useEffect([fen, boardState]) only re-runs
+  // when the fen prop changes — not on every render.
+  return useMemo(() => ({
+    getLegalMoves,
+    isPlayerPiece,
+    applyMove,
+    undoMove,
+    loadFen,
+    getFen,
+    getTurn,
+    isInCheck,
+  }), [getLegalMoves, isPlayerPiece, applyMove, undoMove, loadFen, getFen, getTurn, isInCheck]);
+}

package/src/use-premove.ts

@@ -1,59 +1,59 @@
-import { useState, useCallback } from 'react';
-
-import type { PremoveData } from './types';
-
-type UsePremoveReturn = {
-  /** The currently queued premove (only one at a time, like lichess) */
-  premove: PremoveData | null;
-  /** Queue a premove. Replaces any existing premove. */
-  setPremove: (premove: PremoveData) => void;
-  /** Clear the queued premove */
-  clearPremove: () => void;
-  /**
-   * Try to execute the queued premove.
-   * Returns the premove if one was queued (so the caller can apply it),
-   * then clears the queue. Returns null if no premove was queued.
-   */
-  consumePremove: () => PremoveData | null;
-};
-
-/**
- * Manages a single premove queue (one premove at a time).
- *
- * Premoves work like lichess:
- * 1. When it's not your turn, you can drag/click a move — it queues as a premove
- * 2. The premove squares are highlighted with a distinct color
- * 3. When your turn begins (FEN changes and it's now your turn), the premove
- *    is automatically attempted via the board's internal chess.js
- * 4. If the premove is legal, it's applied; if not, it's silently discarded
- *
- * The board.tsx orchestrates this: it calls consumePremove() in a useEffect
- * that watches the FEN (turn change), then attempts the move.
- */
-export function usePremove(): UsePremoveReturn {
-  const [premove, setPremoveState] = useState<PremoveData | null>(null);
-
-  const setPremove = useCallback((pm: PremoveData) => {
-    setPremoveState(pm);
-  }, []);
-
-  const clearPremove = useCallback(() => {
-    setPremoveState(null);
-  }, []);
-
-  const consumePremove = useCallback((): PremoveData | null => {
-    let consumed: PremoveData | null = null;
-    setPremoveState((current) => {
-      consumed = current;
-      return null;
-    });
-    return consumed;
-  }, []);
-
-  return {
-    premove,
-    setPremove,
-    clearPremove,
-    consumePremove,
-  };
-}
+import { useState, useCallback } from 'react';
+
+import type { PremoveData } from './types';
+
+type UsePremoveReturn = {
+  /** The currently queued premove (only one at a time, like lichess) */
+  premove: PremoveData | null;
+  /** Queue a premove. Replaces any existing premove. */
+  setPremove: (premove: PremoveData) => void;
+  /** Clear the queued premove */
+  clearPremove: () => void;
+  /**
+   * Try to execute the queued premove.
+   * Returns the premove if one was queued (so the caller can apply it),
+   * then clears the queue. Returns null if no premove was queued.
+   */
+  consumePremove: () => PremoveData | null;
+};
+
+/**
+ * Manages a single premove queue (one premove at a time).
+ *
+ * Premoves work like lichess:
+ * 1. When it's not your turn, you can drag/click a move — it queues as a premove
+ * 2. The premove squares are highlighted with a distinct color
+ * 3. When your turn begins (FEN changes and it's now your turn), the premove
+ *    is automatically attempted via the board's internal chess.js
+ * 4. If the premove is legal, it's applied; if not, it's silently discarded
+ *
+ * The board.tsx orchestrates this: it calls consumePremove() in a useEffect
+ * that watches the FEN (turn change), then attempts the move.
+ */
+export function usePremove(): UsePremoveReturn {
+  const [premove, setPremoveState] = useState<PremoveData | null>(null);
+
+  const setPremove = useCallback((pm: PremoveData) => {
+    setPremoveState(pm);
+  }, []);
+
+  const clearPremove = useCallback(() => {
+    setPremoveState(null);
+  }, []);
+
+  const consumePremove = useCallback((): PremoveData | null => {
+    let consumed: PremoveData | null = null;
+    setPremoveState((current) => {
+      consumed = current;
+      return null;
+    });
+    return consumed;
+  }, []);
+
+  return {
+    premove,
+    setPremove,
+    clearPremove,
+    consumePremove,
+  };
+}