import {
  __toESM,
  require_jsx_runtime,
  require_react
} from "./chunk-AX5M7HF6.js";

// src/LightsOut/main.tsx
var import_react = __toESM(require_react());
var import_jsx_runtime = __toESM(require_jsx_runtime());
var MAX_COL = 5;
var MAX_ROW = 5;
var DIRECTION = [
  [0, 0],
  [0, 1],
  [1, 0],
  [0, -1],
  [-1, 0]
];
var constructGameState = () => {
  const board = Array.from(
    { length: MAX_ROW },
    () => Array.from(
      { length: MAX_COL },
      () => ({ value: false })
    )
  );
  for (let i = 0; i < 30; i++) {
    const r = Math.floor(Math.random() * MAX_ROW);
    const c = Math.floor(Math.random() * MAX_COL);
    for (const [dr, dc] of DIRECTION) {
      if (board[r + dr]?.[c + dc]) {
        board[r + dr][c + dc].value = !board[r + dr]?.[c + dc].value;
      }
    }
  }
  return {
    board,
    status: 0 /* PLAYABLE */,
    moves: 0
  };
};
var styles = {
  board: {
    display: "grid",
    gridTemplateColumns: `repeat(${MAX_COL}, 1fr)`,
    width: MAX_COL * 30
  },
  cell: (isLightOn) => ({
    width: "100%",
    aspectRatio: "1 / 1",
    border: `1px solid #222`,
    backgroundColor: isLightOn ? "white" : "black",
    transition: "background-color 120ms ease",
    cursor: "pointer"
  })
};
var CellComponent = (0, import_react.memo)(({ cellValue, rowPos, colPos, dispatch }) => {
  const onClickHandler = (0, import_react.useCallback)(() => {
    dispatch({ type: "place", newRowPos: rowPos, newColPos: colPos });
  }, [rowPos, colPos, dispatch]);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { onClick: onClickHandler, style: styles.cell(cellValue.value) });
});
var gameStateReducer = (state, action) => {
  if (state.status === 1 /* WON */) return state;
  switch (action.type) {
    case "place":
      const allDirection = [];
      for (const [dr, dc] of DIRECTION) {
        allDirection.push([action.newRowPos + dr, action.newColPos + dc]);
      }
      const newBoard = state.board.map(
        (row, rowIdx) => row.map((col, colIdx) => allDirection.some(
          ([nr, nc]) => rowIdx === nr && colIdx === nc
        ) ? { ...col, value: !col.value } : col)
      );
      const newStatus = newBoard.flat().filter((cell) => cell.value).length === MAX_COL * MAX_ROW ? 1 /* WON */ : 0 /* PLAYABLE */;
      return {
        ...state,
        status: newStatus,
        board: newBoard,
        moves: state.moves + 1
      };
    case "reset":
      return constructGameState();
  }
};
var LightsOut = () => {
  const [gameState, dispatch] = (0, import_react.useReducer)(gameStateReducer, null, constructGameState);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h1", { children: [
      " Game Status ",
      gameState.status
    ] }),
    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", { children: [
      " Number of moves so far ",
      gameState.moves
    ] }),
    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: styles.board, children: gameState.board.map(
      (row, rowIdx) => row.map(
        (cellValue, colIdx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
          CellComponent,
          {
            cellValue,
            rowPos: rowIdx,
            colPos: colIdx,
            dispatch
          },
          `${rowIdx}-${colIdx}`
        )
      )
    ) })
  ] });
};
export {
  LightsOut
};
//# sourceMappingURL=main-EQTPDHY4.js.map