react-chessboard-expandable
Version:
A fork of the react-chessboard library to support an expandable chessboard
990 lines (977 loc) • 265 kB
JavaScript
'use strict';
var jsxRuntime = require('react/jsx-runtime');
var react = require('react');
/******************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
}
// https://commons.wikimedia.org/wiki/Category:SVG_chess_pieces
// By en:User:Cburnett - Own work
// This W3C - unspecified vector image was created with Inkscape., CC BY - SA 3.0, https://commons.wikimedia.org/w/index.php?curid=1499810
const defaultPieces = {
wP: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsx("path", { d: "m 22.5,9 c -2.21,0 -4,1.79 -4,4 0,0.89 0.29,1.71 0.78,2.38 C 17.33,16.5 16,18.59 16,21 c 0,2.03 0.94,3.84 2.41,5.03 C 15.41,27.09 11,31.58 11,39.5 H 34 C 34,31.58 29.59,27.09 26.59,26.03 28.06,24.84 29,23.03 29,21 29,18.59 27.67,16.5 25.72,15.38 26.21,14.71 26.5,13.89 26.5,13 c 0,-2.21 -1.79,-4 -4,-4 z", style: {
opacity: "1",
fill: "#ffffff",
fillOpacity: "1",
fillRule: "nonzero",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "miter",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }) }))),
wR: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "#ffffff",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 34,14 L 31,17 L 14,17 L 11,14" }), jsxRuntime.jsx("path", { d: "M 31,17 L 31,29.5 L 14,29.5 L 14,17", style: { strokeLinecap: "butt", strokeLinejoin: "miter" } }), jsxRuntime.jsx("path", { d: "M 31,29.5 L 32.5,32 L 12.5,32 L 14,29.5" }), jsxRuntime.jsx("path", { d: "M 11,14 L 34,14", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" } })] })) }))),
wN: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "none",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18", style: { fill: "#ffffff", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 24,18 C 24.38,20.91 18.45,25.37 16,27 C 13,29 13.18,31.34 11,31 C 9.958,30.06 12.41,27.96 11,28 C 10,28 11.19,29.23 10,30 C 9,30 5.997,31 6,26 C 6,24 12,14 12,14 C 12,14 13.89,12.1 14,10.5 C 13.27,9.506 13.5,8.5 13.5,7.5 C 14.5,6.5 16.5,10 16.5,10 L 18.5,10 C 18.5,10 19.28,8.008 21,7 C 22,7 22,10 22,10", style: { fill: "#ffffff", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 9.5 25.5 A 0.5 0.5 0 1 1 8.5,25.5 A 0.5 0.5 0 1 1 9.5 25.5 z", style: { fill: "#000000", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 15 15.5 A 0.5 1.5 0 1 1 14,15.5 A 0.5 1.5 0 1 1 15 15.5 z", transform: "matrix(0.866,0.5,-0.5,0.866,9.693,-5.173)", style: { fill: "#000000", stroke: "#000000" } })] })) }))),
wB: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "none",
fillRule: "evenodd",
fillOpacity: "1",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsxs("g", Object.assign({ style: { fill: "#ffffff", stroke: "#000000", strokeLinecap: "butt" } }, { children: [jsxRuntime.jsx("path", { d: "M 9,36 C 12.39,35.03 19.11,36.43 22.5,34 C 25.89,36.43 32.61,35.03 36,36 C 36,36 37.65,36.54 39,38 C 38.32,38.97 37.35,38.99 36,38.5 C 32.61,37.53 25.89,38.96 22.5,37.5 C 19.11,38.96 12.39,37.53 9,38.5 C 7.65,38.99 6.68,38.97 6,38 C 7.35,36.54 9,36 9,36 z" }), jsxRuntime.jsx("path", { d: "M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z" }), jsxRuntime.jsx("path", { d: "M 25 8 A 2.5 2.5 0 1 1 20,8 A 2.5 2.5 0 1 1 25 8 z" })] })), jsxRuntime.jsx("path", { d: "M 17.5,26 L 27.5,26 M 15,30 L 30,30 M 22.5,15.5 L 22.5,20.5 M 20,18 L 25,18", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" } })] })) }))),
wQ: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
fill: "#ffffff",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinejoin: "round",
} }, { children: [jsxRuntime.jsx("path", { d: "M 9,26 C 17.5,24.5 30,24.5 36,26 L 38.5,13.5 L 31,25 L 30.7,10.9 L 25.5,24.5 L 22.5,10 L 19.5,24.5 L 14.3,10.9 L 14,25 L 6.5,13.5 L 9,26 z" }), jsxRuntime.jsx("path", { d: "M 9,26 C 9,28 10.5,28 11.5,30 C 12.5,31.5 12.5,31 12,33.5 C 10.5,34.5 11,36 11,36 C 9.5,37.5 11,38.5 11,38.5 C 17.5,39.5 27.5,39.5 34,38.5 C 34,38.5 35.5,37.5 34,36 C 34,36 34.5,34.5 33,33.5 C 32.5,31 32.5,31.5 33.5,30 C 34.5,28 36,28 36,26 C 27.5,24.5 17.5,24.5 9,26 z" }), jsxRuntime.jsx("path", { d: "M 11.5,30 C 15,29 30,29 33.5,30", style: { fill: "none" } }), jsxRuntime.jsx("path", { d: "M 12,33.5 C 18,32.5 27,32.5 33,33.5", style: { fill: "none" } }), jsxRuntime.jsx("circle", { cx: "6", cy: "12", r: "2" }), jsxRuntime.jsx("circle", { cx: "14", cy: "9", r: "2" }), jsxRuntime.jsx("circle", { cx: "22.5", cy: "8", r: "2" }), jsxRuntime.jsx("circle", { cx: "31", cy: "9", r: "2" }), jsxRuntime.jsx("circle", { cx: "39", cy: "12", r: "2" })] })) }))),
wK: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
fill: "none",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 22.5,11.63 L 22.5,6", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" } }), jsxRuntime.jsx("path", { d: "M 20,8 L 25,8", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" } }), jsxRuntime.jsx("path", { d: "M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25", style: {
fill: "#ffffff",
stroke: "#000000",
strokeLinecap: "butt",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 12.5,37 C 18,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 20,16 10.5,13 6.5,19.5 C 3.5,25.5 12.5,30 12.5,30 L 12.5,37", style: { fill: "#ffffff", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 12.5,30 C 18,27 27,27 32.5,30", style: { fill: "none", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 12.5,33.5 C 18,30.5 27,30.5 32.5,33.5", style: { fill: "none", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 12.5,37 C 18,34 27,34 32.5,37", style: { fill: "none", stroke: "#000000" } })] })) }))),
bP: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsx("path", { d: "m 22.5,9 c -2.21,0 -4,1.79 -4,4 0,0.89 0.29,1.71 0.78,2.38 C 17.33,16.5 16,18.59 16,21 c 0,2.03 0.94,3.84 2.41,5.03 C 15.41,27.09 11,31.58 11,39.5 H 34 C 34,31.58 29.59,27.09 26.59,26.03 28.06,24.84 29,23.03 29,21 29,18.59 27.67,16.5 25.72,15.38 26.21,14.71 26.5,13.89 26.5,13 c 0,-2.21 -1.79,-4 -4,-4 z", style: {
opacity: "1",
fill: "#000000",
fillOpacity: "1",
fillRule: "nonzero",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "miter",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }) }))),
bR: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "#000000",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 12.5,32 L 14,29.5 L 31,29.5 L 32.5,32 L 12.5,32 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 14,29.5 L 14,16.5 L 31,16.5 L 31,29.5 L 14,29.5 z ", style: { strokeLinecap: "butt", strokeLinejoin: "miter" } }), jsxRuntime.jsx("path", { d: "M 14,16.5 L 11,14 L 34,14 L 31,16.5 L 14,16.5 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14 L 11,14 z ", style: { strokeLinecap: "butt" } }), jsxRuntime.jsx("path", { d: "M 12,35.5 L 33,35.5 L 33,35.5", style: {
fill: "none",
stroke: "#ffffff",
strokeWidth: "1",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 13,31.5 L 32,31.5", style: {
fill: "none",
stroke: "#ffffff",
strokeWidth: "1",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 14,29.5 L 31,29.5", style: {
fill: "none",
stroke: "#ffffff",
strokeWidth: "1",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 14,16.5 L 31,16.5", style: {
fill: "none",
stroke: "#ffffff",
strokeWidth: "1",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 11,14 L 34,14", style: {
fill: "none",
stroke: "#ffffff",
strokeWidth: "1",
strokeLinejoin: "miter",
} })] })) }))),
bN: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "none",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18", style: { fill: "#000000", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 24,18 C 24.38,20.91 18.45,25.37 16,27 C 13,29 13.18,31.34 11,31 C 9.958,30.06 12.41,27.96 11,28 C 10,28 11.19,29.23 10,30 C 9,30 5.997,31 6,26 C 6,24 12,14 12,14 C 12,14 13.89,12.1 14,10.5 C 13.27,9.506 13.5,8.5 13.5,7.5 C 14.5,6.5 16.5,10 16.5,10 L 18.5,10 C 18.5,10 19.28,8.008 21,7 C 22,7 22,10 22,10", style: { fill: "#000000", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 9.5 25.5 A 0.5 0.5 0 1 1 8.5,25.5 A 0.5 0.5 0 1 1 9.5 25.5 z", style: { fill: "#ffffff", stroke: "#ffffff" } }), jsxRuntime.jsx("path", { d: "M 15 15.5 A 0.5 1.5 0 1 1 14,15.5 A 0.5 1.5 0 1 1 15 15.5 z", transform: "matrix(0.866,0.5,-0.5,0.866,9.693,-5.173)", style: { fill: "#ffffff", stroke: "#ffffff" } }), jsxRuntime.jsx("path", { d: "M 24.55,10.4 L 24.1,11.85 L 24.6,12 C 27.75,13 30.25,14.49 32.5,18.75 C 34.75,23.01 35.75,29.06 35.25,39 L 35.2,39.5 L 37.45,39.5 L 37.5,39 C 38,28.94 36.62,22.15 34.25,17.66 C 31.88,13.17 28.46,11.02 25.06,10.5 L 24.55,10.4 z ", style: { fill: "#ffffff", stroke: "none" } })] })) }))),
bB: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
opacity: "1",
fill: "none",
fillRule: "evenodd",
fillOpacity: "1",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsxs("g", Object.assign({ style: { fill: "#000000", stroke: "#000000", strokeLinecap: "butt" } }, { children: [jsxRuntime.jsx("path", { d: "M 9,36 C 12.39,35.03 19.11,36.43 22.5,34 C 25.89,36.43 32.61,35.03 36,36 C 36,36 37.65,36.54 39,38 C 38.32,38.97 37.35,38.99 36,38.5 C 32.61,37.53 25.89,38.96 22.5,37.5 C 19.11,38.96 12.39,37.53 9,38.5 C 7.65,38.99 6.68,38.97 6,38 C 7.35,36.54 9,36 9,36 z" }), jsxRuntime.jsx("path", { d: "M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z" }), jsxRuntime.jsx("path", { d: "M 25 8 A 2.5 2.5 0 1 1 20,8 A 2.5 2.5 0 1 1 25 8 z" })] })), jsxRuntime.jsx("path", { d: "M 17.5,26 L 27.5,26 M 15,30 L 30,30 M 22.5,15.5 L 22.5,20.5 M 20,18 L 25,18", style: { fill: "none", stroke: "#ffffff", strokeLinejoin: "miter" } })] })) }))),
bQ: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
fill: "#000000",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
} }, { children: [jsxRuntime.jsx("path", { d: "M 9,26 C 17.5,24.5 30,24.5 36,26 L 38.5,13.5 L 31,25 L 30.7,10.9 L 25.5,24.5 L 22.5,10 L 19.5,24.5 L 14.3,10.9 L 14,25 L 6.5,13.5 L 9,26 z", style: { strokeLinecap: "butt", fill: "#000000" } }), jsxRuntime.jsx("path", { d: "m 9,26 c 0,2 1.5,2 2.5,4 1,1.5 1,1 0.5,3.5 -1.5,1 -1,2.5 -1,2.5 -1.5,1.5 0,2.5 0,2.5 6.5,1 16.5,1 23,0 0,0 1.5,-1 0,-2.5 0,0 0.5,-1.5 -1,-2.5 -0.5,-2.5 -0.5,-2 0.5,-3.5 1,-2 2.5,-2 2.5,-4 -8.5,-1.5 -18.5,-1.5 -27,0 z" }), jsxRuntime.jsx("path", { d: "M 11.5,30 C 15,29 30,29 33.5,30" }), jsxRuntime.jsx("path", { d: "m 12,33.5 c 6,-1 15,-1 21,0" }), jsxRuntime.jsx("circle", { cx: "6", cy: "12", r: "2" }), jsxRuntime.jsx("circle", { cx: "14", cy: "9", r: "2" }), jsxRuntime.jsx("circle", { cx: "22.5", cy: "8", r: "2" }), jsxRuntime.jsx("circle", { cx: "31", cy: "9", r: "2" }), jsxRuntime.jsx("circle", { cx: "39", cy: "12", r: "2" }), jsxRuntime.jsx("path", { d: "M 11,38.5 A 35,35 1 0 0 34,38.5", style: { fill: "none", stroke: "#000000", strokeLinecap: "butt" } }), jsxRuntime.jsxs("g", Object.assign({ style: { fill: "none", stroke: "#ffffff" } }, { children: [jsxRuntime.jsx("path", { d: "M 11,29 A 35,35 1 0 1 34,29" }), jsxRuntime.jsx("path", { d: "M 12.5,31.5 L 32.5,31.5" }), jsxRuntime.jsx("path", { d: "M 11.5,34.5 A 35,35 1 0 0 33.5,34.5" }), jsxRuntime.jsx("path", { d: "M 10.5,37.5 A 35,35 1 0 0 34.5,37.5" })] }))] })) }))),
bK: (jsxRuntime.jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", version: "1.1", width: "45", height: "45" }, { children: jsxRuntime.jsxs("g", Object.assign({ style: {
fill: "none",
fillOpacity: "1",
fillRule: "evenodd",
stroke: "#000000",
strokeWidth: "1.5",
strokeLinecap: "round",
strokeLinejoin: "round",
strokeMiterlimit: "4",
strokeDasharray: "none",
strokeOpacity: "1",
} }, { children: [jsxRuntime.jsx("path", { d: "M 22.5,11.63 L 22.5,6", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" }, id: "path6570" }), jsxRuntime.jsx("path", { d: "M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25", style: {
fill: "#000000",
fillOpacity: "1",
strokeLinecap: "butt",
strokeLinejoin: "miter",
} }), jsxRuntime.jsx("path", { d: "M 12.5,37 C 18,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 20,16 10.5,13 6.5,19.5 C 3.5,25.5 12.5,30 12.5,30 L 12.5,37", style: { fill: "#000000", stroke: "#000000" } }), jsxRuntime.jsx("path", { d: "M 20,8 L 25,8", style: { fill: "none", stroke: "#000000", strokeLinejoin: "miter" } }), jsxRuntime.jsx("path", { d: "M 32,29.5 C 32,29.5 40.5,25.5 38.03,19.85 C 34.15,14 25,18 22.5,24.5 L 22.5,26.6 L 22.5,24.5 C 20,18 10.85,14 6.97,19.85 C 4.5,25.5 13,29.5 13,29.5", style: { fill: "none", stroke: "#ffffff" } }), jsxRuntime.jsx("path", { d: "M 12.5,30 C 18,27 27,27 32.5,30 M 12.5,33.5 C 18,30.5 27,30.5 32.5,33.5 M 12.5,37 C 18,34 27,34 32.5,37", style: { fill: "none", stroke: "#ffffff" } })] })) }))),
};
const START_POSITION_OBJECT = {
a8: "bR",
b8: "bN",
c8: "bB",
d8: "bQ",
e8: "bK",
f8: "bB",
g8: "bN",
h8: "bR",
a7: "bP",
b7: "bP",
c7: "bP",
d7: "bP",
e7: "bP",
f7: "bP",
g7: "bP",
h7: "bP",
a2: "wP",
b2: "wP",
c2: "wP",
d2: "wP",
e2: "wP",
f2: "wP",
g2: "wP",
h2: "wP",
a1: "wR",
b1: "wN",
c1: "wB",
d1: "wQ",
e1: "wK",
f1: "wB",
g1: "wN",
h1: "wR",
};
const WHITE_COLUMN_VALUES = {
a: 0,
b: 1,
c: 2,
d: 3,
e: 4,
f: 5,
g: 6,
h: 7,
};
const BLACK_COLUMN_VALUES = {
a: 7,
b: 6,
c: 5,
d: 4,
e: 3,
f: 2,
g: 1,
h: 0,
};
const WHITE_ROWS = [7, 6, 5, 4, 3, 2, 1, 0];
const BLACK_ROWS = [0, 1, 2, 3, 4, 5, 6, 7];
/**
* Retrieves the coordinates at the centre of the requested square, relative to the top left of the board (0, 0).
*/
function getRelativeCoords(boardOrientation, boardWidth, square) {
const squareWidth = boardWidth / 8;
const columns = boardOrientation === "white" ? WHITE_COLUMN_VALUES : BLACK_COLUMN_VALUES;
const rows = boardOrientation === "white" ? WHITE_ROWS : BLACK_ROWS;
const x = columns[square[0]] * squareWidth + squareWidth / 2;
const y = rows[parseInt(square[1], 10) - 1] * squareWidth + squareWidth / 2;
return { x, y };
}
/**
* Returns whether the passed position is different from the start position.
*/
function isDifferentFromStart(newPosition) {
let isDifferent = false;
Object.keys(START_POSITION_OBJECT).forEach((square) => {
if (newPosition[square] !== START_POSITION_OBJECT[square])
isDifferent = true;
});
Object.keys(newPosition).forEach((square) => {
if (START_POSITION_OBJECT[square] !== newPosition[square])
isDifferent = true;
});
return isDifferent;
}
/**
* Returns what pieces have been added and what pieces have been removed between board positions.
*/
function getPositionDifferences(currentPosition, newPosition) {
const difference = {
removed: {},
added: {},
};
// removed from current
Object.keys(currentPosition).forEach((square) => {
if (newPosition[square] !== currentPosition[square])
difference.removed[square] = currentPosition[square];
});
// added from new
Object.keys(newPosition).forEach((square) => {
if (currentPosition[square] !== newPosition[square])
difference.added[square] = newPosition[square];
});
return difference;
}
/**
* Converts a fen string to a position object.
* # - Marker for 8th row (if required)
* $ - Market for a file (if required)
*/
function modifiedFenToObj$1(fen) {
// cut off any move, castling, etc info from the end. we're only interested in position information
fen = fen.replace(/ .+$/, "");
const rows = fen.split("/");
let currentRowIdx = getStartRowIdx(rows);
const position = {};
const nonExistentSquares = {};
for (let i = 0; i < rows.length; i++) {
const row = rows[i].match(/\d+|[a-zA-Z]/g); // ab12c -> ['a', 'b', '12', 'c']
if (!row)
continue;
let colIdx = getStartColIdx(rows[i]);
// loop through each character in the FEN section
for (let j = 0; j < row.length; j++) {
// number / empty squares
if (row[j].search(/\d/) !== -1) {
const numEmptySquares = parseInt(row[j], 10);
colIdx = colIdx + numEmptySquares;
}
else if (row[j] === 'E') {
nonExistentSquares[getColumnNotation$1(colIdx) + currentRowIdx] = true;
colIdx = colIdx + 1;
}
else {
// piece
const square = getColumnNotation$1(colIdx) + currentRowIdx;
position[square] = fenToPieceCode$1(row[j]);
colIdx = colIdx + 1;
}
}
currentRowIdx = currentRowIdx - 1;
}
return [position, nonExistentSquares];
}
function getStartRowIdx(rows) {
const eighthRowIdx = rows.findIndex(row => row.startsWith('#'));
if (eighthRowIdx === -1)
return 8;
return eighthRowIdx + 8;
}
function getStartColIdx(row) {
const aFileIdx = row.indexOf('$');
if (aFileIdx === -1 || aFileIdx === 0)
return 0;
const beforeMarker = row.substring(0, aFileIdx);
const beforeMarkerSplit = beforeMarker.match(/\d+|[a-zA-Z]/g);
if (!beforeMarkerSplit)
return 0;
let squaresBeforeMarker = 0;
for (let i = 0; i < beforeMarkerSplit.length; i++) {
if (beforeMarkerSplit[i].search(/\d/) === -1) {
squaresBeforeMarker += 1;
continue;
}
squaresBeforeMarker += parseInt(beforeMarkerSplit[i], 10);
}
return -squaresBeforeMarker;
}
function getColumnNotation$1(colIdx) {
if (colIdx < 0) {
return String.fromCharCode(64 + Math.abs(colIdx));
}
return String.fromCharCode(97 + colIdx);
}
/**
* Convert fen piece code to camel case notation. e.g. bP, wK.
*/
function fenToPieceCode$1(piece) {
// black piece
if (piece.toLowerCase() === piece) {
return ("b" + piece.toUpperCase());
}
// white piece
return ("w" + piece.toUpperCase());
}
var MoveType;
(function (MoveType) {
MoveType["MOVE"] = "move";
MoveType["EXTEND"] = "extend";
})(MoveType || (MoveType = {}));
const useArrows = (customArrows, areArrowsAllowed = true, onArrowsChange, customArrowColor) => {
// arrows passed programatically to `ChessBoard` as a react prop
const [customArrowsSet, setCustomArrows] = react.useState([]);
// arrows drawn with mouse by user on the board
const [arrows, setArrows] = react.useState([]);
// active arrow which user draws while dragging mouse
const [newArrow, setNewArrow] = react.useState();
// handle external `customArrows` props changes
react.useEffect(() => {
if (Array.isArray(customArrows)) {
// so that custom arrows overwrite temporary arrows
clearArrows();
setCustomArrows(
//filter out arrows which starts and ends in the same square
customArrows === null || customArrows === void 0 ? void 0 : customArrows.filter((arrow) => arrow[0] !== arrow[1]));
}
}, [customArrows]);
// callback when arrows changed after user interaction
react.useEffect(() => {
onArrowsChange === null || onArrowsChange === void 0 ? void 0 : onArrowsChange(arrows);
}, [arrows]);
// function clears all arrows drawed by user
function clearArrows() {
setArrows([]);
setNewArrow(undefined);
}
const drawNewArrow = (fromSquare, toSquare) => {
if (!areArrowsAllowed)
return;
setNewArrow([fromSquare, toSquare, customArrowColor]);
};
const allBoardArrows = [...arrows, ...customArrowsSet];
const onArrowDrawEnd = (fromSquare, toSquare) => {
if (fromSquare === toSquare || !areArrowsAllowed)
return;
let arrowsCopy;
const newArrow = [fromSquare, toSquare, customArrowColor];
const isNewArrowUnique = allBoardArrows.every(([arrowFrom, arrowTo]) => {
return !(arrowFrom === fromSquare && arrowTo === toSquare);
});
// add the newArrow to arrows array if it is unique
if (isNewArrowUnique) {
arrowsCopy = [...arrows, newArrow];
}
// remove it from the board if we already have same arrow in arrows array
else {
arrowsCopy = arrows.filter(([arrowFrom, arrowTo]) => {
return !(arrowFrom === fromSquare && arrowTo === toSquare);
});
}
setNewArrow(undefined);
setArrows(arrowsCopy);
};
return {
arrows: allBoardArrows,
newArrow,
clearArrows,
drawNewArrow,
setArrows,
onArrowDrawEnd,
};
};
const NON_EXISTENT_SQUARE = 'E';
const EMPTY_SQUARE = 'e';
const ANIMATION_DURATION = 300;
/**
* Assumption about modifiedFen string: each row should have equal number of
* squares. Ideally this should be handled here but to make life easier for now
* I want the provider of modifiedFen to handle this.
*
* Maybe I will handle it here in the future.
*/
function useBoardState(modifiedFen, horizontalExtendLimit, verticalExtendLimit, horizontalAddUnit, verticalAddUnit) {
const [board, setBoard] = react.useState({
rows: [[]],
locationToIdx: {}
});
const [diff, setDiff] = react.useState({
added: {},
removed: {}
});
const [isWaitingForAnimation, setIsWaitingForAnimation] = react.useState(false);
const [previousTimeout, setPreviousTimeout] = react.useState(null);
const [wasManualDrop, setWasManualDrop] = react.useState(false);
react.useEffect(() => {
const newRows = modifiedFenToObj(modifiedFen);
const newBoard = createBoard(newRows, horizontalExtendLimit, verticalExtendLimit, horizontalAddUnit, verticalAddUnit);
const newPieceMap = locationToPieceMap(newRows);
const oldPieceMap = locationToPieceMap(board.rows);
const diff = getDifferences(oldPieceMap, newPieceMap);
if (wasManualDrop) {
setWasManualDrop(false);
setBoard(newBoard);
return;
}
if (isWaitingForAnimation) {
// fen string changed while processing the earlier animation
setIsWaitingForAnimation(false);
setBoard(newBoard);
if (previousTimeout)
clearTimeout(previousTimeout);
return;
}
setDiff(diff); // will trigger animation
setIsWaitingForAnimation(true);
const newTimeout = setTimeout(() => {
setIsWaitingForAnimation(false);
setBoard(newBoard);
}, ANIMATION_DURATION);
setPreviousTimeout(newTimeout);
}, [
modifiedFen,
horizontalExtendLimit,
verticalExtendLimit,
horizontalAddUnit,
verticalAddUnit
]);
const getNumRows = () => {
return board.rows.length;
};
const getNumCols = () => {
return board.rows[0].length;
};
const getSquare = (row, col) => {
return board.rows[row][col];
};
const movePiece = (from, to, piece) => {
const fromIdx = board.locationToIdx[from];
const toIdx = board.locationToIdx[to];
if (!fromIdx || !toIdx) {
return;
}
const oldPiece = board.rows[fromIdx.row][fromIdx.col].piece;
if (oldPiece === EMPTY_SQUARE || oldPiece === NON_EXISTENT_SQUARE) {
return;
}
const targetPiece = board.rows[toIdx.row][toIdx.col].piece;
if (targetPiece === NON_EXISTENT_SQUARE) {
return;
}
const newRows = [...board.rows];
newRows[fromIdx.row][fromIdx.col].piece = EMPTY_SQUARE;
newRows[toIdx.row][toIdx.col].piece = piece;
setWasManualDrop(true);
setBoard(Object.assign(Object.assign({}, board), { rows: newRows }));
};
const getPiece = (location) => {
const idx = board.locationToIdx[location];
if (!idx) {
return "";
}
const piece = board.rows[idx.row][idx.col].piece;
if (piece == EMPTY_SQUARE || piece == NON_EXISTENT_SQUARE) {
return "";
}
return piece;
};
const getBoard = () => {
return board;
};
const materializeUnit = (location) => {
const idx = board.locationToIdx[location];
if (!idx) {
return;
}
const piece = board.rows[idx.row][idx.col].piece;
if (piece !== NON_EXISTENT_SQUARE) {
return;
}
const newRows = [...board.rows];
const unitSqIdxs = board.locationToUnitSqIdxs[location];
unitSqIdxs.forEach(unitSqIdx => {
newRows[unitSqIdx.row][unitSqIdx.col].piece = EMPTY_SQUARE;
});
const newBoard = createBoard(newRows, horizontalExtendLimit, verticalExtendLimit, horizontalAddUnit, verticalAddUnit);
setBoard(newBoard);
};
const getUnitSqIdxs = (location) => {
return board.locationToUnitSqIdxs[location];
};
const isLocationNonExistent = (location) => {
const idx = board.locationToIdx[location];
if (!idx) {
return false;
}
return board.rows[idx.row][idx.col].piece === NON_EXISTENT_SQUARE;
};
const getDiff = () => {
return diff;
};
const getIsWaitingForAnimation = () => {
return isWaitingForAnimation;
};
const setManualDrop = (wasManualDrop) => {
setWasManualDrop(wasManualDrop);
};
const getLocationIdx = (location) => {
return board.locationToIdx[location];
};
return {
getNumRows,
getNumCols,
getSquare,
movePiece,
getPiece,
getBoard,
materializeUnit,
getUnitSqIdxs,
isLocationNonExistent,
getDiff,
getIsWaitingForAnimation,
setManualDrop,
getLocationIdx,
};
}
function getAllPossibleUnits(idx, addUnit) {
if (addUnit.x == 1 && addUnit.y == 1) {
return [[idx]];
}
return [
getUnitUsingIdx(idx, { horizontal: 1, vertical: 1 }, addUnit),
getUnitUsingIdx(idx, { horizontal: 1, vertical: -1 }, addUnit),
getUnitUsingIdx(idx, { horizontal: -1, vertical: 1 }, addUnit),
getUnitUsingIdx(idx, { horizontal: -1, vertical: -1 }, addUnit),
];
}
function getUnitUsingIdx(idx, direction, addUnit) {
const unit = [];
for (let i = 0; i < addUnit.x; i++) {
for (let j = 0; j < addUnit.y; j++) {
unit.push({ row: idx.row + j * direction.vertical, col: idx.col + i * direction.horizontal });
}
}
return unit;
}
function modifiedFenToObj(fen) {
// cut off any move, castling, etc info from the end. we're only interested in position information
fen = fen.replace(/ .+$/, "");
const fenRows = fen.split("/");
let currentRowIdx = getFenStartRowIdx(fenRows);
let rows = [];
fenRows.forEach((fenRow) => {
const parsedRow = fenRow.match(/\d+|[a-zA-Z]/g); // r10r -> ['r', '10', 'r']
if (!parsedRow)
return;
let colIdx = getFenStartColIdx(fenRow);
let row = [];
//TODO: clean this up later so we wont need so many layers of indentations
parsedRow.forEach((unit) => {
if (unit.search(/\d/) !== -1) { // number signifies empty squares
const numEmptySquares = parseInt(unit, 10);
for (let i = 0; i < numEmptySquares; i++) {
row.push({
piece: EMPTY_SQUARE,
rank: currentRowIdx.toString(),
file: getColumnNotation(colIdx)
});
colIdx += 1;
}
}
else if (unit == NON_EXISTENT_SQUARE) {
row.push({
piece: NON_EXISTENT_SQUARE,
rank: currentRowIdx.toString(),
file: getColumnNotation(colIdx)
});
colIdx += 1;
}
else { // if its not empty square or non-existent square, it must be a piece
row.push({
piece: fenToPieceCode(unit),
rank: currentRowIdx.toString(),
file: getColumnNotation(colIdx)
});
colIdx += 1;
}
});
rows.push(row);
currentRowIdx -= 1;
});
return rows;
}
function createLocationToIdx(rows) {
const locationToIdx = {};
rows.forEach((row, rowIdx) => {
row.forEach((square, colIdx) => {
locationToIdx[`${square.file}${square.rank}`] = {
row: rowIdx,
col: colIdx
};
});
});
return locationToIdx;
}
function getFenStartRowIdx(rows) {
const eighthRowIdx = rows.findIndex(row => row.startsWith('#'));
if (eighthRowIdx === -1)
return 8;
return eighthRowIdx + 8;
}
function getFenStartColIdx(row) {
const aFileIdx = row.indexOf('$');
if (aFileIdx === -1 || aFileIdx === 0)
return 0;
const beforeMarker = row.substring(0, aFileIdx);
const beforeMarkerSplit = beforeMarker.match(/\d+|[a-zA-Z]/g);
if (!beforeMarkerSplit)
return 0;
let squaresBeforeMarker = 0;
for (let i = 0; i < beforeMarkerSplit.length; i++) {
if (beforeMarkerSplit[i].search(/\d/) === -1) {
squaresBeforeMarker += 1;
continue;
}
squaresBeforeMarker += parseInt(beforeMarkerSplit[i], 10);
}
return -squaresBeforeMarker;
}
function getColumnNotation(fenColIdx) {
if (fenColIdx < 0) {
return String.fromCharCode(64 + Math.abs(fenColIdx));
}
return String.fromCharCode(97 + fenColIdx);
}
function getFenColIdx(file) {
let charCode = file.charCodeAt(0);
if (charCode >= 97) {
return charCode - 97;
}
return -(charCode - 64);
}
function fenToPieceCode(piece) {
// black piece
if (piece.toLowerCase() === piece) {
return ("b" + piece.toUpperCase());
}
// white piece
return ("w" + piece.toUpperCase());
}
function createBoard(rawRows, horizontalExtendLimit, verticalExtendLimit, horizontalAddUnit, verticalAddUnit) {
const toAdd = {
top: verticalAddUnit.y - numNonExistentRowsTopN(rawRows, verticalAddUnit.y),
bottom: verticalAddUnit.y - numNonExistentRowsBottomN(rawRows, verticalAddUnit.y),
left: horizontalAddUnit.x - numNonExistentColsLeftN(rawRows, horizontalAddUnit.x),
right: horizontalAddUnit.x - numNonExistentColsRightN(rawRows, horizontalAddUnit.x)
};
const paddedRows = addNesPaddingToRows(rawRows, toAdd, horizontalExtendLimit, verticalExtendLimit);
return {
rows: paddedRows,
locationToIdx: createLocationToIdx(paddedRows),
locationToUnitSqIdxs: createLocationToUnitSqIdxs(paddedRows, horizontalAddUnit, verticalAddUnit)
};
}
function areAllSqNonExistent(row) {
return row.every((square) => square.piece === NON_EXISTENT_SQUARE);
}
function numNonExistentRowsTopN(rows, n) {
return rows.slice(0, n).filter(areAllSqNonExistent).length;
}
function numNonExistentRowsBottomN(rows, n) {
return rows.slice(-n).filter(areAllSqNonExistent).length;
}
function numNonExistentColsLeftN(rows, n) {
let cols = [];
for (let i = 0; i < n; i++) {
cols.push(rows.map(row => row[i]));
}
return cols.filter(areAllSqNonExistent).length;
}
function numNonExistentColsRightN(rows, n) {
let cols = [];
for (let i = 0; i < n; i++) {
cols.push(rows.map(row => row[row.length - 1 - i]));
}
return cols.filter(areAllSqNonExistent).length;
}
function addNesPaddingToRows(rows, toAdd, horizontalExtendLimit, verticalExtendLimit) {
const existingPadding = getExistingPadding(rows);
const left = getPaddingToAdd(existingPadding.left, toAdd.left, horizontalExtendLimit);
const right = getPaddingToAdd(existingPadding.right, toAdd.right, horizontalExtendLimit);
const top = getPaddingToAdd(existingPadding.top, toAdd.top, verticalExtendLimit);
const bottom = getPaddingToAdd(existingPadding.bottom, toAdd.bottom, verticalExtendLimit);
const lrPaddedRows = rows.map(row => addLRNesPaddingToRow(row, left, right, horizontalExtendLimit));
const paddedRows = addTBNesPaddingToRows(lrPaddedRows, top, bottom, verticalExtendLimit);
return paddedRows;
}
function getPaddingToAdd(existing, toAdd, limit) {
const total = existing + toAdd;
if (total > limit) {
return limit - existing;
}
return toAdd;
}
function getExistingPadding(rows) {
const eighthRankIdx = rows.findIndex(row => row[0].rank === "8");
if (eighthRankIdx === -1) {
// should never happen since we always start off with normal board
return {
top: 0,
bottom: 0,
left: 0,
right: 0
};
}
const aFileIdx = rows[0].findIndex(square => square.file === "a");
if (aFileIdx === -1) {
// should never happen since we always start off with normal board
return {
top: 0,
bottom: 0,
left: 0,
right: 0
};
}
return {
top: eighthRankIdx,
bottom: rows.length - (8 + eighthRankIdx),
left: aFileIdx,
right: rows[0].length - (8 + aFileIdx)
};
}
function nonExistentRow(rowLength, startingFenColIdx, rank) {
const newRow = [];
for (let i = 0; i < rowLength; i++) {
let fenColIdx = startingFenColIdx + i;
newRow.push({
piece: NON_EXISTENT_SQUARE,
rank: rank,
file: getColumnNotation(fenColIdx)
});
}
return newRow;
}
function addLRNesPaddingToRow(row, left, right, horizontalExtendLimit) {
const newRow = [];
for (let i = 0; i < left; i++) {
const offset = left - i;
const fenColIdx = getFenColIdx(row[0].file) - offset;
if (i + 1 > horizontalExtendLimit) {
break;
}
newRow.push({
piece: NON_EXISTENT_SQUARE,
rank: row[0].rank,
file: getColumnNotation(fenColIdx)
});
}
row.forEach(square => {
newRow.push(square);
});
for (let i = 0; i < right; i++) {
const offset = i + 1;
const fenColIdx = getFenColIdx(row[row.length - 1].file) + offset;
if (i + 1 > horizontalExtendLimit) {
break;
}
newRow.push({
piece: NON_EXISTENT_SQUARE,
rank: row[0].rank,
file: getColumnNotation(fenColIdx)
});
}
return newRow;
}
function addTBNesPaddingToRows(rows, top, bottom, verticalExtendLimit) {
const newRows = [];
const rowLength = rows[0].length;
const startingFenColIdx = getFenColIdx(rows[0][0].file);
const topRank = rows[0][0].rank;
const bottomRank = rows[rows.length - 1][0].rank;
for (let i = 0; i < top; i++) {
const rank = (parseInt(topRank, 10) + top - i).toString();
if (i + 1 > verticalExtendLimit) {
break;
}
newRows.push(nonExistentRow(rowLength, startingFenColIdx, rank));
}
rows.forEach(row => {
newRows.push(row);
});
for (let i = 0; i < bottom; i++) {
const rank = (parseInt(bottomRank, 10) - i - 1).toString();
if (i + 1 > verticalExtendLimit) {
break;
}
newRows.push(nonExistentRow(rowLength, startingFenColIdx, rank));
}
return newRows;
}
const isUnitValid = (rows, unit) => {
return unit.every(idx => {
const row = rows[idx.row];
if (!row) {
return false;
}
const sq = row[idx.col];
if (!sq) {
return false;
}
return sq.piece === NON_EXISTENT_SQUARE;
});
};
const computeUnitSqIdxs = (idx, rows, addUnit) => {
const allPossibleUnits = getAllPossibleUnits(idx, addUnit);
const validUnits = allPossibleUnits.filter(unit => isUnitValid(rows, unit));
if (validUnits.length === 0) {
return [];
}
return validUnits[0];
};
function createLocationToUnitSqIdxs(rows, horizontalAddUnit, verticalAddUnit) {
const locationToUnitSqIdxs = {};
rows.forEach((row, rowIdx) => {
row.forEach((square, colIdx) => {
if (square.piece !== NON_EXISTENT_SQUARE) {
return;
}
const addUnit = getAddUnitByLocPrioVert(square.file, square.rank, horizontalAddUnit, verticalAddUnit);
const unitSqIdxs = computeUnitSqIdxs({ row: rowIdx, col: colIdx }, rows, addUnit);
locationToUnitSqIdxs[`${square.file}${square.rank}`] = unitSqIdxs;
});
});
return locationToUnitSqIdxs;
}
function getAddUnitByLocPrioVert(file, rank, horizontalAddUnit, verticalAddUnit) {
if (parseInt(rank, 10) > 8 || parseInt(rank, 10) < 1) {
return verticalAddUnit;
}
return horizontalAddUnit;
}
function locationToPieceMap(rows) {
const locationToPieceMap = {};
rows.forEach((row, rowIdx) => {
row.forEach((square, colIdx) => {
locationToPieceMap[`${square.file}${square.rank}`] = square.piece;
});
});
return locationToPieceMap;
}
function getDifferences(currPieceMap, newPieceMap) {
const difference = {
removed: {},
added: {},
};
// removed from current
Object.keys(currPieceMap).forEach((square) => {
if (newPieceMap[square] !== currPieceMap[square])
difference.removed[square] = currPieceMap[square];
});
// added from new
Object.keys(newPieceMap).forEach((square) => {
if (currPieceMap[square] !== newPieceMap[square])
difference.added[square] = newPieceMap[square];
});
return difference;
}
const ChessboardContext = react.createContext({});
const useChessboard = () => react.useContext(ChessboardContext);
const ChessboardProvider = react.forwardRef(({ allowDragOutsideBoard = true, animationDuration = 300, areArrowsAllowed = true, arePiecesDraggable = true, arePremovesAllowed = false, autoPromoteToQueen = false, boardOrientation = "white", boardWidth, children, clearPremovesOnRightClick = true, customArrows, customArrowColor = "rgb(255,170,0)", customBoardStyle, customNotationStyle, customDarkSquareStyle = { backgroundColor: "#B58863" }, customDropSquareStyle = {
boxShadow: "inset 0 0 1px 6px rgba(255,255,255,0.75)",
}, customLightSquareStyle = { backgroundColor: "#F0D9B5" }, customPieces, customPremoveDarkSquareStyle = { backgroundColor: "#A42323" }, customPremoveLightSquareStyle = { backgroundColor: "#BD2828" }, customSquare = "div", customSquareStyles, dropOffBoardAction = "snapback", id = 0, isDraggablePiece = () => true, getPositionObject = () => { }, onArrowsChange = () => { }, onDragOverSquare = () => { }, onMouseOutSquare = () => { }, onMouseOverSquare = () => { }, onPieceClick = () => { }, onPieceDragBegin = () => { }, onPieceDragEnd = () => { }, onPieceDrop = () => true, onPieceDropOffBoard = () => { }, onPromotionCheck = (sourceSquare, targetSquare, piece) => {
return (((piece === "wP" &&
sourceSquare[1] === "7" &&
targetSquare[1] === "8") ||
(piece === "bP" &&
sourceSquare[1] === "2" &&
targetSquare[1] === "1")) &&
(Math.abs(sourceSquare.charCodeAt(0) - targetSquare.charCodeAt(0)) <= 1 ||
(sourceSquare[0].toLowerCase() === targetSquare[0].toLowerCase()) // when moving from a file to A file
));
}, onPromotionPieceSelect = () => true, onSparePieceDrop = () => true, onSquareClick = () => { }, onSquareRightClick = () => { }, position = "start", modifiedFen = "rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR", promotionDialogVariant = "default", promotionToSquare = null, showBoardNotation = true, showPromotionDialog = false, snapToCursor = true, onMove = () => true, horizontalExtendLimit = 6, verticalExtendLimit = 2, horizontalAddUnit = { x: 1, y: 1 }, verticalAddUnit = { x: 1, y: 1 }, }, ref) => {
// position stored and displayed on board
const [postition, nonExistentSquares] = modifiedFenToObj$1(modifiedFen);
const [currentPosition, setCurrentPosition] = react.useState(postition);
const boardState = useBoardState(modifiedFen, horizontalExtendLimit, verticalExtendLimit, horizontalAddUnit, verticalAddUnit);
// calculated differences between current and incoming positions
const [positionDifferences, setPositionDifferences] = react.useState({ removed: {}, added: {} });
// colour of last piece moved to determine if premoving
const [lastPieceColour, setLastPieceColour] = react.useState(undefined);
// show / hide promotion dialog
const [showPromoteDialog, setShowPromoteDialog] = react.useState(showPromotionDialog && !autoPromoteToQueen);
// which square a pawn is being promoted to
const [promoteFromSquare, setPromoteFromSquare] = react.useState(null);