@mirasen/chessboard 0.1.0

package/dist/extensions/first-party/main-renderer/coordinates/types.d.ts

@@ -0,0 +1,8 @@
+import { ExtensionRenderContext } from '../../../types/context/render';
+import { ConfigColorPair } from '../types/internal';
+export interface MainRendererCoordinatesInternal {
+    readonly config: ConfigColorPair;
+}
+export interface MainRendererCoordinates {
+    render(context: ExtensionRenderContext, layer: SVGElement): void;
+}

package/dist/extensions/first-party/main-renderer/coordinates/types.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/main-renderer/drag/factory.d.ts

@@ -0,0 +1,4 @@
+import { ExtensionRuntimeSurface } from '../../../types/surface/main';
+import { PieceUrls } from '../types/internal';
+import { MainRendererDrag } from './types';
+export declare function createMainRendererDrag(config: PieceUrls, runtimeSurface: ExtensionRuntimeSurface): MainRendererDrag;

package/dist/extensions/first-party/main-renderer/drag/factory.js

@@ -0,0 +1,23 @@
+import { rendererDragRenderTransientVisuals } from './render';
+import { rendererDragOnUpdate } from './update';
+function createMainRendererDragInternal(config, runtimeSurface) {
+    return { config, runtimeSurface, isDragActive: false, pieceUrl: null, pieceNode: null };
+}
+export function createMainRendererDrag(config, runtimeSurface) {
+    const internalState = createMainRendererDragInternal(config, runtimeSurface);
+    return {
+        onUpdate(context) {
+            rendererDragOnUpdate(internalState, context);
+        },
+        renderTransientVisuals(context, layer) {
+            rendererDragRenderTransientVisuals(internalState, context, layer);
+        },
+        unmount() {
+            internalState.pieceNode?.remove();
+            internalState.pieceNode = null;
+            internalState.pieceUrl = null;
+            internalState.isDragActive = false;
+            internalState.runtimeSurface.transientVisuals.unsubscribe();
+        }
+    };
+}

package/dist/extensions/first-party/main-renderer/drag/render.d.ts

@@ -0,0 +1,3 @@
+import { ExtensionRenderTransientVisualsContext } from '../../../types/context/transient-visuals';
+import { MainRendererDragInternal } from './types';
+export declare function rendererDragRenderTransientVisuals(state: MainRendererDragInternal, context: ExtensionRenderTransientVisualsContext, layer: SVGElement): void;

package/dist/extensions/first-party/main-renderer/drag/render.js

@@ -0,0 +1,27 @@
+import { createSvgElement, updateElementAttributes } from '../../../../render/svg/helpers';
+export function rendererDragRenderTransientVisuals(state, context, layer) {
+    const geometry = context.currentFrame.layout.geometry;
+    const point = context.transientInput.clampedPoint;
+    const squareSize = geometry.squareSize.toString();
+    const x = (point.x - geometry.squareSize / 2).toString();
+    const y = (point.y - geometry.squareSize / 2).toString();
+    if (state.isDragActive && state.pieceUrl && !state.pieceNode) {
+        // Ok this is first render pass, let's create the piece node
+        state.pieceNode = createSvgElement(layer, 'image', {
+            'data-chessboard-id': 'dragged-piece',
+            width: squareSize,
+            height: squareSize,
+            x,
+            y,
+            href: state.pieceUrl
+        });
+    }
+    else if (state.isDragActive && state.pieceNode) {
+        updateElementAttributes(state.pieceNode, {
+            width: squareSize,
+            height: squareSize,
+            x,
+            y
+        });
+    }
+}

package/dist/extensions/first-party/main-renderer/drag/types.d.ts

