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

// src/CardMatchiing/main.tsx
var import_react = __toESM(require_react());
var import_jsx_runtime = __toESM(require_jsx_runtime());
var shuffle = (arr) => [...arr].sort(() => Math.random() - 0.5);
var makeBoard = () => {
  const values = shuffle(
    Array.from({ length: 10 }, (_, i) => i + 1).flatMap((v) => [v, v])
  );
  return Array.from(
    { length: 4 },
    (_, r) => Array.from({ length: 5 }, (_2, c) => ({
      value: values[r * 5 + c],
      isFacing: false,
      isSolved: false
    }))
  );
};
var BoardContext = (0, import_react.createContext)(null);
var useBoardDispatch = () => {
  const ctx = (0, import_react.useContext)(BoardContext);
  if (!ctx) throw new Error("BoardContext missing");
  return ctx;
};
var initial = () => ({ board: makeBoard(), open: [], busy: false });
function reducer(state, action) {
  switch (action.type) {
    case "reset":
      return initial();
    case "flipBack": {
      const [a, b] = state.open;
      const nextBoard = state.board.map(
        (row, r) => row.map(
          (card, c) => r === a.row && c === a.col || r === b.row && c === b.col ? { ...card, isFacing: false } : card
        )
      );
      return { board: nextBoard, open: [], busy: false };
    }
    case "move": {
      if (state.busy) return state;
      const { row, col } = action;
      const target = state.board[row][col];
      if (target.isFacing || target.isSolved) return state;
      const nextBoard = state.board.map(
        (r, ri) => r.map(
          (c, ci) => ri === row && ci === col ? { ...c, isFacing: true } : c
        )
      );
      const open = [...state.open, { row, col }];
      if (open.length < 2) return { ...state, board: nextBoard, open };
      const [a, b] = open;
      const first = nextBoard[a.row][a.col];
      const second = nextBoard[b.row][b.col];
      if (first.value === second.value) {
        const solvedBoard = nextBoard.map(
          (r, ri) => r.map(
            (c, ci) => ri === a.row && ci === a.col || ri === b.row && ci === b.col ? { ...c, isSolved: true } : c
          )
        );
        return { board: solvedBoard, open: [], busy: false };
      }
      return { board: nextBoard, open, busy: true };
    }
    default:
      return state;
  }
}
var Card = ({ row, col, card }) => {
  const dispatch = useBoardDispatch();
  const style = {
    width: 60,
    height: 80,
    margin: 4,
    fontSize: 24,
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    background: card.isSolved ? "#8bc34a" : card.isFacing ? "#fff" : "#90caf9",
    cursor: card.isSolved ? "default" : "pointer",
    borderRadius: 6,
    userSelect: "none"
  };
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style, onClick: () => dispatch({ type: "move", row, col }), children: card.isFacing || card.isSolved ? card.value : "\u{1F0A0}" });
};
var Row = ({ row, rowPos }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { display: "flex" }, children: row.map((card, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Card, { row: rowPos, col: idx, card }, idx)) });
var MemoryGame = () => {
  const [state, dispatch] = (0, import_react.useReducer)(reducer, void 0, initial);
  (0, import_react.useEffect)(() => {
    if (state.busy) {
      const t = setTimeout(() => dispatch({ type: "flipBack" }), 1e3);
      return () => clearTimeout(t);
    }
  }, [state.busy]);
  const solved = state.board.every((r) => r.every((c) => c.isSolved));
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { style: { textAlign: "center" }, children: solved ? "\u{1F389} You won!" : "Memory Game" }),
    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BoardContext.Provider, { value: dispatch, children: state.board.map((row, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, { rowPos: idx, row }, idx)) }),
    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { textAlign: "center", marginTop: 12 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { onClick: () => dispatch({ type: "reset" }), children: "Reset" }) })
  ] });
};
export {
  MemoryGame
};
//# sourceMappingURL=main-MX6K4HMI.js.map