@mirasen/react-chessboard 2.0.1 → 2.0.2
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/LICENSE +1 -1
- package/README.md +20 -18
- package/package.json +10 -19
package/LICENSE
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
MIT License
|
|
2
2
|
|
|
3
|
-
Copyright (c) 2025 [Contributors](https://github.com/mirasen-io/
|
|
3
|
+
Copyright (c) 2025 [Contributors](https://github.com/mirasen-io/chessboard/graphs/contributors)
|
|
4
4
|
|
|
5
5
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
6
|
of this software and associated documentation files (the "Software"), to deal
|
package/README.md
CHANGED
|
@@ -1,23 +1,25 @@
|
|
|
1
1
|
[](https://www.npmjs.com/package/@mirasen/react-chessboard)
|
|
2
|
-
[](https://github.com/mirasen-io/chessboard/actions/workflows/ci.yml)
|
|
3
|
+
[](https://sonarcloud.io/summary/new_code?id=mirasen-io_chessboard)
|
|
4
|
+
[](https://sonarcloud.io/summary/new_code?id=mirasen-io_chessboard)
|
|
5
|
+
[](./LICENSE)
|
|
6
6
|
|
|
7
7
|
# @mirasen/react-chessboard
|
|
8
8
|
|
|
9
|
+
[Monorepo home](../../README.md) · [Contribution guide](../../CONTRIBUTING.md)
|
|
10
|
+
|
|
9
11
|
A React chessboard component with built-in interaction, promotion, animation, and chess.js integration.
|
|
10
12
|
|
|
11
13
|
Start with a working chessboard, not a board primitive.
|
|
12
14
|
|
|
13
15
|
## Try it live
|
|
14
16
|
|
|
15
|
-
These examples use the same
|
|
17
|
+
These examples use the same mirasen chessboard runtime that powers the React component.
|
|
16
18
|
|
|
17
|
-
- [Play a chess.js game](https://mirasen.
|
|
18
|
-
- [Watch 12 live boards](https://mirasen.
|
|
19
|
-
- [Try the promotion flow](https://mirasen.
|
|
20
|
-
- [Try the minimal example](https://mirasen.
|
|
19
|
+
- [Play a chess.js game](https://mirasen.k-tarmyshov.workers.dev/chessboard/examples/chessjs)
|
|
20
|
+
- [Watch 12 live boards](https://mirasen.k-tarmyshov.workers.dev/chessboard/examples/live-games-grid)
|
|
21
|
+
- [Try the promotion flow](https://mirasen.k-tarmyshov.workers.dev/chessboard/examples/promotion)
|
|
22
|
+
- [Try the minimal example](https://mirasen.k-tarmyshov.workers.dev/chessboard/examples/minimal)
|
|
21
23
|
|
|
22
24
|
## Why this exists
|
|
23
25
|
|
|
@@ -32,11 +34,11 @@ Most React chessboard components give you a board primitive and leave the real c
|
|
|
32
34
|
|
|
33
35
|
`@mirasen/react-chessboard` wraps `@mirasen/chessboard` in a small React component so React apps can start from a working chessboard instead.
|
|
34
36
|
|
|
35
|
-
React owns lifecycle and props.
|
|
37
|
+
React owns lifecycle and props. mirasen owns board rendering, input, interaction, animation, promotion, and extension behavior.
|
|
36
38
|
|
|
37
39
|
## Real-world migration feedback
|
|
38
40
|
|
|
39
|
-
After initially using `react-chessboard` and implementing click-to-move and move highlighting in application code, [TheUnemployedHobo](https://github.com/TheUnemployedHobo) explained why he migrated to
|
|
41
|
+
After initially using `react-chessboard` and implementing click-to-move and move highlighting in application code, [TheUnemployedHobo](https://github.com/TheUnemployedHobo) explained why he migrated to mirasen:
|
|
40
42
|
|
|
41
43
|
> "But the code ended up getting so messy that I didn't even want to look at it anymore. It was painful to read. That's when I decided I needed a library that handled those things properly out of the box, and that's how I ended up switching to yours."
|
|
42
44
|
|
|
@@ -81,7 +83,7 @@ User moves are disabled unless you provide `movability`. For a playable chess ga
|
|
|
81
83
|
`@mirasen/react-chessboard` owns board interaction and UI move output.
|
|
82
84
|
`chess.js` owns legality and game state.
|
|
83
85
|
|
|
84
|
-
The package re-exports the
|
|
86
|
+
The package re-exports the mirasen chess.js adapter helpers:
|
|
85
87
|
|
|
86
88
|
```tsx
|
|
87
89
|
import {
|
|
@@ -195,7 +197,7 @@ export function App() {
|
|
|
195
197
|
}
|
|
196
198
|
```
|
|
197
199
|
|
|
198
|
-
For a complete local smoke example, see [`examples/
|
|
200
|
+
For a complete local smoke example, see [`examples/react`](../../examples/react).
|
|
199
201
|
|
|
200
202
|
## Request-based props
|
|
201
203
|
|
|
@@ -344,7 +346,7 @@ This keeps the integration boundary explicit:
|
|
|
344
346
|
|
|
345
347
|
- `chess.js` decides which moves are legal.
|
|
346
348
|
- The React component displays and collects user moves.
|
|
347
|
-
-
|
|
349
|
+
- mirasen handles board interaction, target feedback, promotion UI, special-move board updates, and animation.
|
|
348
350
|
|
|
349
351
|
## Board handle (ref)
|
|
350
352
|
|
|
@@ -378,7 +380,7 @@ Convenience props (`autoPromoteToQueen`, `checkSquare`, `onUIMove`) cover the mo
|
|
|
378
380
|
|
|
379
381
|
## What you get out of the box
|
|
380
382
|
|
|
381
|
-
The underlying
|
|
383
|
+
The underlying mirasen board provides the default first-party chessboard baseline:
|
|
382
384
|
|
|
383
385
|
- SVG rendering
|
|
384
386
|
- pointer-based click and drag interaction
|
|
@@ -394,7 +396,7 @@ The underlying Mirasen board provides the default first-party chessboard baselin
|
|
|
394
396
|
|
|
395
397
|
## Styling and customization
|
|
396
398
|
|
|
397
|
-
The React component intentionally exposes a small high-level API and uses the default
|
|
399
|
+
The React component intentionally exposes a small high-level API and uses the default mirasen board appearance.
|
|
398
400
|
|
|
399
401
|
It does not expose color, square, piece, renderer, or extension customization props in v1.
|
|
400
402
|
|
|
@@ -443,7 +445,7 @@ Use this route when you need lower-level runtime access than the React component
|
|
|
443
445
|
## Local example app
|
|
444
446
|
|
|
445
447
|
```bash
|
|
446
|
-
cd examples/
|
|
448
|
+
cd examples/react
|
|
447
449
|
npm install
|
|
448
450
|
npm run dev
|
|
449
451
|
```
|
|
@@ -451,7 +453,7 @@ npm run dev
|
|
|
451
453
|
Production build:
|
|
452
454
|
|
|
453
455
|
```bash
|
|
454
|
-
cd examples/
|
|
456
|
+
cd examples/react
|
|
455
457
|
npm run build
|
|
456
458
|
```
|
|
457
459
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirasen/react-chessboard",
|
|
3
3
|
"description": "A React chessboard component with built-in interaction, promotion, animation, and chess.js integration.",
|
|
4
|
-
"version": "2.0.
|
|
4
|
+
"version": "2.0.2",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"mirasen",
|
|
@@ -15,13 +15,14 @@
|
|
|
15
15
|
"typescript",
|
|
16
16
|
"svg"
|
|
17
17
|
],
|
|
18
|
-
"homepage": "https://mirasen.
|
|
18
|
+
"homepage": "https://mirasen.k-tarmyshov.workers.dev/chessboard",
|
|
19
19
|
"repository": {
|
|
20
20
|
"type": "git",
|
|
21
|
-
"url": "git+https://github.com/mirasen-io/
|
|
21
|
+
"url": "git+https://github.com/mirasen-io/chessboard.git",
|
|
22
|
+
"directory": "packages/react-chessboard"
|
|
22
23
|
},
|
|
23
24
|
"bugs": {
|
|
24
|
-
"url": "https://github.com/mirasen-io/
|
|
25
|
+
"url": "https://github.com/mirasen-io/chessboard/issues"
|
|
25
26
|
},
|
|
26
27
|
"type": "module",
|
|
27
28
|
"types": "./dist/index.d.ts",
|
|
@@ -44,9 +45,7 @@
|
|
|
44
45
|
"check": "tsc --skipLibCheck --noEmit",
|
|
45
46
|
"check:test": "tsc --project tsconfig-test.json --skipLibCheck --noEmit",
|
|
46
47
|
"test": "npm run check:test && vitest run --run",
|
|
47
|
-
"coverage": "npm run check:test && vitest run --coverage"
|
|
48
|
-
"changeset:version": "changeset version && npm install && git add --all",
|
|
49
|
-
"changeset:publish": "changeset publish"
|
|
48
|
+
"coverage": "npm run check:test && vitest run --coverage"
|
|
50
49
|
},
|
|
51
50
|
"files": [
|
|
52
51
|
"dist",
|
|
@@ -56,7 +55,7 @@
|
|
|
56
55
|
"LICENSE"
|
|
57
56
|
],
|
|
58
57
|
"dependencies": {
|
|
59
|
-
"@mirasen/chessboard": "^1.5.
|
|
58
|
+
"@mirasen/chessboard": "^1.5.4"
|
|
60
59
|
},
|
|
61
60
|
"peerDependencies": {
|
|
62
61
|
"chess.js": "^1.4.0",
|
|
@@ -69,26 +68,18 @@
|
|
|
69
68
|
}
|
|
70
69
|
},
|
|
71
70
|
"devDependencies": {
|
|
72
|
-
"@changesets/cli": "^3.0.3",
|
|
73
|
-
"@eslint/compat": "^2.1.1",
|
|
74
|
-
"@eslint/js": "^10.0.1",
|
|
75
71
|
"@testing-library/react": "^16.3.3",
|
|
76
72
|
"@types/node": "^26.6.6",
|
|
77
73
|
"@types/react": "^19.3.0",
|
|
78
74
|
"@types/react-dom": "^19.3.0",
|
|
79
75
|
"@vitest/coverage-v8": "^5.0.5",
|
|
80
|
-
"eslint": "^10.13.0",
|
|
81
|
-
"eslint-config-prettier": "^10.1.8",
|
|
82
|
-
"globals": "^17.13.0",
|
|
83
76
|
"jsdom": "^30.1.3",
|
|
84
|
-
"prettier": "^3.9.10",
|
|
85
77
|
"publint": "^0.3.25",
|
|
86
|
-
"react": "^19.3.
|
|
87
|
-
"react-dom": "^19.3.
|
|
78
|
+
"react": "^19.3.1",
|
|
79
|
+
"react-dom": "^19.3.1",
|
|
88
80
|
"rimraf": "^6.1.3",
|
|
89
81
|
"typescript": "^6.0.3",
|
|
90
|
-
"
|
|
91
|
-
"vitest": "^5.0.0"
|
|
82
|
+
"vitest": "^5.0.5"
|
|
92
83
|
},
|
|
93
84
|
"engines": {
|
|
94
85
|
"node": ">=22"
|