@@ -0,0 +1,16 @@
+import { ExtensionRenderTransientVisualsContext } from '../../../types/context/transient-visuals';
+import { ExtensionUpdateContext } from '../../../types/context/update';
+import { ExtensionRuntimeSurface } from '../../../types/surface/main';
+import { PieceUrls } from '../types/internal';
+export interface MainRendererDragInternal {
+    readonly config: PieceUrls;
+    readonly runtimeSurface: ExtensionRuntimeSurface;
+    isDragActive: boolean;
+    pieceUrl: string | null;
+    pieceNode: SVGImageElement | null;
+}
+export interface MainRendererDrag {
+    onUpdate(context: ExtensionUpdateContext): void;
+    renderTransientVisuals(context: ExtensionRenderTransientVisualsContext, layer: SVGElement): void;
+    unmount(): void;
+}

package/dist/extensions/first-party/main-renderer/drag/types.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/main-renderer/drag/update.d.ts

@@ -0,0 +1,3 @@
+import { ExtensionUpdateContext } from '../../../types/context/update';
+import { MainRendererDragInternal } from './types';
+export declare function rendererDragOnUpdate(state: MainRendererDragInternal, context: ExtensionUpdateContext): void;

package/dist/extensions/first-party/main-renderer/drag/update.js

@@ -0,0 +1,23 @@
+import assert from '@ktarmyshov/assert';
+import { isNonEmptyPieceCode } from '../../../../state/board/check';
+export function rendererDragOnUpdate(state, context) {
+    const isLiftedDragActive = context.currentFrame.state.interaction.dragSession?.type === 'lifted-piece-drag';
+    if (isLiftedDragActive) {
+        if (!state.isDragActive) {
+            const pieceCode = context.currentFrame.state.interaction.dragSession.sourcePieceCode;
+            assert(isNonEmptyPieceCode(pieceCode), 'Invalid piece code in drag session');
+            state.pieceUrl = state.config[pieceCode];
+            state.runtimeSurface.transientVisuals.subscribe();
+        }
+        state.isDragActive = true;
+    }
+    else {
+        if (state.isDragActive) {
+            state.runtimeSurface.transientVisuals.unsubscribe();
+            state.pieceNode?.remove();
+            state.pieceNode = null;
+            state.pieceUrl = null;
+        }
+        state.isDragActive = false;
+    }
+}

package/dist/extensions/first-party/main-renderer/factory.d.ts

@@ -0,0 +1,2 @@
+import { MainRendererDefinition, MainRendererInitOptions } from './types/extension';
+export declare function createMainRenderer(options?: MainRendererInitOptions): MainRendererDefinition;

package/dist/extensions/first-party/main-renderer/factory.js

