react-chessboard-ui 2.8.0 → 2.10.0

package/dist/index.modern.js

@@ -2308,7 +2308,8 @@ var ChessBoardControlLayout = function ChessBoardControlLayout(props) {
 var useChessBoardInteractive = function useChessBoardInteractive(props) {
   var config = props.config,
     onChange = props.onChange,
-    onEndGame = props.onEndGame;
+    onEndGame = props.onEndGame,
+    onClickByChessBoard = props.onClickByChessBoard;
   var _useState = useState(DEFAULT_CHESSBORD_CONFIG),
     boardConfig = _useState[0],
     setBoardConfig = _useState[1];
@@ -2436,6 +2437,14 @@ var useChessBoardInteractive = function useChessBoardInteractive(props) {
       return !prevReversed;
     });
   };
+  var handleClickByChessBoard = function handleClickByChessBoard(cellData, pos) {
+    if (!onClickByChessBoard) return;
+    onClickByChessBoard({
+      cellData: cellData,
+      pos: pos,
+      currentColor: currentColor
+    });
+  };
   var selectFigureFrom = function selectFigureFrom(cellPos, extActualState) {
     var nowState = extActualState || actualState;
     var cell = nowState[cellPos[1]][cellPos[0]];
@@ -2710,6 +2719,7 @@ var useChessBoardInteractive = function useChessBoardInteractive(props) {
     if (viewOnly === void 0) {
       viewOnly = false;
     }
+    handleClickByChessBoard(actualState[cellPos[1]][cellPos[0]], cellPos);
     clearMarkedCells();
     clearArrows();
     if (viewOnly) return;
@@ -2960,7 +2970,9 @@ var ArrowLayout = function ArrowLayout(props) {
     grabbingPos = props.grabbingPos,
     boardConfig = props.boardConfig,
     _props$externalArrows = props.externalArrowsCoords,
-    externalArrowsCoords = _props$externalArrows === void 0 ? [] : _props$externalArrows;
+    externalArrowsCoords = _props$externalArrows === void 0 ? [] : _props$externalArrows,
+    _props$externalArrows2 = props.externalArrows,
+    externalArrows = _props$externalArrows2 === void 0 ? [] : _props$externalArrows2;
   return React.createElement("div", {
     className: styles.arrowsLayer
   }, startArrowCoord[0] > -1 && grabbingPos[0] > -1 && React.createElement(Arrow, {
@@ -2979,6 +2991,12 @@ var ArrowLayout = function ArrowLayout(props) {
     }, coords, {
       color: boardConfig.arrowColor
     }));
+  }), externalArrows.map(function (arrow, i) {
+    return React.createElement(Arrow, Object.assign({
+      key: "extArrow_" + i
+    }, arrow, {
+      color: arrow.color || boardConfig.arrowColor
+    }));
   }));
 };
 
@@ -3012,6 +3030,7 @@ var ChessBoard = function ChessBoard(props) {
   var FEN = props.FEN,
     onChange = props.onChange,
     onEndGame = props.onEndGame,
+    onClick = props.onClick,
     change = props.change,
     reversed = props.reversed,
     config = props.config,
@@ -3019,10 +3038,13 @@ var ChessBoard = function ChessBoard(props) {
     viewOnly = props.viewOnly,
     moveHighlight = props.moveHighlight,
     _props$moveArrows = props.moveArrows,
-    moveArrows = _props$moveArrows === void 0 ? [] : _props$moveArrows;
+    moveArrows = _props$moveArrows === void 0 ? [] : _props$moveArrows,
+    _props$arrows = props.arrows,
+    arrows = _props$arrows === void 0 ? [] : _props$arrows;
   var _useChessBoardInterac = useChessBoardInteractive({
       onChange: onChange,
       onEndGame: onEndGame,
+      onClickByChessBoard: onClick,
       config: config
     }),
     fromPos = _useChessBoardInterac.fromPos,
@@ -3068,12 +3090,19 @@ var ChessBoard = function ChessBoard(props) {
     var reversedChange = reversed ? JSChessEngine.reverseMove(change.move) : change.move;
     handleChangeFromExternal(reversedChange, change.withTransition);
   }, [change]);
-  var externalArrows = moveArrows.map(function (arrow) {
+  var DEPRECATED_externalArrows = moveArrows.map(function (arrow) {
     return {
       start: correctGrabbingPosForArrow(arrow.start, boardConfig),
       end: correctGrabbingPosForArrow(arrow.end, boardConfig)
     };
   });
+  var externalArrows = arrows.map(function (arrow) {
+    return {
+      start: correctGrabbingPosForArrow(arrow.start, boardConfig),
+      end: correctGrabbingPosForArrow(arrow.end, boardConfig),
+      color: arrow.color
+    };
+  });
   return React.createElement("div", {
     className: styles.chessBoard
   }, React.createElement(ChessBoardCellsLayout, {
@@ -3095,7 +3124,8 @@ var ChessBoard = function ChessBoard(props) {
     onHasCheck: getHasCheckByCellPos
   }), React.createElement(ArrowLayout, {
     arrowsCoords: arrowsCoords,
-    externalArrowsCoords: externalArrows,
+    externalArrowsCoords: DEPRECATED_externalArrows,
+    externalArrows: externalArrows,
     startArrowCoord: startArrowCoord,
     grabbingPos: correctGrabbingPosForArrow(grabbingCell, boardConfig),
     boardConfig: boardConfig