react-native-chess-kit 0.1.0 → 0.2.0
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/lib/commonjs/board-annotations.js +131 -0
- package/lib/commonjs/board-annotations.js.map +1 -0
- package/lib/commonjs/board-arrows.js +164 -0
- package/lib/commonjs/board-arrows.js.map +1 -0
- package/lib/commonjs/board-highlights.js +212 -0
- package/lib/commonjs/board-highlights.js.map +1 -0
- package/lib/commonjs/board-piece.js +41 -12
- package/lib/commonjs/board-piece.js.map +1 -1
- package/lib/commonjs/board-pieces.js +2 -0
- package/lib/commonjs/board-pieces.js.map +1 -1
- package/lib/commonjs/board.js +392 -42
- package/lib/commonjs/board.js.map +1 -1
- package/lib/commonjs/constants.js +104 -0
- package/lib/commonjs/constants.js.map +1 -0
- package/lib/commonjs/index.js +128 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/pieces/default-pieces.js +536 -0
- package/lib/commonjs/pieces/default-pieces.js.map +1 -0
- package/lib/commonjs/pieces/index.js +13 -0
- package/lib/commonjs/pieces/index.js.map +1 -0
- package/lib/commonjs/promotion-picker.js +129 -0
- package/lib/commonjs/promotion-picker.js.map +1 -0
- package/lib/commonjs/static-board.js +150 -0
- package/lib/commonjs/static-board.js.map +1 -0
- package/lib/commonjs/themes.js +175 -0
- package/lib/commonjs/themes.js.map +1 -0
- package/lib/commonjs/use-board-gesture.js +184 -11
- package/lib/commonjs/use-board-gesture.js.map +1 -1
- package/lib/commonjs/use-premove.js +44 -0
- package/lib/commonjs/use-premove.js.map +1 -0
- package/lib/module/board-annotations.js +126 -0
- package/lib/module/board-annotations.js.map +1 -0
- package/lib/module/board-arrows.js +161 -0
- package/lib/module/board-arrows.js.map +1 -0
- package/lib/module/board-highlights.js +206 -0
- package/lib/module/board-highlights.js.map +1 -0
- package/lib/module/board-piece.js +42 -13
- package/lib/module/board-piece.js.map +1 -1
- package/lib/module/board-pieces.js +2 -0
- package/lib/module/board-pieces.js.map +1 -1
- package/lib/module/board.js +395 -44
- package/lib/module/board.js.map +1 -1
- package/lib/module/constants.js +100 -0
- package/lib/module/constants.js.map +1 -0
- package/lib/module/index.js +29 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/pieces/default-pieces.js +530 -0
- package/lib/module/pieces/default-pieces.js.map +1 -0
- package/lib/module/pieces/index.js +4 -0
- package/lib/module/pieces/index.js.map +1 -0
- package/lib/module/promotion-picker.js +124 -0
- package/lib/module/promotion-picker.js.map +1 -0
- package/lib/module/static-board.js +146 -0
- package/lib/module/static-board.js.map +1 -0
- package/lib/module/themes.js +171 -0
- package/lib/module/themes.js.map +1 -0
- package/lib/module/use-board-gesture.js +185 -11
- package/lib/module/use-board-gesture.js.map +1 -1
- package/lib/module/use-premove.js +40 -0
- package/lib/module/use-premove.js.map +1 -0
- package/lib/typescript/board-annotations.d.ts +30 -0
- package/lib/typescript/board-annotations.d.ts.map +1 -0
- package/lib/typescript/board-arrows.d.ts +27 -0
- package/lib/typescript/board-arrows.d.ts.map +1 -0
- package/lib/typescript/board-highlights.d.ts +65 -0
- package/lib/typescript/board-highlights.d.ts.map +1 -0
- package/lib/typescript/board-piece.d.ts +10 -4
- package/lib/typescript/board-piece.d.ts.map +1 -1
- package/lib/typescript/board-pieces.d.ts +2 -1
- package/lib/typescript/board-pieces.d.ts.map +1 -1
- package/lib/typescript/board.d.ts +11 -2
- package/lib/typescript/board.d.ts.map +1 -1
- package/lib/typescript/constants.d.ts +54 -0
- package/lib/typescript/constants.d.ts.map +1 -0
- package/lib/typescript/index.d.ts +9 -1
- package/lib/typescript/index.d.ts.map +1 -1
- package/lib/typescript/pieces/default-pieces.d.ts +3 -0
- package/lib/typescript/pieces/default-pieces.d.ts.map +1 -0
- package/lib/typescript/pieces/index.d.ts +2 -0
- package/lib/typescript/pieces/index.d.ts.map +1 -0
- package/lib/typescript/promotion-picker.d.ts +30 -0
- package/lib/typescript/promotion-picker.d.ts.map +1 -0
- package/lib/typescript/static-board.d.ts +12 -0
- package/lib/typescript/static-board.d.ts.map +1 -0
- package/lib/typescript/themes.d.ts +15 -0
- package/lib/typescript/themes.d.ts.map +1 -0
- package/lib/typescript/types.d.ts +194 -24
- package/lib/typescript/types.d.ts.map +1 -1
- package/lib/typescript/use-board-gesture.d.ts +28 -2
- package/lib/typescript/use-board-gesture.d.ts.map +1 -1
- package/lib/typescript/use-premove.d.ts +31 -0
- package/lib/typescript/use-premove.d.ts.map +1 -0
- package/package.json +4 -2
- package/src/board-annotations.tsx +147 -0
- package/src/board-arrows.tsx +197 -0
- package/src/board-highlights.tsx +226 -0
- package/src/board-piece.tsx +50 -12
- package/src/board-pieces.tsx +4 -1
- package/src/board.tsx +462 -46
- package/src/constants.ts +100 -0
- package/src/index.ts +62 -1
- package/src/pieces/default-pieces.tsx +383 -0
- package/src/pieces/index.ts +1 -0
- package/src/promotion-picker.tsx +147 -0
- package/src/static-board.tsx +150 -0
- package/src/themes.ts +129 -0
- package/src/types.ts +251 -25
- package/src/use-board-gesture.ts +219 -8
- package/src/use-premove.ts +59 -0
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import Svg, { Line, Polygon, Circle as SvgCircle } from 'react-native-svg';
|
|
6
|
+
import { DEFAULT_ARROW_COLOR, DEFAULT_SHAPE_COLOR, ARROW_STROKE_WIDTH, ARROW_HEAD_SIZE, ARROW_SHORTEN_BY } from './constants';
|
|
7
|
+
|
|
8
|
+
// ---------------------------------------------------------------------------
|
|
9
|
+
// Coordinate utilities (percentage-based viewBox 0-100)
|
|
10
|
+
// ---------------------------------------------------------------------------
|
|
11
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
12
|
+
function squareToViewBoxCenter(square, orientation) {
|
|
13
|
+
const fileIdx = square.charCodeAt(0) - 97;
|
|
14
|
+
const rankIdx = parseInt(square[1], 10) - 1;
|
|
15
|
+
const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
|
|
16
|
+
const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
|
|
17
|
+
return {
|
|
18
|
+
x: (col + 0.5) * 12.5,
|
|
19
|
+
y: (row + 0.5) * 12.5
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
function calculateArrowPath(from, to, shortenBy) {
|
|
23
|
+
const dx = to.x - from.x;
|
|
24
|
+
const dy = to.y - from.y;
|
|
25
|
+
const len = Math.sqrt(dx * dx + dy * dy);
|
|
26
|
+
if (len === 0) return {
|
|
27
|
+
x1: from.x,
|
|
28
|
+
y1: from.y,
|
|
29
|
+
x2: to.x,
|
|
30
|
+
y2: to.y
|
|
31
|
+
};
|
|
32
|
+
const ux = dx / len;
|
|
33
|
+
const uy = dy / len;
|
|
34
|
+
return {
|
|
35
|
+
x1: from.x + ux * shortenBy,
|
|
36
|
+
y1: from.y + uy * shortenBy,
|
|
37
|
+
x2: to.x - ux * shortenBy,
|
|
38
|
+
y2: to.y - uy * shortenBy
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
// ---------------------------------------------------------------------------
|
|
43
|
+
// Props
|
|
44
|
+
// ---------------------------------------------------------------------------
|
|
45
|
+
|
|
46
|
+
// ---------------------------------------------------------------------------
|
|
47
|
+
// Combined arrows + shapes SVG layer
|
|
48
|
+
// ---------------------------------------------------------------------------
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* SVG overlay for arrows and shapes drawn on the board.
|
|
52
|
+
*
|
|
53
|
+
* Uses a percentage-based 100x100 viewBox so coordinates map cleanly
|
|
54
|
+
* to the 8x8 grid (each square = 12.5 x 12.5 units).
|
|
55
|
+
*
|
|
56
|
+
* Renders above the pieces layer so arrows are always visible.
|
|
57
|
+
*/
|
|
58
|
+
export const BoardArrows = /*#__PURE__*/React.memo(function BoardArrows({
|
|
59
|
+
boardSize,
|
|
60
|
+
orientation,
|
|
61
|
+
arrows,
|
|
62
|
+
shapes
|
|
63
|
+
}) {
|
|
64
|
+
const hasArrows = arrows && arrows.length > 0;
|
|
65
|
+
const hasShapes = shapes && shapes.length > 0;
|
|
66
|
+
if (!hasArrows && !hasShapes) return null;
|
|
67
|
+
return /*#__PURE__*/_jsx(View, {
|
|
68
|
+
style: {
|
|
69
|
+
position: 'absolute',
|
|
70
|
+
width: boardSize,
|
|
71
|
+
height: boardSize
|
|
72
|
+
},
|
|
73
|
+
pointerEvents: "none",
|
|
74
|
+
children: /*#__PURE__*/_jsxs(Svg, {
|
|
75
|
+
viewBox: "0 0 100 100",
|
|
76
|
+
width: boardSize,
|
|
77
|
+
height: boardSize,
|
|
78
|
+
children: [hasShapes && shapes.map((shape, i) => {
|
|
79
|
+
if (shape.type === 'circle') {
|
|
80
|
+
const center = squareToViewBoxCenter(shape.square, orientation);
|
|
81
|
+
const color = shape.color ?? DEFAULT_SHAPE_COLOR;
|
|
82
|
+
return /*#__PURE__*/_jsx(SvgCircle, {
|
|
83
|
+
cx: center.x,
|
|
84
|
+
cy: center.y,
|
|
85
|
+
r: 5.5,
|
|
86
|
+
fill: "none",
|
|
87
|
+
stroke: color,
|
|
88
|
+
strokeWidth: 1.2,
|
|
89
|
+
opacity: 0.85
|
|
90
|
+
}, `circle-${shape.square}-${i}`);
|
|
91
|
+
}
|
|
92
|
+
return null;
|
|
93
|
+
}), hasArrows && arrows.map((arrow, i) => /*#__PURE__*/_jsx(ArrowSvg, {
|
|
94
|
+
from: arrow.from,
|
|
95
|
+
to: arrow.to,
|
|
96
|
+
color: arrow.color ?? DEFAULT_ARROW_COLOR,
|
|
97
|
+
width: arrow.width ?? ARROW_STROKE_WIDTH,
|
|
98
|
+
orientation: orientation
|
|
99
|
+
}, `arrow-${arrow.from}-${arrow.to}-${i}`))]
|
|
100
|
+
})
|
|
101
|
+
});
|
|
102
|
+
});
|
|
103
|
+
|
|
104
|
+
// ---------------------------------------------------------------------------
|
|
105
|
+
// Single arrow SVG element
|
|
106
|
+
// ---------------------------------------------------------------------------
|
|
107
|
+
|
|
108
|
+
const ArrowSvg = /*#__PURE__*/React.memo(function ArrowSvg({
|
|
109
|
+
from,
|
|
110
|
+
to,
|
|
111
|
+
color,
|
|
112
|
+
width,
|
|
113
|
+
orientation
|
|
114
|
+
}) {
|
|
115
|
+
const fromCoord = squareToViewBoxCenter(from, orientation);
|
|
116
|
+
const toCoord = squareToViewBoxCenter(to, orientation);
|
|
117
|
+
const path = calculateArrowPath(fromCoord, toCoord, ARROW_SHORTEN_BY);
|
|
118
|
+
const dx = path.x2 - path.x1;
|
|
119
|
+
const dy = path.y2 - path.y1;
|
|
120
|
+
const len = Math.sqrt(dx * dx + dy * dy);
|
|
121
|
+
if (len === 0) return null;
|
|
122
|
+
const ux = dx / len;
|
|
123
|
+
const uy = dy / len;
|
|
124
|
+
const headSize = ARROW_HEAD_SIZE;
|
|
125
|
+
const tip = {
|
|
126
|
+
x: path.x2,
|
|
127
|
+
y: path.y2
|
|
128
|
+
};
|
|
129
|
+
const baseLeft = {
|
|
130
|
+
x: path.x2 - ux * headSize * 2 + uy * headSize,
|
|
131
|
+
y: path.y2 - uy * headSize * 2 - ux * headSize
|
|
132
|
+
};
|
|
133
|
+
const baseRight = {
|
|
134
|
+
x: path.x2 - ux * headSize * 2 - uy * headSize,
|
|
135
|
+
y: path.y2 - uy * headSize * 2 + ux * headSize
|
|
136
|
+
};
|
|
137
|
+
const arrowPoints = `${tip.x},${tip.y} ${baseLeft.x},${baseLeft.y} ${baseRight.x},${baseRight.y}`;
|
|
138
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
139
|
+
children: [/*#__PURE__*/_jsx(Line, {
|
|
140
|
+
x1: path.x1,
|
|
141
|
+
y1: path.y1,
|
|
142
|
+
x2: path.x2,
|
|
143
|
+
y2: path.y2,
|
|
144
|
+
stroke: color,
|
|
145
|
+
strokeWidth: width,
|
|
146
|
+
strokeLinecap: "round",
|
|
147
|
+
opacity: 0.85
|
|
148
|
+
}), /*#__PURE__*/_jsx(Polygon, {
|
|
149
|
+
points: arrowPoints,
|
|
150
|
+
fill: color,
|
|
151
|
+
opacity: 0.85
|
|
152
|
+
})]
|
|
153
|
+
});
|
|
154
|
+
});
|
|
155
|
+
|
|
156
|
+
// ---------------------------------------------------------------------------
|
|
157
|
+
// Standalone exports for advanced consumers
|
|
158
|
+
// ---------------------------------------------------------------------------
|
|
159
|
+
|
|
160
|
+
export { ArrowSvg as Arrow };
|
|
161
|
+
//# sourceMappingURL=board-arrows.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","View","Svg","Line","Polygon","Circle","SvgCircle","DEFAULT_ARROW_COLOR","DEFAULT_SHAPE_COLOR","ARROW_STROKE_WIDTH","ARROW_HEAD_SIZE","ARROW_SHORTEN_BY","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","squareToViewBoxCenter","square","orientation","fileIdx","charCodeAt","rankIdx","parseInt","col","row","x","y","calculateArrowPath","from","to","shortenBy","dx","dy","len","Math","sqrt","x1","y1","x2","y2","ux","uy","BoardArrows","memo","boardSize","arrows","shapes","hasArrows","length","hasShapes","style","position","width","height","pointerEvents","children","viewBox","map","shape","i","type","center","color","cx","cy","r","fill","stroke","strokeWidth","opacity","arrow","ArrowSvg","fromCoord","toCoord","path","headSize","tip","baseLeft","baseRight","arrowPoints","strokeLinecap","points","Arrow"],"sourceRoot":"..\\..\\src","sources":["board-arrows.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import Animated, { useAnimatedStyle } from 'react-native-reanimated';
|
|
6
|
+
import { squareToXY } from './use-board-pieces';
|
|
7
|
+
|
|
8
|
+
// ---------------------------------------------------------------------------
|
|
9
|
+
// Props
|
|
10
|
+
// ---------------------------------------------------------------------------
|
|
11
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
+
// ---------------------------------------------------------------------------
|
|
13
|
+
// Static highlights (View-based, no animation needed)
|
|
14
|
+
// ---------------------------------------------------------------------------
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* Renders all board square highlights as a single layer.
|
|
18
|
+
*
|
|
19
|
+
* Combines multiple highlight sources (last move, check, selected piece,
|
|
20
|
+
* premoves, custom, and imperative) into one flat list of colored rectangles.
|
|
21
|
+
* Rendered between the background and pieces layers.
|
|
22
|
+
*
|
|
23
|
+
* Uses plain Views (not Animated) because highlights change discretely
|
|
24
|
+
* on move events, not during animation frames.
|
|
25
|
+
*/
|
|
26
|
+
export const BoardHighlights = /*#__PURE__*/React.memo(function BoardHighlights({
|
|
27
|
+
boardSize,
|
|
28
|
+
orientation,
|
|
29
|
+
squareSize,
|
|
30
|
+
lastMove,
|
|
31
|
+
lastMoveColor,
|
|
32
|
+
checkSquare,
|
|
33
|
+
checkColor,
|
|
34
|
+
selectedSquare,
|
|
35
|
+
selectedColor,
|
|
36
|
+
premoveSquares,
|
|
37
|
+
premoveColor,
|
|
38
|
+
highlights,
|
|
39
|
+
imperativeHighlights
|
|
40
|
+
}) {
|
|
41
|
+
// Collect all highlights into a flat array (ordered by visual priority: bottom to top)
|
|
42
|
+
const allHighlights = [];
|
|
43
|
+
|
|
44
|
+
// Last move (lowest priority -- drawn first, underneath everything)
|
|
45
|
+
if (lastMove) {
|
|
46
|
+
allHighlights.push({
|
|
47
|
+
square: lastMove.from,
|
|
48
|
+
color: lastMoveColor
|
|
49
|
+
});
|
|
50
|
+
allHighlights.push({
|
|
51
|
+
square: lastMove.to,
|
|
52
|
+
color: lastMoveColor
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
// Premove highlights
|
|
57
|
+
if (premoveSquares) {
|
|
58
|
+
allHighlights.push({
|
|
59
|
+
square: premoveSquares.from,
|
|
60
|
+
color: premoveColor
|
|
61
|
+
});
|
|
62
|
+
allHighlights.push({
|
|
63
|
+
square: premoveSquares.to,
|
|
64
|
+
color: premoveColor
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
// Selected piece square
|
|
69
|
+
if (selectedSquare) {
|
|
70
|
+
allHighlights.push({
|
|
71
|
+
square: selectedSquare,
|
|
72
|
+
color: selectedColor
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
// Check indicator (king square)
|
|
77
|
+
if (checkSquare) {
|
|
78
|
+
allHighlights.push({
|
|
79
|
+
square: checkSquare,
|
|
80
|
+
color: checkColor
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
// Consumer-provided custom highlights
|
|
85
|
+
if (highlights) {
|
|
86
|
+
for (const h of highlights) {
|
|
87
|
+
allHighlights.push(h);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
// Imperative highlights (from ref.highlight() calls)
|
|
92
|
+
if (imperativeHighlights) {
|
|
93
|
+
for (const h of imperativeHighlights) {
|
|
94
|
+
allHighlights.push(h);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
if (allHighlights.length === 0) return null;
|
|
98
|
+
return /*#__PURE__*/_jsx(View, {
|
|
99
|
+
style: {
|
|
100
|
+
position: 'absolute',
|
|
101
|
+
width: boardSize,
|
|
102
|
+
height: boardSize
|
|
103
|
+
},
|
|
104
|
+
pointerEvents: "none",
|
|
105
|
+
children: allHighlights.map((h, i) => {
|
|
106
|
+
const {
|
|
107
|
+
x,
|
|
108
|
+
y
|
|
109
|
+
} = squareToXY(h.square, squareSize, orientation);
|
|
110
|
+
return /*#__PURE__*/_jsx(View, {
|
|
111
|
+
style: {
|
|
112
|
+
position: 'absolute',
|
|
113
|
+
left: x,
|
|
114
|
+
top: y,
|
|
115
|
+
width: squareSize,
|
|
116
|
+
height: squareSize,
|
|
117
|
+
backgroundColor: h.color
|
|
118
|
+
}
|
|
119
|
+
}, `${h.square}-${h.color}-${i}`);
|
|
120
|
+
})
|
|
121
|
+
});
|
|
122
|
+
});
|
|
123
|
+
|
|
124
|
+
// ---------------------------------------------------------------------------
|
|
125
|
+
// Drag target highlight (Animated, updates on UI thread during drag)
|
|
126
|
+
// ---------------------------------------------------------------------------
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Highlight on the square currently under the dragged piece.
|
|
130
|
+
* Uses Reanimated shared values for zero-JS-bridge updates during drag.
|
|
131
|
+
*/
|
|
132
|
+
export const DragTargetHighlight = /*#__PURE__*/React.memo(function DragTargetHighlight({
|
|
133
|
+
squareSize,
|
|
134
|
+
orientation,
|
|
135
|
+
dragTargetSquare,
|
|
136
|
+
color
|
|
137
|
+
}) {
|
|
138
|
+
const animatedStyle = useAnimatedStyle(() => {
|
|
139
|
+
const square = dragTargetSquare.value;
|
|
140
|
+
if (!square) {
|
|
141
|
+
return {
|
|
142
|
+
opacity: 0,
|
|
143
|
+
transform: [{
|
|
144
|
+
translateX: 0
|
|
145
|
+
}, {
|
|
146
|
+
translateY: 0
|
|
147
|
+
}]
|
|
148
|
+
};
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
// Inline coordinate calculation (worklet-safe, no function call)
|
|
152
|
+
const fileIdx = square.charCodeAt(0) - 97;
|
|
153
|
+
const rankIdx = parseInt(square[1], 10) - 1;
|
|
154
|
+
const col = orientation === 'white' ? fileIdx : 7 - fileIdx;
|
|
155
|
+
const row = orientation === 'white' ? 7 - rankIdx : rankIdx;
|
|
156
|
+
return {
|
|
157
|
+
opacity: 1,
|
|
158
|
+
transform: [{
|
|
159
|
+
translateX: col * squareSize
|
|
160
|
+
}, {
|
|
161
|
+
translateY: row * squareSize
|
|
162
|
+
}]
|
|
163
|
+
};
|
|
164
|
+
});
|
|
165
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
166
|
+
style: [{
|
|
167
|
+
position: 'absolute',
|
|
168
|
+
width: squareSize,
|
|
169
|
+
height: squareSize,
|
|
170
|
+
backgroundColor: color
|
|
171
|
+
}, animatedStyle],
|
|
172
|
+
pointerEvents: "none"
|
|
173
|
+
});
|
|
174
|
+
});
|
|
175
|
+
|
|
176
|
+
// ---------------------------------------------------------------------------
|
|
177
|
+
// Standalone SquareHighlight (exported for advanced consumers)
|
|
178
|
+
// ---------------------------------------------------------------------------
|
|
179
|
+
|
|
180
|
+
/**
|
|
181
|
+
* Single square highlight component.
|
|
182
|
+
* Exported for consumers who build their own overlay layers.
|
|
183
|
+
*/
|
|
184
|
+
export const SquareHighlight = /*#__PURE__*/React.memo(function SquareHighlight({
|
|
185
|
+
square,
|
|
186
|
+
color,
|
|
187
|
+
squareSize,
|
|
188
|
+
orientation
|
|
189
|
+
}) {
|
|
190
|
+
const {
|
|
191
|
+
x,
|
|
192
|
+
y
|
|
193
|
+
} = squareToXY(square, squareSize, orientation);
|
|
194
|
+
return /*#__PURE__*/_jsx(View, {
|
|
195
|
+
style: {
|
|
196
|
+
position: 'absolute',
|
|
197
|
+
left: x,
|
|
198
|
+
top: y,
|
|
199
|
+
width: squareSize,
|
|
200
|
+
height: squareSize,
|
|
201
|
+
backgroundColor: color
|
|
202
|
+
},
|
|
203
|
+
pointerEvents: "none"
|
|
204
|
+
});
|
|
205
|
+
});
|
|
206
|
+
//# sourceMappingURL=board-highlights.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","View","Animated","useAnimatedStyle","squareToXY","jsx","_jsx","BoardHighlights","memo","boardSize","orientation","squareSize","lastMove","lastMoveColor","checkSquare","checkColor","selectedSquare","selectedColor","premoveSquares","premoveColor","highlights","imperativeHighlights","allHighlights","push","square","from","color","to","h","length","style","position","width","height","pointerEvents","children","map","i","x","y","left","top","backgroundColor","DragTargetHighlight","dragTargetSquare","animatedStyle","value","opacity","transform","translateX","translateY","fileIdx","charCodeAt","rankIdx","parseInt","col","row","SquareHighlight"],"sourceRoot":"..\\..\\src","sources":["board-highlights.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,IACbC,gBAAgB,QAEX,yBAAyB;AAGhC,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AA+BA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAAe,gBAAGP,KAAK,CAACQ,IAAI,CAAC,SAASD,eAAeA,CAAC;EACjEE,SAAS;EACTC,WAAW;EACXC,UAAU;EACVC,QAAQ;EACRC,aAAa;EACbC,WAAW;EACXC,UAAU;EACVC,cAAc;EACdC,aAAa;EACbC,cAAc;EACdC,YAAY;EACZC,UAAU;EACVC;AACoB,CAAC,EAAE;EACvB;EACA,MAAMC,aAA8B,GAAG,EAAE;;EAEzC;EACA,IAAIV,QAAQ,EAAE;IACZU,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEZ,QAAQ,CAACa,IAAI;MAAEC,KAAK,EAAEb;IAAc,CAAC,CAAC;IACnES,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEZ,QAAQ,CAACe,EAAE;MAAED,KAAK,EAAEb;IAAc,CAAC,CAAC;EACnE;;EAEA;EACA,IAAIK,cAAc,EAAE;IAClBI,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEN,cAAc,CAACO,IAAI;MAAEC,KAAK,EAAEP;IAAa,CAAC,CAAC;IACxEG,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEN,cAAc,CAACS,EAAE;MAAED,KAAK,EAAEP;IAAa,CAAC,CAAC;EACxE;;EAEA;EACA,IAAIH,cAAc,EAAE;IAClBM,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAER,cAAc;MAAEU,KAAK,EAAET;IAAc,CAAC,CAAC;EACtE;;EAEA;EACA,IAAIH,WAAW,EAAE;IACfQ,aAAa,CAACC,IAAI,CAAC;MAAEC,MAAM,EAAEV,WAAW;MAAEY,KAAK,EAAEX;IAAW,CAAC,CAAC;EAChE;;EAEA;EACA,IAAIK,UAAU,EAAE;IACd,KAAK,MAAMQ,CAAC,IAAIR,UAAU,EAAE;MAC1BE,aAAa,CAACC,IAAI,CAACK,CAAC,CAAC;IACvB;EACF;;EAEA;EACA,IAAIP,oBAAoB,EAAE;IACxB,KAAK,MAAMO,CAAC,IAAIP,oBAAoB,EAAE;MACpCC,aAAa,CAACC,IAAI,CAACK,CAAC,CAAC;IACvB;EACF;EAEA,IAAIN,aAAa,CAACO,MAAM,KAAK,CAAC,EAAE,OAAO,IAAI;EAE3C,oBACEvB,IAAA,CAACL,IAAI;IACH6B,KAAK,EAAE;MAAEC,QAAQ,EAAE,UAAU;MAAEC,KAAK,EAAEvB,SAAS;MAAEwB,MAAM,EAAExB;IAAU,CAAE;IACrEyB,aAAa,EAAC,MAAM;IAAAC,QAAA,EAEnBb,aAAa,CAACc,GAAG,CAAC,CAACR,CAAC,EAAES,CAAC,KAAK;MAC3B,MAAM;QAAEC,CAAC;QAAEC;MAAE,CAAC,GAAGnC,UAAU,CAACwB,CAAC,CAACJ,MAAM,EAAEb,UAAU,EAAED,WAAW,CAAC;MAC9D,oBACEJ,IAAA,CAACL,IAAI;QAEH6B,KAAK,EAAE;UACLC,QAAQ,EAAE,UAAU;UACpBS,IAAI,EAAEF,CAAC;UACPG,GAAG,EAAEF,CAAC;UACNP,KAAK,EAAErB,UAAU;UACjBsB,MAAM,EAAEtB,UAAU;UAClB+B,eAAe,EAAEd,CAAC,CAACF;QACrB;MAAE,GARG,GAAGE,CAAC,CAACJ,MAAM,IAAII,CAAC,CAACF,KAAK,IAAIW,CAAC,EASjC,CAAC;IAEN,CAAC;EAAC,CACE,CAAC;AAEX,CAAC,CAAC;;AAEF;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA,OAAO,MAAMM,mBAAmB,gBAAG3C,KAAK,CAACQ,IAAI,CAAC,SAASmC,mBAAmBA,CAAC;EACzEhC,UAAU;EACVD,WAAW;EACXkC,gBAAgB;EAChBlB;AACwB,CAAC,EAAE;EAC3B,MAAMmB,aAAa,GAAG1C,gBAAgB,CAAC,MAAM;IAC3C,MAAMqB,MAAM,GAAGoB,gBAAgB,CAACE,KAAK;IACrC,IAAI,CAACtB,MAAM,EAAE;MACX,OAAO;QAAEuB,OAAO,EAAE,CAAC;QAAEC,SAAS,EAAE,CAAC;UAAEC,UAAU,EAAE;QAAE,CAAC,EAAE;UAAEC,UAAU,EAAE;QAAE,CAAC;MAAE,CAAC;IAC1E;;IAEA;IACA,MAAMC,OAAO,GAAG3B,MAAM,CAAC4B,UAAU,CAAC,CAAC,CAAC,GAAG,EAAE;IACzC,MAAMC,OAAO,GAAGC,QAAQ,CAAC9B,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC;IAC3C,MAAM+B,GAAG,GAAG7C,WAAW,KAAK,OAAO,GAAGyC,OAAO,GAAG,CAAC,GAAGA,OAAO;IAC3D,MAAMK,GAAG,GAAG9C,WAAW,KAAK,OAAO,GAAG,CAAC,GAAG2C,OAAO,GAAGA,OAAO;IAE3D,OAAO;MACLN,OAAO,EAAE,CAAC;MACVC,SAAS,EAAE,CACT;QAAEC,UAAU,EAAEM,GAAG,GAAG5C;MAAW,CAAC,EAChC;QAAEuC,UAAU,EAAEM,GAAG,GAAG7C;MAAW,CAAC;IAEpC,CAAC;EACH,CAAC,CAAC;EAEF,oBACEL,IAAA,CAACJ,QAAQ,CAACD,IAAI;IACZ6B,KAAK,EAAE,CACL;MACEC,QAAQ,EAAE,UAAU;MACpBC,KAAK,EAAErB,UAAU;MACjBsB,MAAM,EAAEtB,UAAU;MAClB+B,eAAe,EAAEhB;IACnB,CAAC,EACDmB,aAAa,CACb;IACFX,aAAa,EAAC;EAAM,CACrB,CAAC;AAEN,CAAC,CAAC;;AAEF;AACA;AACA;;AASA;AACA;AACA;AACA;AACA,OAAO,MAAMuB,eAAe,gBAAGzD,KAAK,CAACQ,IAAI,CAAC,SAASiD,eAAeA,CAAC;EACjEjC,MAAM;EACNE,KAAK;EACLf,UAAU;EACVD;AACoB,CAAC,EAAE;EACvB,MAAM;IAAE4B,CAAC;IAAEC;EAAE,CAAC,GAAGnC,UAAU,CAACoB,MAAM,EAAEb,UAAU,EAAED,WAAW,CAAC;EAE5D,oBACEJ,IAAA,CAACL,IAAI;IACH6B,KAAK,EAAE;MACLC,QAAQ,EAAE,UAAU;MACpBS,IAAI,EAAEF,CAAC;MACPG,GAAG,EAAEF,CAAC;MACNP,KAAK,EAAErB,UAAU;MACjBsB,MAAM,EAAEtB,UAAU;MAClB+B,eAAe,EAAEhB;IACnB,CAAE;IACFQ,aAAa,EAAC;EAAM,CACrB,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}
|
|
@@ -1,8 +1,34 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import React, { useEffect } from 'react';
|
|
4
|
-
import Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
|
|
4
|
+
import Animated, { useAnimatedStyle, useSharedValue, withTiming, withSpring, FadeOut } from 'react-native-reanimated';
|
|
5
|
+
import { DEFAULT_MOVE_DURATION, CAPTURE_FADE_DURATION } from './constants';
|
|
5
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
/**
|
|
8
|
+
* Animate a shared value using the provided AnimationConfig.
|
|
9
|
+
* Falls back to withTiming with moveDuration for backwards compatibility.
|
|
10
|
+
*/
|
|
11
|
+
function animateValue(target, config, moveDuration) {
|
|
12
|
+
if (config) {
|
|
13
|
+
if (config.type === 'spring') {
|
|
14
|
+
return withSpring(target, {
|
|
15
|
+
damping: config.damping ?? 15,
|
|
16
|
+
stiffness: config.stiffness ?? 200,
|
|
17
|
+
mass: config.mass ?? 1
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
// timing
|
|
21
|
+
return withTiming(target, {
|
|
22
|
+
duration: config.duration ?? DEFAULT_MOVE_DURATION
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
const duration = moveDuration ?? DEFAULT_MOVE_DURATION;
|
|
26
|
+
if (duration <= 0) return target;
|
|
27
|
+
return withTiming(target, {
|
|
28
|
+
duration
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
|
|
6
32
|
/**
|
|
7
33
|
* A single animated chess piece.
|
|
8
34
|
*
|
|
@@ -15,13 +41,17 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
15
41
|
* - No position changes on the original piece during drag
|
|
16
42
|
*
|
|
17
43
|
* After a move:
|
|
18
|
-
* - Snaps to new position via withTiming on translateX/translateY
|
|
19
|
-
* -
|
|
44
|
+
* - Snaps to new position via withTiming/withSpring on translateX/translateY
|
|
45
|
+
* - Animation style controlled by user's animationConfig or moveDuration
|
|
46
|
+
*
|
|
47
|
+
* On capture (unmount):
|
|
48
|
+
* - Fades out via Reanimated's `exiting` prop (FadeOut)
|
|
20
49
|
*/
|
|
21
50
|
export const BoardPieceView = /*#__PURE__*/React.memo(function BoardPieceView({
|
|
22
51
|
targetX,
|
|
23
52
|
targetY,
|
|
24
53
|
squareSize,
|
|
54
|
+
animationConfig,
|
|
25
55
|
moveDuration,
|
|
26
56
|
children,
|
|
27
57
|
activeSquare,
|
|
@@ -36,13 +66,9 @@ export const BoardPieceView = /*#__PURE__*/React.memo(function BoardPieceView({
|
|
|
36
66
|
// useEffect is the correct pattern for reacting to JS prop changes —
|
|
37
67
|
// useDerivedValue is meant for shared-value-to-shared-value derivation.
|
|
38
68
|
useEffect(() => {
|
|
39
|
-
currentX.value =
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
currentY.value = moveDuration > 0 ? withTiming(targetY, {
|
|
43
|
-
duration: moveDuration
|
|
44
|
-
}) : targetY;
|
|
45
|
-
}, [targetX, targetY, moveDuration, currentX, currentY]);
|
|
69
|
+
currentX.value = animateValue(targetX, animationConfig, moveDuration);
|
|
70
|
+
currentY.value = animateValue(targetY, animationConfig, moveDuration);
|
|
71
|
+
}, [targetX, targetY, animationConfig, moveDuration, currentX, currentY]);
|
|
46
72
|
const animatedStyle = useAnimatedStyle(() => {
|
|
47
73
|
const isBeingDragged = isDragging.value && activeSquare.value === square;
|
|
48
74
|
return {
|
|
@@ -60,10 +86,13 @@ export const BoardPieceView = /*#__PURE__*/React.memo(function BoardPieceView({
|
|
|
60
86
|
position: 'absolute',
|
|
61
87
|
width: squareSize,
|
|
62
88
|
height: squareSize
|
|
63
|
-
}, animatedStyle]
|
|
89
|
+
}, animatedStyle]
|
|
90
|
+
// Fade out when this piece is captured (removed from the piece list)
|
|
91
|
+
,
|
|
92
|
+
exiting: FadeOut.duration(CAPTURE_FADE_DURATION),
|
|
64
93
|
children: children
|
|
65
94
|
});
|
|
66
95
|
},
|
|
67
|
-
// Custom comparator: only re-render when position or
|
|
68
|
-
(prev, next) => prev.targetX === next.targetX && prev.targetY === next.targetY && prev.square === next.square && prev.squareSize === next.squareSize && prev.moveDuration === next.moveDuration && prev.children === next.children);
|
|
96
|
+
// Custom comparator: only re-render when position, square, or animation config changes
|
|
97
|
+
(prev, next) => prev.targetX === next.targetX && prev.targetY === next.targetY && prev.square === next.square && prev.squareSize === next.squareSize && prev.moveDuration === next.moveDuration && prev.animationConfig === next.animationConfig && prev.children === next.children);
|
|
69
98
|
//# sourceMappingURL=board-piece.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useEffect","Animated","useAnimatedStyle","useSharedValue","withTiming","jsx","_jsx","BoardPieceView","memo","targetX","targetY","squareSize","
|
|
1
|
+
{"version":3,"names":["React","useEffect","Animated","useAnimatedStyle","useSharedValue","withTiming","withSpring","FadeOut","DEFAULT_MOVE_DURATION","CAPTURE_FADE_DURATION","jsx","_jsx","animateValue","target","config","moveDuration","type","damping","stiffness","mass","duration","BoardPieceView","memo","targetX","targetY","squareSize","animationConfig","children","activeSquare","isDragging","square","currentX","currentY","value","animatedStyle","isBeingDragged","transform","translateX","translateY","opacity","View","style","position","width","height","exiting","prev","next"],"sourceRoot":"..\\..\\src","sources":["board-piece.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -16,6 +16,7 @@ export const BoardPiecesLayer = /*#__PURE__*/React.memo(function BoardPiecesLaye
|
|
|
16
16
|
squareSize,
|
|
17
17
|
orientation,
|
|
18
18
|
moveDuration,
|
|
19
|
+
animationConfig,
|
|
19
20
|
renderPiece,
|
|
20
21
|
activeSquare,
|
|
21
22
|
isDragging
|
|
@@ -31,6 +32,7 @@ export const BoardPiecesLayer = /*#__PURE__*/React.memo(function BoardPiecesLaye
|
|
|
31
32
|
targetY: y,
|
|
32
33
|
squareSize: squareSize,
|
|
33
34
|
moveDuration: moveDuration,
|
|
35
|
+
animationConfig: animationConfig,
|
|
34
36
|
activeSquare: activeSquare,
|
|
35
37
|
isDragging: isDragging,
|
|
36
38
|
square: piece.square,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","BoardPieceView","squareToXY","jsx","_jsx","Fragment","_Fragment","BoardPiecesLayer","memo","pieces","squareSize","orientation","moveDuration","renderPiece","activeSquare","isDragging","children","map","piece","x","y","square","targetX","targetY","code","id"],"sourceRoot":"..\\..\\src","sources":["board-pieces.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,UAAU,QAAQ,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA;
|
|
1
|
+
{"version":3,"names":["React","BoardPieceView","squareToXY","jsx","_jsx","Fragment","_Fragment","BoardPiecesLayer","memo","pieces","squareSize","orientation","moveDuration","animationConfig","renderPiece","activeSquare","isDragging","children","map","piece","x","y","square","targetX","targetY","code","id"],"sourceRoot":"..\\..\\src","sources":["board-pieces.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,UAAU,QAAQ,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA;AAahD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,gBAAgB,gBAAGP,KAAK,CAACQ,IAAI,CAAC,SAASD,gBAAgBA,CAAC;EACnEE,MAAM;EACNC,UAAU;EACVC,WAAW;EACXC,YAAY;EACZC,eAAe;EACfC,WAAW;EACXC,YAAY;EACZC;AACgB,CAAC,EAAE;EACnB,oBACEZ,IAAA,CAAAE,SAAA;IAAAW,QAAA,EACGR,MAAM,CAACS,GAAG,CAAEC,KAAK,IAAK;MACrB,MAAM;QAAEC,CAAC;QAAEC;MAAE,CAAC,GAAGnB,UAAU,CAACiB,KAAK,CAACG,MAAM,EAAEZ,UAAU,EAAEC,WAAW,CAAC;MAElE,oBACEP,IAAA,CAACH,cAAc;QAEbsB,OAAO,EAAEH,CAAE;QACXI,OAAO,EAAEH,CAAE;QACXX,UAAU,EAAEA,UAAW;QACvBE,YAAY,EAAEA,YAAa;QAC3BC,eAAe,EAAEA,eAAgB;QACjCE,YAAY,EAAEA,YAAa;QAC3BC,UAAU,EAAEA,UAAW;QACvBM,MAAM,EAAEH,KAAK,CAACG,MAAO;QAAAL,QAAA,EAEpBH,WAAW,CAACK,KAAK,CAACM,IAAI,EAAEf,UAAU;MAAC,GAV/BS,KAAK,CAACO,EAWG,CAAC;IAErB,CAAC;EAAC,CACF,CAAC;AAEP,CAAC,CAAC","ignoreList":[]}
|