@@ -0,0 +1,95 @@
+import { toMerged } from 'es-toolkit';
+import { extensionCreateInternalBase, extensionDestroy, extensionMount, extensionUnmount } from '../common/helpers';
+import { createMainRendererAnimation } from './animation/factory';
+import { createMainRendererBoard } from './board/factory';
+import { createMainRendererCoordinates } from './coordinates/factory';
+import { createMainRendererDrag } from './drag/factory';
+import { normalizeMainRendererConfig } from './normalize';
+import { createMainRendererPieces } from './pieces/factory';
+import { EXTENSION_ID, EXTENSION_SLOTS } from './types/extension';
+import { DEFAULT_MAIN_RENDERER_CONFIG } from './types/internal';
+export function createMainRenderer(options = {}) {
+    const config = toMerged(DEFAULT_MAIN_RENDERER_CONFIG, normalizeMainRendererConfig(options));
+    return {
+        id: EXTENSION_ID,
+        slots: EXTENSION_SLOTS,
+        createInstance(options) {
+            return createMainRendererInstance(options, config);
+        }
+    };
+}
+function createMainRendererInternal(options, config) {
+    const board = createMainRendererBoard(config.colors.board);
+    const coordinates = createMainRendererCoordinates(config.colors.coordinates);
+    const pieces = createMainRendererPieces(config.pieceUrls);
+    const drag = createMainRendererDrag(config.pieceUrls, options.runtimeSurface);
+    const animation = createMainRendererAnimation(config.pieceUrls, options.runtimeSurface);
+    return {
+        ...extensionCreateInternalBase(),
+        board,
+        coordinates,
+        pieces,
+        drag,
+        animation,
+        runtimeSurface: options.runtimeSurface
+    };
+}
+function extensionUnmountLocal(state) {
+    // internalState.board.unmount();
+    // internalState.coordinates.unmount();
+    state.pieces.unmount();
+    state.drag.unmount();
+    state.animation.unmount();
+}
+function validateIsMounted(state) {
+    if (state.slotRoots === null) {
+        throw new Error('Extension instance is not mounted yet');
+    }
+}
+function createMainRendererInstance(options, config) {
+    const internalState = createMainRendererInternal(options, config);
+    return {
+        id: EXTENSION_ID,
+        mount(env) {
+            extensionMount(internalState, env.slotRoots);
+        },
+        onUpdate(context) {
+            internalState.board.onUpdate(context);
+            internalState.animation.onUpdate(context);
+            internalState.pieces.onUpdate(context, internalState.animation.getSuppressedSquares());
+            internalState.drag.onUpdate(context);
+        },
+        render(context) {
+            validateIsMounted(internalState);
+            internalState.board.render(context, internalState.slotRoots.board);
+            internalState.coordinates.render(context, internalState.slotRoots.coordinates);
+            internalState.pieces.render(context, internalState.slotRoots.pieces);
+        },
+        renderTransientVisuals(context) {
+            validateIsMounted(internalState);
+            internalState.drag.renderTransientVisuals(context, internalState.slotRoots.drag);
+        },
+        prepareAnimation(context) {
+            validateIsMounted(internalState);
+            internalState.animation.prepareAnimation(context, internalState.slotRoots.animation);
+        },
+        renderAnimation(context) {
+            validateIsMounted(internalState);
+            internalState.animation.renderAnimation(context);
+        },
+        onAnimationFinished(context) {
+            internalState.pieces.refreshSuppressedSquares(context, internalState.animation.getSuppressedSquares());
+        },
+        cleanAnimation(context) {
+            internalState.animation.cleanAnimation(context);
+        },
+        unmount() {
+            extensionUnmountLocal(internalState);
+            extensionUnmount(internalState);
+        },
+        destroy() {
+            extensionUnmountLocal(internalState);
+            extensionDestroy(internalState);
+        }
+    };
+}

package/dist/extensions/first-party/main-renderer/normalize.d.ts

@@ -0,0 +1,4 @@
+import { MainRendererConfigInput, PieceUrlsInput } from './types/input';
+import { MainRendererConfig, PieceUrls } from './types/internal';
+export declare function normalizePieceUrls(input: PieceUrlsInput): PieceUrls;
+export declare function normalizeMainRendererConfig(input: Partial<MainRendererConfigInput>): MainRendererConfig;

package/dist/extensions/first-party/main-renderer/normalize.js

@@ -0,0 +1,27 @@
+import assert from '@ktarmyshov/assert';
+import { normalizePiece } from '../../../state/board/normalize';
+import { ALL_NON_EMPTY_PIECE_CODES } from '../../../state/board/types/internal';
+import { DEFAULT_MAIN_RENDERER_CONFIG } from './types/internal';
+function assertPieceUrlsComplete(pieceUrls) {
+    for (const pieceCode of ALL_NON_EMPTY_PIECE_CODES) {
+        assert(pieceCode in pieceUrls, `Missing URL for piece code: ${pieceCode}`);
+    }
+}
+export function normalizePieceUrls(input) {
+    const normalized = {};
+    for (const [key, url] of Object.entries(input)) {
+        const pieceCode = normalizePiece(key);
+        assert(pieceCode !== 0 /* PieceCode.Empty */, `Invalid piece string: ${key}`);
+        normalized[pieceCode] = url;
+    }
+    assertPieceUrlsComplete(normalized);
+    return normalized;
+}
+export function normalizeMainRendererConfig(input) {
+    return {
+        colors: input.colors ?? DEFAULT_MAIN_RENDERER_CONFIG.colors,
+        pieceUrls: input.pieceUrls
+            ? normalizePieceUrls(input.pieceUrls)
+            : DEFAULT_MAIN_RENDERER_CONFIG.pieceUrls
+    };
+}

