@dxos/react-ui-gameboard 0.8.4-main.c4373fc → 0.8.4-main.c85a9c8dae

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@dxos/react-ui-gameboard",
-  "version": "0.8.4-main.c4373fc",
+  "version": "0.8.4-main.c85a9c8dae",
   "description": "Game board.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dxos/dxos"
+  },
   "license": "MIT",
   "author": "DXOS.org",
   "type": "module",
@@ -24,37 +28,36 @@
     "src"
   ],
   "dependencies": {
-    "@atlaskit/pragmatic-drag-and-drop": "^1.4.0",
-    "@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.3",
-    "@preact-signals/safe-react": "^0.9.0",
-    "@preact/signals-core": "^1.12.1",
+    "@atlaskit/pragmatic-drag-and-drop": "1.7.7",
+    "@atlaskit/pragmatic-drag-and-drop-hitbox": "1.1.0",
+    "@effect-atom/atom-react": "^0.5.0",
     "@radix-ui/react-context": "1.1.1",
-    "chess.js": "^1.4.0",
+    "chess.js": "^1.0.0",
     "react-resize-detector": "^11.0.1",
-    "@dxos/debug": "0.8.4-main.c4373fc",
-    "@dxos/invariant": "0.8.4-main.c4373fc",
-    "@dxos/log": "0.8.4-main.c4373fc",
-    "@dxos/node-std": "0.8.4-main.c4373fc",
-    "@dxos/util": "0.8.4-main.c4373fc"
+    "@dxos/debug": "0.8.4-main.c85a9c8dae",
+    "@dxos/invariant": "0.8.4-main.c85a9c8dae",
+    "@dxos/node-std": "0.8.4-main.c85a9c8dae",
+    "@dxos/util": "0.8.4-main.c85a9c8dae",
+    "@dxos/log": "0.8.4-main.c85a9c8dae"
   },
   "devDependencies": {
     "@svgr/cli": "^8.1.0",
     "@types/lodash.defaultsdeep": "^4.6.6",
-    "@types/react": "~19.2.2",
-    "@types/react-dom": "~19.2.1",
+    "@types/react": "~19.2.7",
+    "@types/react-dom": "~19.2.3",
     "lodash.defaultsdeep": "^4.6.1",
-    "react": "~19.2.0",
-    "react-dom": "~19.2.0",
-    "vite": "7.1.9",
-    "@dxos/react-ui-theme": "0.8.4-main.c4373fc",
-    "@dxos/react-ui": "0.8.4-main.c4373fc",
-    "@dxos/storybook-utils": "0.8.4-main.c4373fc"
+    "react": "~19.2.3",
+    "react-dom": "~19.2.3",
+    "vite": "^7.1.11",
+    "@dxos/storybook-utils": "0.8.4-main.c85a9c8dae",
+    "@dxos/react-ui": "0.8.4-main.c85a9c8dae",
+    "@dxos/ui-theme": "0.8.4-main.c85a9c8dae"
   },
   "peerDependencies": {
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
-    "@dxos/react-ui": "0.8.4-main.c4373fc",
-    "@dxos/react-ui-theme": "0.8.4-main.c4373fc"
+    "react": "~19.2.3",
+    "react-dom": "~19.2.3",
+    "@dxos/react-ui": "0.8.4-main.c85a9c8dae",
+    "@dxos/ui-theme": "0.8.4-main.c85a9c8dae"
   },
   "publishConfig": {
     "access": "public"

package/src/components/Chessboard/Chessboard.stories.tsx

@@ -2,11 +2,13 @@
 // Copyright 2024 DXOS.org
 //
 
+import { RegistryContext } from '@effect-atom/atom-react';
 import { type Meta, type StoryObj } from '@storybook/react-vite';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 
 import { Button, Toolbar } from '@dxos/react-ui';
-import { withTheme } from '@dxos/react-ui/testing';
+import { withLayout, withTheme } from '@dxos/react-ui/testing';
+import { withRegistry } from '@dxos/storybook-utils';
 
 import { Gameboard, type GameboardRootProps, type Move, type Player } from '../Gameboard';
 
@@ -18,7 +20,8 @@ type DefaultStoryProps = Pick<ChessboardProps, 'orientation' | 'showLabels' | 'd
 };
 
 const DefaultStory = ({ orientation: _orientation, pgn, ...props }: DefaultStoryProps) => {
-  const model = useMemo(() => new ChessModel(pgn), [pgn]);
+  const registry = useContext(RegistryContext);
+  const model = useMemo(() => new ChessModel(registry, pgn), [registry, pgn]);
   const [orientation, setOrientation] = useState<Player | undefined>(_orientation);
 
   const handleDrop = useCallback<NonNullable<GameboardRootProps<ChessModel>['onDrop']>>(
@@ -52,7 +55,8 @@ const DefaultStory = ({ orientation: _orientation, pgn, ...props }: DefaultStory
 };
 
 const GridStory = () => {
-  const models = useMemo(() => Array.from({ length: 9 }).map(() => new ChessModel()), []);
+  const registry = useContext(RegistryContext);
+  const models = useMemo(() => Array.from({ length: 9 }).map(() => new ChessModel(registry)), [registry]);
   useEffect(() => {
     const i = setInterval(() => {
       const model = models[Math.floor(Math.random() * models.length)];
@@ -80,10 +84,7 @@ const meta = {
   title: 'ui/react-ui-gameboard/Chessboard',
   component: Chessboard,
   render: DefaultStory,
-  decorators: [withTheme],
-  parameters: {
-    layout: 'column',
-  },
+  decorators: [withRegistry, withTheme(), withLayout({ layout: 'column' })],
 } satisfies Meta<typeof Chessboard>;
 
 export default meta;

package/src/components/Chessboard/Chessboard.tsx

@@ -2,17 +2,19 @@
 // Copyright 2025 DXOS.org
 //
 
+import { Atom, useAtomValue } from '@effect-atom/atom-react';
 import React, { type PropsWithChildren, forwardRef, memo, useEffect, useMemo, useRef, useState } from 'react';
 import { useResizeDetector } from 'react-resize-detector';
 
 import { type ThemedClassName, useForwardedRef } from '@dxos/react-ui';
-import { mx } from '@dxos/react-ui-theme';
-import { isTruthy } from '@dxos/util';
+import { mx } from '@dxos/ui-theme';
+import { isNonNullable } from '@dxos/util';
 
 import {
   type DOMRectBounds,
   Gameboard,
   type Location,
+  type PieceMap,
   type PieceRecord,
   type Player,
   getRelativeBounds,
@@ -22,6 +24,14 @@ import {
 
 import { type ChessModel, type ChessPiece, ChessPieces, boardStyles, getSquareColor, locationToPos } from './chess';
 
+/** Fallback atom for when model is undefined. */
+const EMPTY_PIECES_ATOM = Atom.make<PieceMap<ChessPiece>>({});
+
+/**
+ * Chessboard layout.
+ */
+const CHESSBOARD_NAME = 'Chessboard';
+
 export type ChessboardProps = ThemedClassName<
   PropsWithChildren<{
     orientation?: Player;
@@ -32,14 +42,12 @@ export type ChessboardProps = ThemedClassName<
   }>
 >;
 
-/**
- * Chessboard layout.
- */
 const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
   ({ classNames, orientation, showLabels, debug, rows = 8, cols = 8 }, forwardedRef) => {
     const targetRef = useForwardedRef(forwardedRef);
     const { width, height } = useResizeDetector({ targetRef, refreshRate: 200 });
-    const { model, promoting, onPromotion } = useGameboardContext<ChessModel>(Chessboard.displayName!);
+    const { model, promoting, onPromotion } = useGameboardContext<ChessModel>(CHESSBOARD_NAME);
+    const pieces = useAtomValue(model?.pieces ?? EMPTY_PIECES_ATOM);
 
     // Board squares.
     const squares = useMemo<Location[]>(() => {
@@ -55,7 +63,7 @@ const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
           <div
             key={locationToString(location)}
             {...{
-              ['data-location' as const]: locationToString(location),
+              'data-location': locationToString(location),
             }}
           />
         );
@@ -84,7 +92,7 @@ const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
         return [];
       }
 
-      return Object.values(model?.pieces.value ?? {})
+      return Object.values(pieces)
         .map((piece) => {
           if (piece.id === promoting?.id) {
             return null;
@@ -93,11 +101,11 @@ const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
           const bounds = grid[locationToString(piece.location)];
           return { piece, bounds };
         })
-        .filter(isTruthy);
-    }, [grid, model?.pieces.value, promoting]);
+        .filter(isNonNullable);
+    }, [grid, pieces, promoting]);
 
     return (
-      <div ref={targetRef} tabIndex={0} className={mx('relative outline-none', classNames)}>
+      <div ref={targetRef} tabIndex={0} className={mx('relative outline-hidden', classNames)}>
         {/* DOM Layout. */}
         <div ref={gridRef} className='grid grid-rows-8 grid-cols-8 aspect-square select-none'>
           {layout}
@@ -134,7 +142,7 @@ const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
             piece={promoting}
             onSelect={(piece) => {
               onPromotion({
-                from: Object.values(model.pieces.value).find((p) => p.id === promoting.id)!.location,
+                from: Object.values(pieces).find((p) => p.id === promoting.id)!.location,
                 to: piece.location,
                 piece: promoting.type,
                 promotion: piece.type,
@@ -147,7 +155,7 @@ const ChessboardComponent = forwardRef<HTMLDivElement, ChessboardProps>(
   },
 );
 
-ChessboardComponent.displayName = 'Chessboard';
+ChessboardComponent.displayName = CHESSBOARD_NAME;
 
 export const Chessboard = memo(ChessboardComponent);
 

package/src/components/Chessboard/chess.ts

@@ -2,7 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { type ReadonlySignal, signal } from '@preact/signals-core';
+import { Atom, type Registry } from '@effect-atom/atom-react';
 import { Chess as ChessJS } from 'chess.js';
 import { type FC, type SVGProps } from 'react';
 
@@ -85,15 +85,18 @@ export const createChess = (pgn?: string): ChessJS => {
  */
 export class ChessModel implements GameboardModel<ChessPiece> {
   private readonly _chess = new ChessJS();
-  private readonly _pieces = signal<PieceMap<ChessPiece>>({});
-  private readonly _moveIndex = signal(0);
+  private readonly _pieces = Atom.make<PieceMap<ChessPiece>>({});
+  private readonly _moveIndex = Atom.make(0);
 
-  constructor(pgn?: string) {
+  constructor(
+    private readonly _registry: Registry.Registry,
+    pgn?: string,
+  ) {
     this.update(pgn);
   }
 
   get readonly(): boolean {
-    return this._moveIndex.value !== this._chess.history().length;
+    return this._registry.get(this._moveIndex) !== this._chess.history().length;
   }
 
   get turn(): Player {
@@ -104,11 +107,11 @@ export class ChessModel implements GameboardModel<ChessPiece> {
     return this._chess;
   }
 
-  get pieces(): ReadonlySignal<PieceMap<ChessPiece>> {
+  get pieces(): Atom.Atom<PieceMap<ChessPiece>> {
     return this._pieces;
   }
 
-  get moveIndex(): ReadonlySignal<number> {
+  get moveIndex(): Atom.Atom<number> {
     return this._moveIndex;
   }
 
@@ -158,7 +161,7 @@ export class ChessModel implements GameboardModel<ChessPiece> {
 
     const current = this._chess.history();
     if (!isValidNextMove(previous, current)) {
-      this._pieces.value = {};
+      this._registry.set(this._pieces, {});
     }
 
     this._updateBoard(this._chess);
@@ -201,8 +204,8 @@ export class ChessModel implements GameboardModel<ChessPiece> {
    * Update pieces preserving identity.
    */
   private _updateBoard(chess: ChessJS): void {
-    this._pieces.value = createPieceMap(chess);
-    this._moveIndex.value = chess.history().length;
+    this._registry.set(this._pieces, createPieceMap(chess));
+    this._registry.set(this._moveIndex, chess.history().length);
   }
 }
 

package/src/components/Gameboard/Gameboard.tsx

@@ -8,13 +8,13 @@ import React, { type PropsWithChildren, forwardRef, useCallback, useEffect, useS
 
 import { log } from '@dxos/log';
 import { type ThemedClassName } from '@dxos/react-ui';
-import { mx } from '@dxos/react-ui-theme';
+import { mx } from '@dxos/ui-theme';
 
 import { Piece, type PieceProps } from './Piece';
 import { Square, type SquareProps } from './Square';
 import { type GameboardModel, type Move, type PieceRecord, isLocation, isPiece } from './types';
 
-export type GameboardContextValue<M extends GameboardModel> = {
+export type GameboardContextValue<M extends GameboardModel<any>> = {
   model: M;
   dragging?: boolean; // TODO(burdon): Change to PieceRecord.
   promoting?: PieceRecord;
@@ -23,7 +23,7 @@ export type GameboardContextValue<M extends GameboardModel> = {
 
 const [GameboardContextProvider, useRadixGameboardContext] = createContext<GameboardContextValue<any>>('Gameboard');
 
-const useGameboardContext = <M extends GameboardModel>(consumerName: string): GameboardContextValue<M> => {
+const useGameboardContext = <M extends GameboardModel<any>>(consumerName: string): GameboardContextValue<M> => {
   return useRadixGameboardContext(consumerName);
 };
 
@@ -31,20 +31,19 @@ const useGameboardContext = <M extends GameboardModel>(consumerName: string): Ga
 // Root
 //
 
-type GameboardRootProps<M extends GameboardModel> = PropsWithChildren<{
+type GameboardRootProps<M extends GameboardModel<any>> = PropsWithChildren<{
   model?: M;
-  moveNumber?: number;
   onDrop?: (move: Move) => boolean;
 }>;
 
 /**
  * Generic board container.
  */
-const GameboardRoot = <M extends GameboardModel>({ children, model, moveNumber, onDrop }: GameboardRootProps<M>) => {
+const GameboardRoot = <M extends GameboardModel<any>>({ children, model, onDrop }: GameboardRootProps<M>) => {
   const [dragging, setDragging] = useState(false);
   const [promoting, setPromoting] = useState<PieceRecord | undefined>();
 
-  const handlePromotion = useCallback<GameboardContextValue<M>['onPromotion']>((move) => {
+  const handlePromotion = useCallback<GameboardContextValue<GameboardModel<any>>['onPromotion']>((move) => {
     log('onPromotion', { move });
     setPromoting(undefined);
     onDrop?.(move);
@@ -108,10 +107,10 @@ const GameboardContent = forwardRef<HTMLDivElement, GameboardContentProps>(
     return (
       <div
         role='none'
-        className={mx(grow && 'grid is-full bs-full size-container place-content-center', classNames)}
+        className={mx(grow && 'grid w-full h-full dx-size-container place-content-center', classNames)}
         ref={forwardedRef}
       >
-        {contain ? <div className='is-[min(100cqw,100cqh)] bs-[min(100cqw,100cqh)]'>{children}</div> : children}
+        {contain ? <div className='w-[min(100cqw,100cqh)] h-[min(100cqw,100cqh)]'>{children}</div> : children}
       </div>
     );
   },

package/src/components/Gameboard/Piece.tsx

@@ -11,7 +11,7 @@ import { createPortal } from 'react-dom';
 import { invariant } from '@dxos/invariant';
 import { log } from '@dxos/log';
 import { type ThemedClassName, useDynamicRef } from '@dxos/react-ui';
-import { mx } from '@dxos/react-ui-theme';
+import { mx } from '@dxos/ui-theme';
 
 import { useGameboardContext } from './Gameboard';
 import { type Location, type PieceRecord, type Player, isEqualLocation, isLocation } from './types';
@@ -26,8 +26,10 @@ export type PieceProps = ThemedClassName<{
   onClick?: () => void;
 }>;
 
+const PIECE_NAME = 'Piece';
+
 export const Piece = memo(({ classNames, Component, piece, bounds, label, onClick }: PieceProps) => {
-  const { model, dragging: isDragging, promoting } = useGameboardContext(Piece.displayName!);
+  const { model, dragging: isDragging, promoting } = useGameboardContext(PIECE_NAME);
   const promotingRef = useDynamicRef(promoting);
   const [dragging, setDragging] = useState(false);
   const [preview, setPreview] = useState<HTMLElement>();
@@ -134,4 +136,4 @@ export const Piece = memo(({ classNames, Component, piece, bounds, label, onClic
   );
 });
 
-Piece.displayName = 'Piece';
+Piece.displayName = PIECE_NAME;

package/src/components/Gameboard/Square.tsx

@@ -8,7 +8,7 @@ import React, { memo, useEffect, useRef, useState } from 'react';
 import { invariant } from '@dxos/invariant';
 import { log } from '@dxos/log';
 import { type ThemedClassName } from '@dxos/react-ui';
-import { mx } from '@dxos/react-ui-theme';
+import { mx } from '@dxos/ui-theme';
 
 import { useGameboardContext } from './Gameboard';
 import { type Location, isPiece } from './types';
@@ -22,10 +22,12 @@ export type SquareProps = ThemedClassName<{
   label?: string;
 }>;
 
+const SQUARE_NAME = 'Square';
+
 export const Square = memo(({ location, bounds, label, classNames }: SquareProps) => {
   const ref = useRef<HTMLDivElement>(null);
   const [state, setState] = useState<HoveredState>('idle');
-  const { model } = useGameboardContext(Square.displayName!);
+  const { model } = useGameboardContext(SQUARE_NAME);
 
   useEffect(() => {
     const el = ref.current;
@@ -71,4 +73,4 @@ export const Square = memo(({ location, bounds, label, classNames }: SquareProps
   );
 });
 
-Square.displayName = 'Square';
+Square.displayName = SQUARE_NAME;

package/src/components/Gameboard/types.ts

@@ -2,7 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { type ReadonlySignal } from '@preact/signals-core';
+import { type Atom } from '@effect-atom/atom-react';
 
 // TODO(burdon): Don't make this assumption.
 export type Player = 'black' | 'white';
@@ -54,8 +54,7 @@ export const isEqualLocation = (l1: Location, l2: Location): boolean => l1[0] ==
 export interface GameboardModel<T extends PieceType = PieceType> {
   readonly: boolean;
   turn: Player;
-  /** @reactive */
-  pieces: ReadonlySignal<PieceMap<T>>;
+  pieces: Atom.Atom<PieceMap<T>>;
   isValidMove: (move: Move) => boolean;
   canPromote?: (move: Move) => boolean;
 }

package/src/gen/pieces/chess/alpha/bB.tsx

@@ -1,11 +1,14 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBB = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
-    <path fill='#f9f9f9' d='M732 1290 628 993l386-417 421 375-132 380 49 152-658-9z' />
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#101010'
-      d='M768 1365q-5 39-26 82h564q-18-36-26-82zm495-73 46-73q-142-49-285-47-144-2-285 47l46 73q118-40 239-38 120-2 239 38m-432 227H624q67-116 72-229-114-119-162-223t-6-224q33-96 118-189t312-247q-17-11-46-36t-29-79q0-58 41-96t100-38q58 0 100 38t41 96q0 54-29 79t-46 36q226 153 311 247t119 189q42 119-6 224t-162 223q4 113 72 229h-207l10 16q33 53 70 60t89 7h250q76 0 142 62t65 179h-495q-123 0-223-84t-101-199q0 114-101 199t-223 84H205q0-117 65-179t142-62h250q51 0 88-7t71-60zm146-701h-95v89h95v165h94V907h95v-89h-95V714h-94z'
+      fill="#f9f9f9"
+      d="M732 1290 628 993l386-417 421 375-132 380 49 152-658-9z"
+    />
+    <path
+      fill="#101010"
+      d="M768 1365q-5 39-26 82h564q-18-36-26-82zm495-73 46-73q-142-49-285-47-144-2-285 47l46 73q118-40 239-38 120-2 239 38m-432 227H624q67-116 72-229-114-119-162-223t-6-224q33-96 118-189t312-247q-17-11-46-36t-29-79q0-58 41-96t100-38q58 0 100 38t41 96q0 54-29 79t-46 36q226 153 311 247t119 189q42 119-6 224t-162 223q4 113 72 229h-207l10 16q33 53 70 60t89 7h250q76 0 142 62t65 179h-495q-123 0-223-84t-101-199q0 114-101 199t-223 84H205q0-117 65-179t142-62h250q51 0 88-7t71-60zm146-701h-95v89h95v165h94V907h95v-89h-95V714h-94z"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/bK.tsx

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBK = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#f9f9f9'
-      d='m553 1485-55 320 1048 5-48-335s324-313 330-467c7-153-35-331-241-406-183-67-372 121-372 121l-182-161-190 160S658 586 587 592a373 373 0 0 0-362 333c10 331 328 560 328 560'
+      fill="#f9f9f9"
+      d="m553 1485-55 320 1048 5-48-335s324-313 330-467c7-153-35-331-241-406-183-67-372 121-372 121l-182-161-190 160S658 586 587 592a373 373 0 0 0-362 333c10 331 328 560 328 560"
     />
     <path
-      fill='#101010'
-      d='M1024 1769h489l-12-73H547l-12 73zm0-921q-25-60-62-111 31-48 62-65 30 17 62 65-38 51-62 111m-97 454q-154 11-303 58-123-108-200-213t-77-202q0-89 74-159t148-70q67 0 135 63t102 130q30 54 75 175t46 218m-350 217-26 156 145-84zm447-907q-47 0-136 121-31-36-50-55 93-140 186-140 92 0 186 140-20 19-50 55-90-121-136-121m0 775q-1-126-42-267t-84-227l-14-27-12-23q-28-43-48-69-51-63-120-105t-134-42q-103 0-208 93T257 949q0 120 99 255t249 259q201-74 419-76m0 456H448l61-365q-325-280-326-535-1-159 125-274t267-116q78 0 159 47t142 119q61 74 99 165t49 150q12-60 49-150t99-165q61-72 142-119t159-47q140 0 266 116t126 274q-2 255-326 535l61 365zm97-541q0-97 45-218t76-175q34-68 102-130t135-63q74 0 148 70t74 159q0 96-77 202t-200 213q-150-47-303-58m350 217-119 72 145 84zm-447-132q217 2 419 76 150-125 249-259t99-255q0-136-105-229t-208-93q-66 0-135 42t-119 105q-21 26-48 69l-12 23-14 27q-44 85-85 227t-41 267m-139 159 139 86 139-84-139-86zm92-1248v-95h94v95h107v95h-107v153q-48-16-94 0V393H870v-95z'
+      fill="#101010"
+      d="M1024 1769h489l-12-73H547l-12 73zm0-921q-25-60-62-111 31-48 62-65 30 17 62 65-38 51-62 111m-97 454q-154 11-303 58-123-108-200-213t-77-202q0-89 74-159t148-70q67 0 135 63t102 130q30 54 75 175t46 218m-350 217-26 156 145-84zm447-907q-47 0-136 121-31-36-50-55 93-140 186-140 92 0 186 140-20 19-50 55-90-121-136-121m0 775q-1-126-42-267t-84-227l-14-27-12-23q-28-43-48-69-51-63-120-105t-134-42q-103 0-208 93T257 949q0 120 99 255t249 259q201-74 419-76m0 456H448l61-365q-325-280-326-535-1-159 125-274t267-116q78 0 159 47t142 119q61 74 99 165t49 150q12-60 49-150t99-165q61-72 142-119t159-47q140 0 266 116t126 274q-2 255-326 535l61 365zm97-541q0-97 45-218t76-175q34-68 102-130t135-63q74 0 148 70t74 159q0 96-77 202t-200 213q-150-47-303-58m350 217-119 72 145 84zm-447-132q217 2 419 76 150-125 249-259t99-255q0-136-105-229t-208-93q-66 0-135 42t-119 105q-21 26-48 69l-12 23-14 27q-44 85-85 227t-41 267m-139 159 139 86 139-84-139-86zm92-1248v-95h94v95h107v95h-107v153q-48-16-94 0V393H870v-95z"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/bN.tsx

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBN = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#f9f9f9'
-      d='M1658 1806c-408-301-71-920-452-1343l60-16s296 167 320 257c182 468 41 691 135 1077zM972 523l120 176-312-3zM498 981l-93-41 42-93 127 28z'
+      fill="#f9f9f9"
+      d="M1658 1806c-408-301-71-920-452-1343l60-16s296 167 320 257c182 468 41 691 135 1077zM972 523l120 176-312-3zM498 981l-93-41 42-93 127 28z"
     />
     <path
-      fill='#101010'
-      d='m502 868-52 1-26 64 69 21 46-55zm536-187q34 1-16-68t-80-42L826 680zm-338-98q6-39 116-107t220-144l115-154 96 217q342 172 433 418t47 603q-18 128 5 236t57 190l-1242 1q-9-178 39-301t183-238q50-11 83-39t53-59l63-1 138-29 139-97 66-207q0-17-8-34t-12-37q-62 228-161 289t-191 58q-236-42-292 60l-56 102-217-121 115-82-51-50-122 86-12-297zm981 1192q-102-130-85-308t27-363-50-351-316-276q220 164 253 342t16 351-12 329 167 276'
+      fill="#101010"
+      d="m502 868-52 1-26 64 69 21 46-55zm536-187q34 1-16-68t-80-42L826 680zm-338-98q6-39 116-107t220-144l115-154 96 217q342 172 433 418t47 603q-18 128 5 236t57 190l-1242 1q-9-178 39-301t183-238q50-11 83-39t53-59l63-1 138-29 139-97 66-207q0-17-8-34t-12-37q-62 228-161 289t-191 58q-236-42-292 60l-56 102-217-121 115-82-51-50-122 86-12-297zm981 1192q-102-130-85-308t27-363-50-351-316-276q220 164 253 342t16 351-12 329 167 276"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/bP.tsx

@@ -1,10 +1,10 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBP = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#101010'
-      d='M1024 1843H446v-74q-4-80 42-137t125-108q117-91 172-217t78-268H576l284-239q-86-74-86-188 0-103 73-177t177-74q103 0 177 74t73 177q0 114-86 188l284 239h-287q23 141 78 268t172 217q79 51 125 108t42 137v74z'
+      fill="#101010"
+      d="M1024 1843H446v-74q-4-80 42-137t125-108q117-91 172-217t78-268H576l284-239q-86-74-86-188 0-103 73-177t177-74q103 0 177 74t73 177q0 114-86 188l284 239h-287q23 141 78 268t172 217q79 51 125 108t42 137v74z"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/bQ.tsx

@@ -1,11 +1,14 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBQ = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
-    <path fill='#f9f9f9' d='m520 1801.8 41.5-448.7 474-128.9 458 133.5 34.4 446.4z' />
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#101010'
-      d='M590 1519q4 72-15 158l134-86zm434 324H441q114-231 57.5-456.5T296 937q-12 2-19 2-54 0-92.5-38.5T146 808t38.5-92.5T277 677t92.5 38.5T408 808q0 20-6 38-4 14-15 33l196 139 100-486q-64-31-72-103-5-44 29-91t88-53q54-5 96 29t48 88q7 68-46 114l198 412 198-412q-54-46-46-114 6-54 48-88t96-29q54 6 87.5 53t29.5 91q-9 72-72 103l100 486 196-139q-12-19-15-33-6-18-6-38 0-54 38.5-92.5T1771 677t92.5 38.5T1902 808t-38.5 92.5T1771 939q-7 0-19-2-147 224-203 449.5t58 456.5zm0-450q109 0 222 28.5t213 67.5q2-41 11-89-108-42-221.5-68t-224.5-26-225 26-221 68q8 48 11 89 99-39 212-67.5t223-28.5m0 376h478q-15-34-24-73H570q-10 39-24 73zm434-250-119 72 134 86q-20-86-15-158m-573 47 139 87 139-84-139-86z'
+      fill="#f9f9f9"
+      d="m520 1801.8 41.5-448.7 474-128.9 458 133.5 34.4 446.4z"
+    />
+    <path
+      fill="#101010"
+      d="M590 1519q4 72-15 158l134-86zm434 324H441q114-231 57.5-456.5T296 937q-12 2-19 2-54 0-92.5-38.5T146 808t38.5-92.5T277 677t92.5 38.5T408 808q0 20-6 38-4 14-15 33l196 139 100-486q-64-31-72-103-5-44 29-91t88-53q54-5 96 29t48 88q7 68-46 114l198 412 198-412q-54-46-46-114 6-54 48-88t96-29q54 6 87.5 53t29.5 91q-9 72-72 103l100 486 196-139q-12-19-15-33-6-18-6-38 0-54 38.5-92.5T1771 677t92.5 38.5T1902 808t-38.5 92.5T1771 939q-7 0-19-2-147 224-203 449.5t58 456.5zm0-450q109 0 222 28.5t213 67.5q2-41 11-89-108-42-221.5-68t-224.5-26-225 26-221 68q8 48 11 89 99-39 212-67.5t223-28.5m0 376h478q-15-34-24-73H570q-10 39-24 73zm434-250-119 72 134 86q-20-86-15-158m-573 47 139 87 139-84-139-86z"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/bR.tsx

@@ -1,11 +1,11 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgBR = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
-    <path fill='#f9f9f9' d='m674 732-76 807 851 14-75-833z' />
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
+    <path fill="#f9f9f9" d="m674 732-76 807 851 14-75-833z" />
     <path
-      fill='#101010'
-      d='M1024 1843H383l29-264 159-118 50-659-149-107-17-341h289v147h137V354h286v147h137V354h289l-17 341-149 107 50 659 159 118 29 264zm0-989h333l-6-88H697l-6 88zm0 647h381l-6-87H649l-6 87z'
+      fill="#101010"
+      d="M1024 1843H383l29-264 159-118 50-659-149-107-17-341h289v147h137V354h286v147h137V354h289l-17 341-149 107 50 659 159 118 29 264zm0-989h333l-6-88H697l-6 88zm0 647h381l-6-87H649l-6 87z"
     />
   </svg>
 );

package/src/gen/pieces/chess/alpha/index.ts

@@ -1,12 +1,12 @@
-export { default as BB } from './bB';
-export { default as BK } from './bK';
-export { default as BN } from './bN';
-export { default as BP } from './bP';
-export { default as BQ } from './bQ';
-export { default as BR } from './bR';
-export { default as WB } from './wB';
-export { default as WK } from './wK';
-export { default as WN } from './wN';
-export { default as WP } from './wP';
-export { default as WQ } from './wQ';
-export { default as WR } from './wR';
+export { default as BB } from "./bB";
+export { default as BK } from "./bK";
+export { default as BN } from "./bN";
+export { default as BP } from "./bP";
+export { default as BQ } from "./bQ";
+export { default as BR } from "./bR";
+export { default as WB } from "./wB";
+export { default as WK } from "./wK";
+export { default as WN } from "./wN";
+export { default as WP } from "./wP";
+export { default as WQ } from "./wQ";
+export { default as WR } from "./wR";

package/src/gen/pieces/chess/alpha/wB.tsx

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import type { SVGProps } from 'react';
+import * as React from "react";
+import type { SVGProps } from "react";
 const SvgWB = (props: SVGProps<SVGSVGElement>) => (
-  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2048 2048' {...props}>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2048 2048" {...props}>
     <path
-      fill='#f9f9f9'
-      d='m948 366 1-139 148-7 1 147zM564 860c114-267 456-443 456-443s392 176 476 502c-9 209-183 332-183 332l27 221-653 6 46-233s-230-171-169-385m-101 790c175 6 355 23 425-142h92s0 190-88 246c-163 103-625 38-625 38s-15-146 196-142m631 37-36-185 102 5s22 153 315 131c381-17 318 153 318 153l-483 5z'
+      fill="#f9f9f9"
+      d="m948 366 1-139 148-7 1 147zM564 860c114-267 456-443 456-443s392 176 476 502c-9 209-183 332-183 332l27 221-653 6 46-233s-230-171-169-385m-101 790c175 6 355 23 425-142h92s0 190-88 246c-163 103-625 38-625 38s-15-146 196-142m631 37-36-185 102 5s22 153 315 131c381-17 318 153 318 153l-483 5z"
     />
     <path
-      fill='#101010'
-      d='M1024 356q66 0 64-66 1-55-64-55-66 0-64 55-3 66 64 66m0 1204q0 114-101 199t-223 84H205q0-117 65-179t142-62h250q51 0 88-7t71-60l10-16h76q-7 21-3 13-45 105-109 125t-146 19H409q-52 0-86 40t-34 53h424q66 0 159-65t93-185H624q67-116 72-229-114-119-162-223t-6-224q33-96 118-189t312-247q-17-11-46-36t-29-79q0-58 41-96t100-38q58 0 100 38t41 96q0 54-29 79t-46 36q226 153 311 247t119 189q42 119-6 224t-162 223q4 113 72 229h-341q0 120 93 185t159 65h424q0-13-34-53t-86-40h-240q-83 0-146-19t-109-125q4 8-3-13h76l10 16q33 53 70 60t89 7h250q76 0 142 62t65 179h-495q-123 0-223-84t-101-199m0-114h283q-28-84-29-154-120-41-254-38-135-3-254 38-2 70-29 154zm0-267q159-1 285 42 189-180 142-346-60-193-427-431-368 238-427 431-48 166 142 346 125-43 285-42m-47-361V714h94v104h95v89h-95v165h-94V907h-95v-89z'
+      fill="#101010"
+      d="M1024 356q66 0 64-66 1-55-64-55-66 0-64 55-3 66 64 66m0 1204q0 114-101 199t-223 84H205q0-117 65-179t142-62h250q51 0 88-7t71-60l10-16h76q-7 21-3 13-45 105-109 125t-146 19H409q-52 0-86 40t-34 53h424q66 0 159-65t93-185H624q67-116 72-229-114-119-162-223t-6-224q33-96 118-189t312-247q-17-11-46-36t-29-79q0-58 41-96t100-38q58 0 100 38t41 96q0 54-29 79t-46 36q226 153 311 247t119 189q42 119-6 224t-162 223q4 113 72 229h-341q0 120 93 185t159 65h424q0-13-34-53t-86-40h-240q-83 0-146-19t-109-125q4 8-3-13h76l10 16q33 53 70 60t89 7h250q76 0 142 62t65 179h-495q-123 0-223-84t-101-199m0-114h283q-28-84-29-154-120-41-254-38-135-3-254 38-2 70-29 154zm0-267q159-1 285 42 189-180 142-346-60-193-427-431-368 238-427 431-48 166 142 346 125-43 285-42m-47-361V714h94v104h95v89h-95v165h-94V907h-95v-89z"
     />
   </svg>
 );