react-native-chess-kit 0.5.2 → 0.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -0
- package/lib/commonjs/board-arrows.js +7 -7
- package/lib/commonjs/board-coordinates.js +8 -8
- package/lib/commonjs/board.js +48 -39
- package/lib/commonjs/board.js.map +1 -1
- package/lib/commonjs/promotion-picker.js +9 -9
- package/lib/commonjs/promotion-picker.js.map +1 -1
- package/lib/commonjs/static-board.js +7 -7
- package/lib/commonjs/static-board.js.map +1 -1
- package/lib/commonjs/use-board-gesture.js +26 -26
- package/lib/commonjs/use-board-gesture.js.map +1 -1
- package/lib/commonjs/use-board-state.js +13 -4
- package/lib/commonjs/use-board-state.js.map +1 -1
- package/lib/module/board-arrows.js +7 -7
- package/lib/module/board-coordinates.js +8 -8
- package/lib/module/board.js +48 -39
- package/lib/module/board.js.map +1 -1
- package/lib/module/promotion-picker.js +9 -9
- package/lib/module/promotion-picker.js.map +1 -1
- package/lib/module/static-board.js +7 -7
- package/lib/module/static-board.js.map +1 -1
- package/lib/module/use-board-gesture.js +26 -26
- package/lib/module/use-board-gesture.js.map +1 -1
- package/lib/module/use-board-state.js +13 -4
- package/lib/module/use-board-state.js.map +1 -1
- package/lib/typescript/board-coordinates.d.ts.map +1 -1
- package/lib/typescript/board.d.ts.map +1 -1
- package/lib/typescript/promotion-picker.d.ts.map +1 -1
- package/lib/typescript/static-board.d.ts.map +1 -1
- package/lib/typescript/types.d.ts +14 -3
- package/lib/typescript/types.d.ts.map +1 -1
- package/lib/typescript/use-board-gesture.d.ts.map +1 -1
- package/lib/typescript/use-board-state.d.ts.map +1 -1
- package/package.json +95 -75
- package/src/board-arrows.tsx +197 -197
- package/src/board-coordinates.tsx +192 -192
- package/src/board.tsx +59 -56
- package/src/promotion-picker.tsx +147 -147
- package/src/static-board.tsx +186 -187
- package/src/types.ts +27 -6
- package/src/use-board-gesture.ts +459 -429
- package/src/use-board-state.ts +23 -14
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAMjF,qCAAqC;AACrC,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,CAAC;AAE3C,yCAAyC;AACzC,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;AAEnD,kDAAkD;AAClD,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;AAE/D,6BAA6B;AAC7B,MAAM,MAAM,cAAc,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEnD,uFAAuF;AACvF,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAMjE,uDAAuD;AACvD,MAAM,MAAM,SAAS,GACjB,IAAI,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAMjF,qCAAqC;AACrC,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,CAAC;AAE3C,yCAAyC;AACzC,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;AAEnD,kDAAkD;AAClD,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;AAE/D,6BAA6B;AAC7B,MAAM,MAAM,cAAc,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEnD,uFAAuF;AACvF,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAMjE,uDAAuD;AACvD,MAAM,MAAM,SAAS,GACjB,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,CAAC;AAET,iEAAiE;AACjE,MAAM,MAAM,UAAU,GAAG;IACvB,gFAAgF;IAChF,EAAE,EAAE,MAAM,CAAC;IACX,4FAA4F;IAC5F,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB;IACjB,KAAK,EAAE,GAAG,GAAG,GAAG,CAAC;CAClB,CAAC;AAEF,0EAA0E;AAC1E,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,GAAG,GAAG,GAAG,CAAC;CAClB,CAAC;AAMF,kEAAkE;AAClE,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,yCAAyC;AACzC,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,iCAAiC;AACjC,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,yDAAyD;AACzD,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,qCAAqC;AACrC,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,cAAc,CAAC;CAC5B,CAAC;AAMF,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,QAAQ,CAAC;IACf,mCAAmC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,QAAQ,CAAC;IACf,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,iDAAiD;AACjD,MAAM,MAAM,eAAe,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAM5E,kDAAkD;AAClD,MAAM,MAAM,WAAW,GAAG;KACvB,IAAI,IAAI,SAAS,GAAG,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY;CAC1D,CAAC;AAMF,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,0DAA0D;AAC1D,MAAM,MAAM,UAAU,GAAG;IACvB,iCAAiC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,oBAAoB;IACpB,KAAK,EAAE,WAAW,CAAC;IACnB,gCAAgC;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,QAAQ,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,WAAW,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH,CAAC;AAMF,MAAM,MAAM,QAAQ,GAAG;IACrB;;;OAGG;IACH,IAAI,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAChF,+EAA+E;IAC/E,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,sCAAsC;IACtC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,wCAAwC;IACxC,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,2EAA2E;IAC3E,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,gCAAgC;IAChC,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAMF,MAAM,MAAM,UAAU,GAAG;IAGvB,6CAA6C;IAC7C,GAAG,EAAE,MAAM,CAAC;IACZ,gDAAgD;IAChD,WAAW,EAAE,UAAU,CAAC;IAIxB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IAInB,4DAA4D;IAC5D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4EAA4E;IAC5E,MAAM,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IAC7B,iDAAiD;IACjD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,8EAA8E;IAC9E,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,6CAA6C;IAC7C,eAAe,CAAC,EAAE,OAAO,CAAC;IAI1B,gDAAgD;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,6EAA6E;IAC7E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6EAA6E;IAC7E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oFAAoF;IACpF,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAC;IACtE,iFAAiF;IACjF,QAAQ,CAAC,EAAE,WAAW,CAAC;IAIvB,yDAAyD;IACzD,QAAQ,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC/C,yEAAyE;IACzE,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,kCAAkC;IAClC,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,yEAAyE;IACzE,cAAc,CAAC,EAAE,OAAO,CAAC;IAIzB,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,kEAAkE;IAClE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8DAA8D;IAC9D,eAAe,CAAC,EAAE,MAAM,CAAC;IAIzB,gEAAgE;IAChE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,sFAAsF;IACtF,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,kEAAkE;IAClE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,oBAAoB,GAAG,OAAO,oBAAoB,GAAG,IAAI,CAAC;IAI/E;;;;OAIG;IACH,aAAa,CAAC,EAAE,cAAc,CAAC;IAE/B;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,cAAc,CAAC,GAAG,cAAc,CAAC;IAIrF,wFAAwF;IACxF,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,cAAc,CAAA;KAAE,KAAK,IAAI,CAAC;IAClF,oCAAoC;IACpC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1D,8DAA8D;IAC9D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,sCAAsC;IACtC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC9D,kEAAkE;IAClE,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC5D,uCAAuC;IACvC,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,mCAAmC;IACnC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IAC3C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;CACvC,CAAC;AAMF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,qCAAqC;IACrC,GAAG,EAAE,MAAM,CAAC;IACZ,qDAAqD;IACrD,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gDAAgD;IAChD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,iDAAiD;IACjD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,4BAA4B;IAC5B,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAC;IACtE,yBAAyB;IACzB,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC/C,wBAAwB;IACxB,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,aAAa;IACb,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,kBAAkB;IAClB,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;CAChC,CAAC;AAMF,MAAM,MAAM,YAAY,GAAG;IACzB,uEAAuE;IACvE,YAAY,EAAE,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IACzC,kDAAkD;IAClD,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,iDAAiD;IACjD,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IACjC,6DAA6D;IAC7D,aAAa,EAAE,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IAC1C,2EAA2E;IAC3E,gBAAgB,EAAE,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;CAC9C,CAAC;AAMF,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-board-gesture.d.ts","sourceRoot":"","sources":["../../src/use-board-gesture.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;
|
|
1
|
+
{"version":3,"file":"use-board-gesture.d.ts","sourceRoot":"","sources":["../../src/use-board-gesture.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AAGvD,OAAO,KAAK,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,eAAe,EACf,YAAY,EACZ,SAAS,EACT,UAAU,EACV,WAAW,EACZ,MAAM,SAAS,CAAC;AAOjB,KAAK,gBAAgB,GAAG;IACtB,eAAe,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,kBAAkB,EAAE,MAAM,IAAI,CAAC;CAChC,CAAC;AAEF,yDAAyD;AACzD,KAAK,aAAa,GAAG;IACnB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC9D,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC5D,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;CACvC,CAAC;AAEF,+CAA+C;AAC/C,KAAK,gBAAgB,GAAG;IACtB,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;CAC/C,CAAC;AAMF,KAAK,qBAAqB,GAAG;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;IACxB,MAAM,EAAE,UAAU,GAAG,MAAM,CAAC;IAC5B,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,SAAS,EAAE,gBAAgB,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,mCAAmC;IACnC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,6DAA6D;IAC7D,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,2DAA2D;IAC3D,UAAU,EAAE,eAAe,EAAE,CAAC;IAC9B,iEAAiE;IACjE,WAAW,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CACzB,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC3B,OAAO,EAAE,UAAU,CAAC,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC;IACxC,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAoBF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,eAAe,CAAC,EAC9B,UAAU,EACV,WAAW,EACX,cAAc,EACd,MAAM,EACN,UAAU,EACV,MAAM,EACN,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,eAAuB,EACvB,cAAc,EACd,UAAU,EACV,WAAW,GACZ,EAAE,qBAAqB,GAAG,qBAAqB,CA0U/C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-board-state.d.ts","sourceRoot":"","sources":["../../src/use-board-state.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAEvE,KAAK,UAAU,GAAG;IAChB,qEAAqE;IACrE,OAAO,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,sDAAsD;IACtD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,eAAe,EAAE,CAAC;IACrD,yEAAyE;IACzE,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,MAAM,EAAE,UAAU,GAAG,MAAM,KAAK,OAAO,CAAC;IAC9F,8EAA8E;IAC9E,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAC;IACxE,qDAAqD;IACrD,QAAQ,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;IAC9B,mDAAmD;IACnD,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,8CAA8C;IAC9C,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,+CAA+C;IAC/C,OAAO,EAAE,MAAM,GAAG,GAAG,GAAG,CAAC;IACzB,oDAAoD;IACpD,SAAS,EAAE,MAAM,OAAO,CAAC;CAC1B,CAAC;AAEF;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,UAAU,EAAE,MAAM,GAAG,gBAAgB,
|
|
1
|
+
{"version":3,"file":"use-board-state.d.ts","sourceRoot":"","sources":["../../src/use-board-state.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAEvE,KAAK,UAAU,GAAG;IAChB,qEAAqE;IACrE,OAAO,EAAE,OAAO,CAAC;IACjB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,sDAAsD;IACtD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,eAAe,EAAE,CAAC;IACrD,yEAAyE;IACzE,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,MAAM,EAAE,UAAU,GAAG,MAAM,KAAK,OAAO,CAAC;IAC9F,8EAA8E;IAC9E,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,UAAU,CAAC;IACxE,qDAAqD;IACrD,QAAQ,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;IAC9B,mDAAmD;IACnD,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,8CAA8C;IAC9C,MAAM,EAAE,MAAM,MAAM,CAAC;IACrB,+CAA+C;IAC/C,OAAO,EAAE,MAAM,GAAG,GAAG,GAAG,CAAC;IACzB,oDAAoD;IACpD,SAAS,EAAE,MAAM,OAAO,CAAC;CAC1B,CAAC;AAEF;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,UAAU,EAAE,MAAM,GAAG,gBAAgB,CA8ElE"}
|
package/package.json
CHANGED
|
@@ -1,75 +1,95 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "react-native-chess-kit",
|
|
3
|
-
"version": "0.5.
|
|
4
|
-
"description": "High-performance chess board for React Native. Single gesture handler, ~40 components, 0 re-renders during drag. Built on Reanimated + Gesture Handler.",
|
|
5
|
-
"main": "lib/commonjs/index.js",
|
|
6
|
-
"module": "lib/module/index.js",
|
|
7
|
-
"types": "lib/typescript/index.d.ts",
|
|
8
|
-
"react-native": "src/index.ts",
|
|
9
|
-
"source": "src/index.ts",
|
|
10
|
-
"files": [
|
|
11
|
-
"src",
|
|
12
|
-
"lib",
|
|
13
|
-
"!**/__tests__",
|
|
14
|
-
"!**/__fixtures__",
|
|
15
|
-
"!**/__mocks__"
|
|
16
|
-
],
|
|
17
|
-
"scripts": {
|
|
18
|
-
"build": "bob build",
|
|
19
|
-
"typecheck": "tsc --noEmit",
|
|
20
|
-
"
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
"
|
|
43
|
-
|
|
44
|
-
"
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"react": "
|
|
54
|
-
"react-native": "0.
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
"react
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
"
|
|
63
|
-
"
|
|
64
|
-
"
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
}
|
|
75
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "react-native-chess-kit",
|
|
3
|
+
"version": "0.5.4",
|
|
4
|
+
"description": "High-performance chess board for React Native. Single gesture handler, ~40 components, 0 re-renders during drag. Built on Reanimated + Gesture Handler.",
|
|
5
|
+
"main": "lib/commonjs/index.js",
|
|
6
|
+
"module": "lib/module/index.js",
|
|
7
|
+
"types": "lib/typescript/index.d.ts",
|
|
8
|
+
"react-native": "src/index.ts",
|
|
9
|
+
"source": "src/index.ts",
|
|
10
|
+
"files": [
|
|
11
|
+
"src",
|
|
12
|
+
"lib",
|
|
13
|
+
"!**/__tests__",
|
|
14
|
+
"!**/__fixtures__",
|
|
15
|
+
"!**/__mocks__"
|
|
16
|
+
],
|
|
17
|
+
"scripts": {
|
|
18
|
+
"build": "bob build",
|
|
19
|
+
"typecheck": "tsc --noEmit",
|
|
20
|
+
"lint": "eslint src/",
|
|
21
|
+
"lint:fix": "eslint src/ --fix",
|
|
22
|
+
"format": "prettier --write \"src/**/*.{ts,tsx}\"",
|
|
23
|
+
"format:check": "prettier --check \"src/**/*.{ts,tsx}\"",
|
|
24
|
+
"clean": "rimraf lib",
|
|
25
|
+
"prepare": "husky",
|
|
26
|
+
"prepack": "bob build"
|
|
27
|
+
},
|
|
28
|
+
"keywords": [
|
|
29
|
+
"react-native",
|
|
30
|
+
"chess",
|
|
31
|
+
"chessboard",
|
|
32
|
+
"chess-board",
|
|
33
|
+
"reanimated",
|
|
34
|
+
"gesture-handler",
|
|
35
|
+
"performance",
|
|
36
|
+
"60fps"
|
|
37
|
+
],
|
|
38
|
+
"repository": {
|
|
39
|
+
"type": "git",
|
|
40
|
+
"url": "https://github.com/anas-asghar4831/react-native-chess-kit"
|
|
41
|
+
},
|
|
42
|
+
"homepage": "https://github.com/anas-asghar4831/react-native-chess-kit#readme",
|
|
43
|
+
"bugs": {
|
|
44
|
+
"url": "https://github.com/anas-asghar4831/react-native-chess-kit/issues"
|
|
45
|
+
},
|
|
46
|
+
"author": "anas-asghar4831",
|
|
47
|
+
"license": "MIT",
|
|
48
|
+
"peerDependencies": {
|
|
49
|
+
"chess.js": ">=1.0.0",
|
|
50
|
+
"react": ">=18.0.0",
|
|
51
|
+
"react-native": ">=0.70.0",
|
|
52
|
+
"react-native-gesture-handler": ">=2.0.0",
|
|
53
|
+
"react-native-reanimated": ">=3.0.0",
|
|
54
|
+
"react-native-svg": ">=13.0.0"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"@types/react": "~19.1.0",
|
|
58
|
+
"chess.js": "^1.4.0",
|
|
59
|
+
"react": "19.1.0",
|
|
60
|
+
"react-native": "0.81.5",
|
|
61
|
+
"react-native-builder-bob": "^0.35.0",
|
|
62
|
+
"react-native-gesture-handler": "~2.28.0",
|
|
63
|
+
"react-native-reanimated": "~4.1.1",
|
|
64
|
+
"react-native-svg": "~15.11.2",
|
|
65
|
+
"typescript": "~5.9.2",
|
|
66
|
+
"@eslint/js": "^9.0.0",
|
|
67
|
+
"typescript-eslint": "^8.0.0",
|
|
68
|
+
"eslint-plugin-react-hooks": "^5.0.0",
|
|
69
|
+
"eslint": "^9.0.0",
|
|
70
|
+
"prettier": "^3.3.0",
|
|
71
|
+
"husky": "^9.0.0",
|
|
72
|
+
"lint-staged": "^15.0.0",
|
|
73
|
+
"rimraf": "^6.0.0"
|
|
74
|
+
},
|
|
75
|
+
"lint-staged": {
|
|
76
|
+
"src/**/*.{ts,tsx}": [
|
|
77
|
+
"eslint --fix",
|
|
78
|
+
"prettier --write"
|
|
79
|
+
]
|
|
80
|
+
},
|
|
81
|
+
"react-native-builder-bob": {
|
|
82
|
+
"source": "src",
|
|
83
|
+
"output": "lib",
|
|
84
|
+
"targets": [
|
|
85
|
+
"commonjs",
|
|
86
|
+
"module",
|
|
87
|
+
[
|
|
88
|
+
"typescript",
|
|
89
|
+
{
|
|
90
|
+
"project": "tsconfig.build.json"
|
|
91
|
+
}
|
|
92
|
+
]
|
|
93
|
+
]
|
|
94
|
+
}
|
|
95
|
+
}
|
package/src/board-arrows.tsx
CHANGED
|
@@ -1,197 +1,197 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { View } from 'react-native';
|
|
3
|
-
import Svg, { Line, Polygon, Circle as SvgCircle } from 'react-native-svg';
|
|
4
|
-
|
|
5
|
-
import type { ChessColor, ArrowData, ShapeData } from './types';
|
|
6
|
-
import {
|
|
7
|
-
DEFAULT_ARROW_COLOR,
|
|
8
|
-
DEFAULT_SHAPE_COLOR,
|
|
9
|
-
ARROW_STROKE_WIDTH,
|
|
10
|
-
ARROW_HEAD_SIZE,
|
|
11
|
-
ARROW_SHORTEN_BY,
|
|
12
|
-
} from './constants';
|
|
13
|
-
|
|
14
|
-
// ---------------------------------------------------------------------------
|
|
15
|
-
// Coordinate utilities (percentage-based viewBox 0-100)
|
|
16
|
-
// ---------------------------------------------------------------------------
|
|
17
|
-
|
|
18
|
-
function squareToViewBoxCenter(
|
|
19
|
-
square: string,
|
|
20
|
-
orientation: ChessColor,
|
|
21
|
-
): { x: number; y: number } {
|
|
22
|
-
const fileIdx = square.charCodeAt(0) - 97;
|
|
23
|
-
const rankIdx = parseInt(square[1], 10) - 1;
|
|
24
|
-
const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
|
|
25
|
-
const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
|
|
26
|
-
return {
|
|
27
|
-
x: (col + 0.5) * 12.5,
|
|
28
|
-
y: (row + 0.5) * 12.5,
|
|
29
|
-
};
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
function calculateArrowPath(
|
|
33
|
-
from: { x: number; y: number },
|
|
34
|
-
to: { x: number; y: number },
|
|
35
|
-
shortenBy: number,
|
|
36
|
-
): { x1: number; y1: number; x2: number; y2: number } {
|
|
37
|
-
const dx = to.x - from.x;
|
|
38
|
-
const dy = to.y - from.y;
|
|
39
|
-
const len = Math.sqrt(dx * dx + dy * dy);
|
|
40
|
-
if (len === 0) return { x1: from.x, y1: from.y, x2: to.x, y2: to.y };
|
|
41
|
-
|
|
42
|
-
const ux = dx / len;
|
|
43
|
-
const uy = dy / len;
|
|
44
|
-
return {
|
|
45
|
-
x1: from.x + ux * shortenBy,
|
|
46
|
-
y1: from.y + uy * shortenBy,
|
|
47
|
-
x2: to.x - ux * shortenBy,
|
|
48
|
-
y2: to.y - uy * shortenBy,
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
// ---------------------------------------------------------------------------
|
|
53
|
-
// Props
|
|
54
|
-
// ---------------------------------------------------------------------------
|
|
55
|
-
|
|
56
|
-
type BoardArrowsProps = {
|
|
57
|
-
boardSize: number;
|
|
58
|
-
orientation: ChessColor;
|
|
59
|
-
arrows?: ArrowData[];
|
|
60
|
-
shapes?: ShapeData[];
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
// ---------------------------------------------------------------------------
|
|
64
|
-
// Combined arrows + shapes SVG layer
|
|
65
|
-
// ---------------------------------------------------------------------------
|
|
66
|
-
|
|
67
|
-
/**
|
|
68
|
-
* SVG overlay for arrows and shapes drawn on the board.
|
|
69
|
-
*
|
|
70
|
-
* Uses a percentage-based 100x100 viewBox so coordinates map cleanly
|
|
71
|
-
* to the 8x8 grid (each square = 12.5 x 12.5 units).
|
|
72
|
-
*
|
|
73
|
-
* Renders above the pieces layer so arrows are always visible.
|
|
74
|
-
*/
|
|
75
|
-
export const BoardArrows = React.memo(function BoardArrows({
|
|
76
|
-
boardSize,
|
|
77
|
-
orientation,
|
|
78
|
-
arrows,
|
|
79
|
-
shapes,
|
|
80
|
-
}: BoardArrowsProps) {
|
|
81
|
-
const hasArrows = arrows && arrows.length > 0;
|
|
82
|
-
const hasShapes = shapes && shapes.length > 0;
|
|
83
|
-
|
|
84
|
-
if (!hasArrows && !hasShapes) return null;
|
|
85
|
-
|
|
86
|
-
return (
|
|
87
|
-
<View
|
|
88
|
-
style={{ position: 'absolute', width: boardSize, height: boardSize }}
|
|
89
|
-
pointerEvents="none"
|
|
90
|
-
>
|
|
91
|
-
<Svg viewBox="0 0 100 100" width={boardSize} height={boardSize}>
|
|
92
|
-
{/* Shapes (circles) -- drawn under arrows */}
|
|
93
|
-
{hasShapes &&
|
|
94
|
-
shapes.map((shape, i) => {
|
|
95
|
-
if (shape.type === 'circle') {
|
|
96
|
-
const center = squareToViewBoxCenter(shape.square, orientation);
|
|
97
|
-
const color = shape.color ?? DEFAULT_SHAPE_COLOR;
|
|
98
|
-
return (
|
|
99
|
-
<SvgCircle
|
|
100
|
-
key={`circle-${shape.square}-${i}`}
|
|
101
|
-
cx={center.x}
|
|
102
|
-
cy={center.y}
|
|
103
|
-
r={5.5}
|
|
104
|
-
fill="none"
|
|
105
|
-
stroke={color}
|
|
106
|
-
strokeWidth={1.2}
|
|
107
|
-
opacity={0.85}
|
|
108
|
-
/>
|
|
109
|
-
);
|
|
110
|
-
}
|
|
111
|
-
return null;
|
|
112
|
-
})}
|
|
113
|
-
|
|
114
|
-
{/* Arrows */}
|
|
115
|
-
{hasArrows &&
|
|
116
|
-
arrows.map((arrow, i) => (
|
|
117
|
-
<ArrowSvg
|
|
118
|
-
key={`arrow-${arrow.from}-${arrow.to}-${i}`}
|
|
119
|
-
from={arrow.from}
|
|
120
|
-
to={arrow.to}
|
|
121
|
-
color={arrow.color ?? DEFAULT_ARROW_COLOR}
|
|
122
|
-
width={arrow.width ?? ARROW_STROKE_WIDTH}
|
|
123
|
-
orientation={orientation}
|
|
124
|
-
/>
|
|
125
|
-
))}
|
|
126
|
-
</Svg>
|
|
127
|
-
</View>
|
|
128
|
-
);
|
|
129
|
-
});
|
|
130
|
-
|
|
131
|
-
// ---------------------------------------------------------------------------
|
|
132
|
-
// Single arrow SVG element
|
|
133
|
-
// ---------------------------------------------------------------------------
|
|
134
|
-
|
|
135
|
-
type ArrowSvgProps = {
|
|
136
|
-
from: string;
|
|
137
|
-
to: string;
|
|
138
|
-
color: string;
|
|
139
|
-
width: number;
|
|
140
|
-
orientation: ChessColor;
|
|
141
|
-
};
|
|
142
|
-
|
|
143
|
-
const ArrowSvg = React.memo(function ArrowSvg({
|
|
144
|
-
from,
|
|
145
|
-
to,
|
|
146
|
-
color,
|
|
147
|
-
width,
|
|
148
|
-
orientation,
|
|
149
|
-
}: ArrowSvgProps) {
|
|
150
|
-
const fromCoord = squareToViewBoxCenter(from, orientation);
|
|
151
|
-
const toCoord = squareToViewBoxCenter(to, orientation);
|
|
152
|
-
const path = calculateArrowPath(fromCoord, toCoord, ARROW_SHORTEN_BY);
|
|
153
|
-
|
|
154
|
-
const dx = path.x2 - path.x1;
|
|
155
|
-
const dy = path.y2 - path.y1;
|
|
156
|
-
const len = Math.sqrt(dx * dx + dy * dy);
|
|
157
|
-
|
|
158
|
-
if (len === 0) return null;
|
|
159
|
-
|
|
160
|
-
const ux = dx / len;
|
|
161
|
-
const uy = dy / len;
|
|
162
|
-
const headSize = ARROW_HEAD_SIZE;
|
|
163
|
-
|
|
164
|
-
const tip = { x: path.x2, y: path.y2 };
|
|
165
|
-
const baseLeft = {
|
|
166
|
-
x: path.x2 - ux * headSize * 2 + uy * headSize,
|
|
167
|
-
y: path.y2 - uy * headSize * 2 - ux * headSize,
|
|
168
|
-
};
|
|
169
|
-
const baseRight = {
|
|
170
|
-
x: path.x2 - ux * headSize * 2 - uy * headSize,
|
|
171
|
-
y: path.y2 - uy * headSize * 2 + ux * headSize,
|
|
172
|
-
};
|
|
173
|
-
|
|
174
|
-
const arrowPoints = `${tip.x},${tip.y} ${baseLeft.x},${baseLeft.y} ${baseRight.x},${baseRight.y}`;
|
|
175
|
-
|
|
176
|
-
return (
|
|
177
|
-
<>
|
|
178
|
-
<Line
|
|
179
|
-
x1={path.x1}
|
|
180
|
-
y1={path.y1}
|
|
181
|
-
x2={path.x2 - ux * headSize * 2}
|
|
182
|
-
y2={path.y2 - uy * headSize * 2}
|
|
183
|
-
stroke={color}
|
|
184
|
-
strokeWidth={width}
|
|
185
|
-
strokeLinecap="round"
|
|
186
|
-
opacity={0.85}
|
|
187
|
-
/>
|
|
188
|
-
<Polygon points={arrowPoints} fill={color} opacity={0.85} />
|
|
189
|
-
</>
|
|
190
|
-
);
|
|
191
|
-
});
|
|
192
|
-
|
|
193
|
-
// ---------------------------------------------------------------------------
|
|
194
|
-
// Standalone exports for advanced consumers
|
|
195
|
-
// ---------------------------------------------------------------------------
|
|
196
|
-
|
|
197
|
-
export { ArrowSvg as Arrow };
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import Svg, { Line, Polygon, Circle as SvgCircle } from 'react-native-svg';
|
|
4
|
+
|
|
5
|
+
import type { ChessColor, ArrowData, ShapeData } from './types';
|
|
6
|
+
import {
|
|
7
|
+
DEFAULT_ARROW_COLOR,
|
|
8
|
+
DEFAULT_SHAPE_COLOR,
|
|
9
|
+
ARROW_STROKE_WIDTH,
|
|
10
|
+
ARROW_HEAD_SIZE,
|
|
11
|
+
ARROW_SHORTEN_BY,
|
|
12
|
+
} from './constants';
|
|
13
|
+
|
|
14
|
+
// ---------------------------------------------------------------------------
|
|
15
|
+
// Coordinate utilities (percentage-based viewBox 0-100)
|
|
16
|
+
// ---------------------------------------------------------------------------
|
|
17
|
+
|
|
18
|
+
function squareToViewBoxCenter(
|
|
19
|
+
square: string,
|
|
20
|
+
orientation: ChessColor,
|
|
21
|
+
): { x: number; y: number } {
|
|
22
|
+
const fileIdx = square.charCodeAt(0) - 97;
|
|
23
|
+
const rankIdx = parseInt(square[1], 10) - 1;
|
|
24
|
+
const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
|
|
25
|
+
const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
|
|
26
|
+
return {
|
|
27
|
+
x: (col + 0.5) * 12.5,
|
|
28
|
+
y: (row + 0.5) * 12.5,
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function calculateArrowPath(
|
|
33
|
+
from: { x: number; y: number },
|
|
34
|
+
to: { x: number; y: number },
|
|
35
|
+
shortenBy: number,
|
|
36
|
+
): { x1: number; y1: number; x2: number; y2: number } {
|
|
37
|
+
const dx = to.x - from.x;
|
|
38
|
+
const dy = to.y - from.y;
|
|
39
|
+
const len = Math.sqrt(dx * dx + dy * dy);
|
|
40
|
+
if (len === 0) return { x1: from.x, y1: from.y, x2: to.x, y2: to.y };
|
|
41
|
+
|
|
42
|
+
const ux = dx / len;
|
|
43
|
+
const uy = dy / len;
|
|
44
|
+
return {
|
|
45
|
+
x1: from.x + ux * shortenBy,
|
|
46
|
+
y1: from.y + uy * shortenBy,
|
|
47
|
+
x2: to.x - ux * shortenBy,
|
|
48
|
+
y2: to.y - uy * shortenBy,
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// ---------------------------------------------------------------------------
|
|
53
|
+
// Props
|
|
54
|
+
// ---------------------------------------------------------------------------
|
|
55
|
+
|
|
56
|
+
type BoardArrowsProps = {
|
|
57
|
+
boardSize: number;
|
|
58
|
+
orientation: ChessColor;
|
|
59
|
+
arrows?: ArrowData[];
|
|
60
|
+
shapes?: ShapeData[];
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
// ---------------------------------------------------------------------------
|
|
64
|
+
// Combined arrows + shapes SVG layer
|
|
65
|
+
// ---------------------------------------------------------------------------
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* SVG overlay for arrows and shapes drawn on the board.
|
|
69
|
+
*
|
|
70
|
+
* Uses a percentage-based 100x100 viewBox so coordinates map cleanly
|
|
71
|
+
* to the 8x8 grid (each square = 12.5 x 12.5 units).
|
|
72
|
+
*
|
|
73
|
+
* Renders above the pieces layer so arrows are always visible.
|
|
74
|
+
*/
|
|
75
|
+
export const BoardArrows = React.memo(function BoardArrows({
|
|
76
|
+
boardSize,
|
|
77
|
+
orientation,
|
|
78
|
+
arrows,
|
|
79
|
+
shapes,
|
|
80
|
+
}: BoardArrowsProps) {
|
|
81
|
+
const hasArrows = arrows && arrows.length > 0;
|
|
82
|
+
const hasShapes = shapes && shapes.length > 0;
|
|
83
|
+
|
|
84
|
+
if (!hasArrows && !hasShapes) return null;
|
|
85
|
+
|
|
86
|
+
return (
|
|
87
|
+
<View
|
|
88
|
+
style={{ position: 'absolute', width: boardSize, height: boardSize }}
|
|
89
|
+
pointerEvents="none"
|
|
90
|
+
>
|
|
91
|
+
<Svg viewBox="0 0 100 100" width={boardSize} height={boardSize}>
|
|
92
|
+
{/* Shapes (circles) -- drawn under arrows */}
|
|
93
|
+
{hasShapes &&
|
|
94
|
+
shapes.map((shape, i) => {
|
|
95
|
+
if (shape.type === 'circle') {
|
|
96
|
+
const center = squareToViewBoxCenter(shape.square, orientation);
|
|
97
|
+
const color = shape.color ?? DEFAULT_SHAPE_COLOR;
|
|
98
|
+
return (
|
|
99
|
+
<SvgCircle
|
|
100
|
+
key={`circle-${shape.square}-${i}`}
|
|
101
|
+
cx={center.x}
|
|
102
|
+
cy={center.y}
|
|
103
|
+
r={5.5}
|
|
104
|
+
fill="none"
|
|
105
|
+
stroke={color}
|
|
106
|
+
strokeWidth={1.2}
|
|
107
|
+
opacity={0.85}
|
|
108
|
+
/>
|
|
109
|
+
);
|
|
110
|
+
}
|
|
111
|
+
return null;
|
|
112
|
+
})}
|
|
113
|
+
|
|
114
|
+
{/* Arrows */}
|
|
115
|
+
{hasArrows &&
|
|
116
|
+
arrows.map((arrow, i) => (
|
|
117
|
+
<ArrowSvg
|
|
118
|
+
key={`arrow-${arrow.from}-${arrow.to}-${i}`}
|
|
119
|
+
from={arrow.from}
|
|
120
|
+
to={arrow.to}
|
|
121
|
+
color={arrow.color ?? DEFAULT_ARROW_COLOR}
|
|
122
|
+
width={arrow.width ?? ARROW_STROKE_WIDTH}
|
|
123
|
+
orientation={orientation}
|
|
124
|
+
/>
|
|
125
|
+
))}
|
|
126
|
+
</Svg>
|
|
127
|
+
</View>
|
|
128
|
+
);
|
|
129
|
+
});
|
|
130
|
+
|
|
131
|
+
// ---------------------------------------------------------------------------
|
|
132
|
+
// Single arrow SVG element
|
|
133
|
+
// ---------------------------------------------------------------------------
|
|
134
|
+
|
|
135
|
+
type ArrowSvgProps = {
|
|
136
|
+
from: string;
|
|
137
|
+
to: string;
|
|
138
|
+
color: string;
|
|
139
|
+
width: number;
|
|
140
|
+
orientation: ChessColor;
|
|
141
|
+
};
|
|
142
|
+
|
|
143
|
+
const ArrowSvg = React.memo(function ArrowSvg({
|
|
144
|
+
from,
|
|
145
|
+
to,
|
|
146
|
+
color,
|
|
147
|
+
width,
|
|
148
|
+
orientation,
|
|
149
|
+
}: ArrowSvgProps) {
|
|
150
|
+
const fromCoord = squareToViewBoxCenter(from, orientation);
|
|
151
|
+
const toCoord = squareToViewBoxCenter(to, orientation);
|
|
152
|
+
const path = calculateArrowPath(fromCoord, toCoord, ARROW_SHORTEN_BY);
|
|
153
|
+
|
|
154
|
+
const dx = path.x2 - path.x1;
|
|
155
|
+
const dy = path.y2 - path.y1;
|
|
156
|
+
const len = Math.sqrt(dx * dx + dy * dy);
|
|
157
|
+
|
|
158
|
+
if (len === 0) return null;
|
|
159
|
+
|
|
160
|
+
const ux = dx / len;
|
|
161
|
+
const uy = dy / len;
|
|
162
|
+
const headSize = ARROW_HEAD_SIZE;
|
|
163
|
+
|
|
164
|
+
const tip = { x: path.x2, y: path.y2 };
|
|
165
|
+
const baseLeft = {
|
|
166
|
+
x: path.x2 - ux * headSize * 2 + uy * headSize,
|
|
167
|
+
y: path.y2 - uy * headSize * 2 - ux * headSize,
|
|
168
|
+
};
|
|
169
|
+
const baseRight = {
|
|
170
|
+
x: path.x2 - ux * headSize * 2 - uy * headSize,
|
|
171
|
+
y: path.y2 - uy * headSize * 2 + ux * headSize,
|
|
172
|
+
};
|
|
173
|
+
|
|
174
|
+
const arrowPoints = `${tip.x},${tip.y} ${baseLeft.x},${baseLeft.y} ${baseRight.x},${baseRight.y}`;
|
|
175
|
+
|
|
176
|
+
return (
|
|
177
|
+
<>
|
|
178
|
+
<Line
|
|
179
|
+
x1={path.x1}
|
|
180
|
+
y1={path.y1}
|
|
181
|
+
x2={path.x2 - ux * headSize * 2}
|
|
182
|
+
y2={path.y2 - uy * headSize * 2}
|
|
183
|
+
stroke={color}
|
|
184
|
+
strokeWidth={width}
|
|
185
|
+
strokeLinecap="round"
|
|
186
|
+
opacity={0.85}
|
|
187
|
+
/>
|
|
188
|
+
<Polygon points={arrowPoints} fill={color} opacity={0.85} />
|
|
189
|
+
</>
|
|
190
|
+
);
|
|
191
|
+
});
|
|
192
|
+
|
|
193
|
+
// ---------------------------------------------------------------------------
|
|
194
|
+
// Standalone exports for advanced consumers
|
|
195
|
+
// ---------------------------------------------------------------------------
|
|
196
|
+
|
|
197
|
+
export { ArrowSvg as Arrow };
|