package/dist/extensions/first-party/main-renderer/pieces/factory.d.ts

@@ -0,0 +1,3 @@
+import { PieceUrls } from '../types/internal';
+import { MainRendererPieces } from './types';
+export declare function createMainRendererPieces(config: PieceUrls): MainRendererPieces;

package/dist/extensions/first-party/main-renderer/pieces/factory.js

@@ -0,0 +1,27 @@
+import { rendererPiecesRender } from './render';
+import { rendererPiecesOnUpdate, rendererPiecesRefreshSuppressedSquares } from './update';
+export function createMainRendererPieces(config) {
+    const state = {
+        config,
+        pieceNodes: new Map(),
+        suppressedSquares: new Set()
+    };
+    return {
+        onUpdate(context, animationSuppressedSquares) {
+            rendererPiecesOnUpdate(state, context, animationSuppressedSquares);
+        },
+        refreshSuppressedSquares(context, animationSuppressedSquares) {
+            rendererPiecesRefreshSuppressedSquares(state, context, animationSuppressedSquares);
+        },
+        render(context, layer) {
+            rendererPiecesRender(state, context, layer);
+        },
+        unmount() {
+            for (const nodeRecord of state.pieceNodes.values()) {
+                nodeRecord.root.remove();
+            }
+            state.pieceNodes.clear();
+            state.suppressedSquares = new Set();
+        }
+    };
+}

package/dist/extensions/first-party/main-renderer/pieces/render.d.ts

@@ -0,0 +1,3 @@
+import { ExtensionRenderContext } from '../../../types/context/render';
+import { MainRendererPiecesInternal } from './types';
+export declare function rendererPiecesRender(state: MainRendererPiecesInternal, context: ExtensionRenderContext, layer: SVGElement): void;

package/dist/extensions/first-party/main-renderer/pieces/render.js

@@ -0,0 +1,45 @@
+import { createSvgElement, updateElementAttributes } from '../../../../render/svg/helpers';
+import { isNonEmptyPieceCode } from '../../../../state/board/check';
+import { SQUARE_COUNT } from '../../../../state/board/types/internal';
+import { DirtyLayer } from '../types/extension';
+export function rendererPiecesRender(state, context, layer) {
+    if ((context.invalidation.dirtyLayers & DirtyLayer.Pieces) === 0) {
+        return;
+    }
+    const geometry = context.currentFrame.layout.geometry;
+    const pieces = context.currentFrame.state.board.pieces;
+    for (let sq = 0; sq < SQUARE_COUNT; sq++) {
+        const pieceCode = pieces[sq];
+        const existing = state.pieceNodes.get(sq) || null;
+        const suppressed = state.suppressedSquares.has(sq);
+        if (isNonEmptyPieceCode(pieceCode) && !suppressed) {
+            const url = state.config[pieceCode];
+            const r = geometry.squareRect(sq);
+            if (existing !== null) {
+                updateElementAttributes(existing.root, {
+                    x: r.x.toString(),
+                    y: r.y.toString(),
+                    width: r.size.toString(),
+                    height: r.size.toString(),
+                    href: url
+                });
+            }
+            else {
+                state.pieceNodes.set(sq, {
+                    root: createSvgElement(layer, 'image', {
+                        'data-chessboard-id': `piece-${pieceCode}-${sq}`,
+                        href: url,
+                        x: r.x.toString(),
+                        y: r.y.toString(),
+                        width: r.size.toString(),
+                        height: r.size.toString()
+                    })
+                });
+            }
+        }
+        else if (existing !== null) {
+            layer.removeChild(existing.root);
+            state.pieceNodes.delete(sq);
+        }
+    }
+}

package/dist/extensions/first-party/main-renderer/pieces/suppress.d.ts

@@ -0,0 +1,5 @@
+import { Square } from '../../../../state/board/types/internal';
+import { ExtensionCleanAnimationContext } from '../../../types/context/animation';
+import { ExtensionUpdateContext } from '../../../types/context/update';
+import { MainRendererPiecesInternal } from './types';
+export declare function calculateSuppressedSquares(_state: MainRendererPiecesInternal, context: ExtensionUpdateContext | ExtensionCleanAnimationContext, animationSuppressedSquares: ReadonlySet<Square>): ReadonlySet<Square>;

package/dist/extensions/first-party/main-renderer/pieces/suppress.js

@@ -0,0 +1,9 @@
+export function calculateSuppressedSquares(_state, context, animationSuppressedSquares) {
+    const dragSession = context.currentFrame.state.interaction.dragSession;
+    const dragSquare = dragSession?.type === 'lifted-piece-drag' ? dragSession.sourceSquare : undefined;
+    const result = new Set(animationSuppressedSquares);
+    if (dragSquare !== undefined) {
+        result.add(dragSquare);
+    }
+    return result;
+}

package/dist/extensions/first-party/main-renderer/pieces/types.d.ts

@@ -0,0 +1,20 @@
+import { Square } from '../../../../state/board/types/internal';
+import { ExtensionCleanAnimationContext } from '../../../types/context/animation';
+import { ExtensionRenderContext } from '../../../types/context/render';
+import { ExtensionUpdateContext } from '../../../types/context/update';
+import { PieceUrls } from '../types/internal';
+type PieceNodeRecord = {
+    root: SVGImageElement;
+};
+export interface MainRendererPiecesInternal {
+    readonly config: PieceUrls;
+    readonly pieceNodes: Map<Square, PieceNodeRecord>;
+    suppressedSquares: ReadonlySet<Square>;
+}
+export interface MainRendererPieces {
+    onUpdate(context: ExtensionUpdateContext, animationSuppressedSquares: ReadonlySet<Square>): void;
+    refreshSuppressedSquares(context: ExtensionCleanAnimationContext, animationSuppressedSquares: ReadonlySet<Square>): void;
+    render(context: ExtensionRenderContext, layer: SVGElement): void;
+    unmount(): void;
+}
+export {};

package/dist/extensions/first-party/main-renderer/pieces/types.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/main-renderer/pieces/update.d.ts

@@ -0,0 +1,6 @@
+import { Square } from '../../../../state/board/types/internal';
+import { ExtensionCleanAnimationContext } from '../../../types/context/animation';
+import { ExtensionUpdateContext } from '../../../types/context/update';
+import { MainRendererPiecesInternal } from './types';
+export declare function rendererPiecesOnUpdate(state: MainRendererPiecesInternal, context: ExtensionUpdateContext, animationSuppressedSquares: ReadonlySet<Square>): void;
+export declare function rendererPiecesRefreshSuppressedSquares(state: MainRendererPiecesInternal, context: ExtensionCleanAnimationContext, animationSuppressedSquares: ReadonlySet<Square>): void;

package/dist/extensions/first-party/main-renderer/pieces/update.js

@@ -0,0 +1,31 @@
+import { setsEqual } from '../../../../helpers/util';
+import { piecePositionsEqual } from '../../../../state/board/check';
+import { isUpdateContextRenderable } from '../../../types/context/update';
+import { DirtyLayer } from '../types/extension';
+import { calculateSuppressedSquares } from './suppress';
+export function rendererPiecesOnUpdate(state, context, animationSuppressedSquares) {
+    if (!isUpdateContextRenderable(context) ||
+        !context.mutation.hasMutation({
+            prefixes: ['state.board.', 'state.interaction.'],
+            causes: ['layout.refreshGeometry']
+        })) {
+        return;
+    }
+    const previousSuppressedSquares = state.suppressedSquares;
+    state.suppressedSquares = calculateSuppressedSquares(state, context, animationSuppressedSquares);
+    const needsRender = context.mutation.hasMutation({ causes: ['layout.refreshGeometry'] }) ||
+        !context.previousFrame ||
+        !setsEqual(previousSuppressedSquares, state.suppressedSquares) ||
+        !piecePositionsEqual(context.currentFrame.state.board, context.previousFrame.state.board);
+    if (!needsRender)
+        return;
+    context.invalidation.markDirty(DirtyLayer.Pieces);
+}
+export function rendererPiecesRefreshSuppressedSquares(state, context, animationSuppressedSquares) {
+    const newSuppressedSquares = calculateSuppressedSquares(state, context, animationSuppressedSquares);
+    const needsRender = !setsEqual(state.suppressedSquares, newSuppressedSquares);
+    state.suppressedSquares = newSuppressedSquares;
+    if (needsRender) {
+        context.invalidation.markDirty(DirtyLayer.Pieces);
+    }
+}

package/dist/extensions/first-party/main-renderer/types/extension.d.ts

@@ -0,0 +1,15 @@
+import { ExtensionDefinition, ExtensionInstance } from '../../../types/extension';
+import { MainRendererConfigInput } from './input';
+export type MainRendererInitOptions = Partial<MainRendererConfigInput>;
+export declare const EXTENSION_SLOTS: readonly ["board", "coordinates", "pieces", "animation", "drag"];
+export type ExtensionSlotsType = typeof EXTENSION_SLOTS;
+export declare const EXTENSION_ID: "main-renderer";
+export type MainRendererDefinition = ExtensionDefinition<typeof EXTENSION_ID, typeof EXTENSION_SLOTS, never>;
+export type MainRendererInstance = ExtensionInstance<typeof EXTENSION_ID, typeof EXTENSION_SLOTS, never>;
+export declare enum DirtyLayer {
+    Board = 1,// 1 << 0,
+    Coordinates = 2,// 1 << 1,
+    Pieces = 4,// 1 << 2,
+    Drag = 8,// 1 << 3,
+    All = 15
+}

package/dist/extensions/first-party/main-renderer/types/extension.js

@@ -0,0 +1,10 @@
+export const EXTENSION_SLOTS = ['board', 'coordinates', 'pieces', 'animation', 'drag'];
+export const EXTENSION_ID = 'main-renderer';
+export var DirtyLayer;
+(function (DirtyLayer) {
+    DirtyLayer[DirtyLayer["Board"] = 1] = "Board";
+    DirtyLayer[DirtyLayer["Coordinates"] = 2] = "Coordinates";
+    DirtyLayer[DirtyLayer["Pieces"] = 4] = "Pieces";
+    DirtyLayer[DirtyLayer["Drag"] = 8] = "Drag";
+    DirtyLayer[DirtyLayer["All"] = 15] = "All";
+})(DirtyLayer || (DirtyLayer = {}));

package/dist/extensions/first-party/main-renderer/types/input.d.ts

@@ -0,0 +1,4 @@
+import { PieceString } from '../../../../state/board/types/input';
+import { TMainRendererConfig } from './template';
+export type PieceUrlsInput = Record<PieceString, string>;
+export type MainRendererConfigInput = TMainRendererConfig<PieceUrlsInput>;

package/dist/extensions/first-party/main-renderer/types/input.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/main-renderer/types/instance.d.ts

@@ -0,0 +1,16 @@
+import { ExtensionRuntimeSurface } from '../../../types/surface/main';
+import { ExtensionInternal } from '../../common/types';
+import { MainRendererAnimation } from '../animation/types';
+import { MainRendererBoard } from '../board/types';
+import { MainRendererCoordinates } from '../coordinates/types';
+import { MainRendererDrag } from '../drag/types';
+import { MainRendererPieces } from '../pieces/types';
+import { ExtensionSlotsType } from './extension';
+export interface MainRendererInstanceInternal extends ExtensionInternal<ExtensionSlotsType> {
+    readonly board: MainRendererBoard;
+    readonly coordinates: MainRendererCoordinates;
+    readonly pieces: MainRendererPieces;
+    readonly drag: MainRendererDrag;
+    readonly animation: MainRendererAnimation;
+    readonly runtimeSurface: ExtensionRuntimeSurface;
+}

package/dist/extensions/first-party/main-renderer/types/instance.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/main-renderer/types/internal.d.ts

@@ -0,0 +1,17 @@
+import { NonEmptyPieceCode } from '../../../../state/board/types/internal';
+import { TMainRendererConfig } from './template';
+export interface ConfigColorPair {
+    light: string;
+    dark: string;
+}
+export interface ConfigColors {
+    board: ConfigColorPair;
+    coordinates: ConfigColorPair;
+}
+export type PieceUrls = Record<NonEmptyPieceCode, string>;
+export type MainRendererConfig = TMainRendererConfig<PieceUrls>;
+export declare const CHESSNUT_PIECE_URLS: PieceUrls;
+/**
+ * Default board renderer configuration.
+ */
+export declare const DEFAULT_MAIN_RENDERER_CONFIG: MainRendererConfig;

package/dist/extensions/first-party/main-renderer/types/internal.js

@@ -0,0 +1,30 @@
+export const CHESSNUT_PIECE_URLS = {
+    [6 /* PieceCode.WhiteKing */]: new URL('../../../../../assets/pieces/chessnut/wK.svg', import.meta.url).toString(),
+    [5 /* PieceCode.WhiteQueen */]: new URL('../../../../../assets/pieces/chessnut/wQ.svg', import.meta.url).toString(),
+    [4 /* PieceCode.WhiteRook */]: new URL('../../../../../assets/pieces/chessnut/wR.svg', import.meta.url).toString(),
+    [3 /* PieceCode.WhiteBishop */]: new URL('../../../../../assets/pieces/chessnut/wB.svg', import.meta.url).toString(),
+    [2 /* PieceCode.WhiteKnight */]: new URL('../../../../../assets/pieces/chessnut/wN.svg', import.meta.url).toString(),
+    [1 /* PieceCode.WhitePawn */]: new URL('../../../../../assets/pieces/chessnut/wP.svg', import.meta.url).toString(),
+    [14 /* PieceCode.BlackKing */]: new URL('../../../../../assets/pieces/chessnut/bK.svg', import.meta.url).toString(),
+    [13 /* PieceCode.BlackQueen */]: new URL('../../../../../assets/pieces/chessnut/bQ.svg', import.meta.url).toString(),
+    [12 /* PieceCode.BlackRook */]: new URL('../../../../../assets/pieces/chessnut/bR.svg', import.meta.url).toString(),
+    [11 /* PieceCode.BlackBishop */]: new URL('../../../../../assets/pieces/chessnut/bB.svg', import.meta.url).toString(),
+    [10 /* PieceCode.BlackKnight */]: new URL('../../../../../assets/pieces/chessnut/bN.svg', import.meta.url).toString(),
+    [9 /* PieceCode.BlackPawn */]: new URL('../../../../../assets/pieces/chessnut/bP.svg', import.meta.url).toString()
+};
+/**
+ * Default board renderer configuration.
+ */
+export const DEFAULT_MAIN_RENDERER_CONFIG = {
+    colors: {
+        board: {
+            light: '#d7dde5',
+            dark: '#707a8a'
+        },
+        coordinates: {
+            light: '#eef2f7',
+            dark: '#707a8a'
+        }
+    },
+    pieceUrls: CHESSNUT_PIECE_URLS
+};

package/dist/extensions/first-party/main-renderer/types/template.d.ts

@@ -0,0 +1,5 @@
+import { ConfigColors } from './internal';
+export interface TMainRendererConfig<TPieceUrls> {
+    colors: ConfigColors;
+    pieceUrls: TPieceUrls;
+}

package/dist/extensions/first-party/main-renderer/types/template.js

@@ -0,0 +1 @@
+export {};

package/dist/extensions/first-party/selected-square/factory.d.ts

@@ -0,0 +1,2 @@
+import { SelectedSquareDefinition, SelectedSquareInitConfig } from './types';
+export declare function createSelectedSquare(config?: SelectedSquareInitConfig): SelectedSquareDefinition;

package/dist/extensions/first-party/selected-square/factory.js

@@ -0,0 +1,88 @@
+import assert from '@ktarmyshov/assert';
+import { toMerged } from 'es-toolkit';
+import { createSvgElement, updateElementAttributes } from '../../../render/svg/helpers';
+import { isUpdateContextRenderable } from '../../types/context/update';
+import { extensionCreateInternalBase, extensionDestroy, extensionMount, extensionUnmount } from '../common/helpers';
+import { DEFAULT_CONFIG, EXTENSION_ID, EXTENSION_SLOTS } from './types';
+export function createSelectedSquare(config = {}) {
+    const mergedConfig = toMerged(DEFAULT_CONFIG, config);
+    return {
+        id: EXTENSION_ID,
+        slots: EXTENSION_SLOTS,
+        createInstance() {
+            return createSelectedSquareInstance(mergedConfig);
+        }
+    };
+}
+function createSelectedSquareInternal(config) {
+    return {
+        ...extensionCreateInternalBase(),
+        svgRect: null,
+        config
+    };
+}
+function extensionClean(state) {
+    state.svgRect = null;
+}
+function createSelectedSquareInstance(config) {
+    const internalState = createSelectedSquareInternal(config);
+    return {
+        id: EXTENSION_ID,
+        mount(env) {
+            extensionMount(internalState, env.slotRoots);
+        },
+        onUpdate(context) {
+            const needsRender = context.mutation.hasMutation({
+                causes: [
+                    'state.interaction.setSelectedSquare',
+                    'state.interaction.clear',
+                    'layout.refreshGeometry'
+                ]
+            }) && isUpdateContextRenderable(context);
+            if (!needsRender) {
+                return; // no-op
+            }
+            context.invalidation.markDirty(1 /* DirtyLayer.Highlight */);
+        },
+        render(context) {
+            assert(context.invalidation.dirtyLayers !== 0, 'Render should only be called when there are dirty layers');
+            const selectedSquare = context.currentFrame.state.interaction.selected?.square;
+            if (selectedSquare === undefined || selectedSquare === null) {
+                if (internalState.svgRect !== null) {
+                    internalState.svgRect.remove();
+                    internalState.svgRect = null;
+                }
+                return;
+            }
+            const geometry = context.currentFrame.layout.geometry;
+            const r = geometry.squareRect(selectedSquare);
+            const rectAttributes = {
+                x: r.x.toString(),
+                y: r.y.toString(),
+                width: r.size.toString(),
+                height: r.size.toString(),
+                fill: internalState.config.color,
+                'fill-opacity': internalState.config.opacity.toString(),
+                'shape-rendering': 'crispEdges'
+            };
+            if (internalState.svgRect === null) {
+                assert(internalState.slotRoots, 'Slot roots should be available when render is called');
+                internalState.svgRect = createSvgElement(internalState.slotRoots.underPieces, 'rect', {
+                    'data-chessboard-id': 'selected-square-highlight',
+                    ...rectAttributes
+                });
+            }
+            else {
+                updateElementAttributes(internalState.svgRect, rectAttributes);
+            }
+        },
+        unmount() {
+            extensionUnmount(internalState);
+            extensionClean(internalState);
+        },
+        destroy() {
+            extensionDestroy(internalState);
+            extensionClean(internalState);
+        }
+    };
+}