@thewhateverapp/tile-sdk 0.14.9 → 0.14.11

package/dist/scene/entities/EntityRenderer.js

@@ -1,203 +0,0 @@
-'use client';
-import React, { useCallback, useMemo } from 'react';
-import { Container, Graphics, Text } from '../../pixi/index.js';
-/**
- * Renders a single entity based on its kind
- */
-export function EntityRenderer({ state, debug = false }) {
-    const { entity, x, y, rotation, scaleX, scaleY, alpha, fill } = state;
-    const kind = entity.kind;
-    // Parse fill color
-    const fillColor = useMemo(() => {
-        const color = fill ?? entity.render?.fill ?? '#ffffff';
-        return parseInt(color.replace('#', ''), 16);
-    }, [fill, entity.render?.fill]);
-    // Parse stroke color
-    const strokeColor = useMemo(() => {
-        const color = entity.render?.stroke;
-        if (!color)
-            return undefined;
-        return parseInt(color.replace('#', ''), 16);
-    }, [entity.render?.stroke]);
-    const strokeWidth = entity.render?.strokeWidth ?? 0;
-    // Common container props
-    const containerProps = {
-        x,
-        y,
-        rotation,
-        scale: { x: scaleX, y: scaleY },
-        alpha,
-    };
-    switch (kind) {
-        case 'rect':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(RectEntity, { geom: entity.geom, fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth }),
-                debug && React.createElement(DebugBounds, { geom: entity.geom })));
-        case 'circle':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(CircleEntity, { geom: entity.geom, fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth })));
-        case 'poly':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(PolyEntity, { geom: entity.geom, fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth })));
-        case 'line':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(LineEntity, { geom: entity.geom, strokeColor: strokeColor ?? fillColor })));
-        case 'text':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(TextEntity, { geom: entity.geom, fillColor: fillColor })));
-        case 'sprite':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(SpriteEntity, { geom: entity.geom })));
-        case 'emitter':
-            return (React.createElement(Container, { ...containerProps },
-                React.createElement(EmitterEntity, { geom: entity.geom, fillColor: fillColor })));
-        case 'group':
-            // Groups are just containers, children are rendered separately
-            return React.createElement(Container, { ...containerProps });
-        default:
-            console.warn(`Unknown entity kind: ${kind}`);
-            return null;
-    }
-}
-/**
- * Rect entity renderer
- */
-function RectEntity({ geom, fillColor, strokeColor, strokeWidth, }) {
-    const draw = useCallback((g) => {
-        g.clear();
-        if (strokeColor !== undefined && strokeWidth > 0) {
-            g.lineStyle(strokeWidth, strokeColor);
-        }
-        g.beginFill(fillColor);
-        const anchorX = geom.w / 2;
-        const anchorY = geom.h / 2;
-        if (geom.cornerRadius && geom.cornerRadius > 0) {
-            g.drawRoundedRect(-anchorX, -anchorY, geom.w, geom.h, geom.cornerRadius);
-        }
-        else {
-            g.drawRect(-anchorX, -anchorY, geom.w, geom.h);
-        }
-        g.endFill();
-    }, [geom.w, geom.h, geom.cornerRadius, fillColor, strokeColor, strokeWidth]);
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Circle entity renderer
- */
-function CircleEntity({ geom, fillColor, strokeColor, strokeWidth, }) {
-    const draw = useCallback((g) => {
-        g.clear();
-        if (strokeColor !== undefined && strokeWidth > 0) {
-            g.lineStyle(strokeWidth, strokeColor);
-        }
-        g.beginFill(fillColor);
-        g.drawCircle(0, 0, geom.r);
-        g.endFill();
-    }, [geom.r, fillColor, strokeColor, strokeWidth]);
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Polygon entity renderer
- */
-function PolyEntity({ geom, fillColor, strokeColor, strokeWidth, }) {
-    const draw = useCallback((g) => {
-        g.clear();
-        if (strokeColor !== undefined && strokeWidth > 0) {
-            g.lineStyle(strokeWidth, strokeColor);
-        }
-        g.beginFill(fillColor);
-        const points = geom.points;
-        if (points.length < 3)
-            return;
-        g.moveTo(points[0][0], points[0][1]);
-        for (let i = 1; i < points.length; i++) {
-            g.lineTo(points[i][0], points[i][1]);
-        }
-        g.closePath();
-        g.endFill();
-    }, [geom.points, fillColor, strokeColor, strokeWidth]);
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Line entity renderer
- */
-function LineEntity({ geom, strokeColor, }) {
-    const draw = useCallback((g) => {
-        g.clear();
-        g.lineStyle(geom.lineWidth ?? 2, strokeColor);
-        const points = geom.points;
-        if (points.length < 2)
-            return;
-        g.moveTo(points[0][0], points[0][1]);
-        for (let i = 1; i < points.length; i++) {
-            g.lineTo(points[i][0], points[i][1]);
-        }
-    }, [geom.points, geom.lineWidth, strokeColor]);
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Text entity renderer
- */
-function TextEntity({ geom, fillColor, }) {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const style = useMemo(() => ({
-        fontFamily: geom.fontFamily ?? 'Arial',
-        fontSize: geom.fontSize ?? 16,
-        fontWeight: geom.fontWeight ?? 'normal',
-        fill: fillColor,
-        align: geom.align ?? 'center',
-    }), [geom.fontFamily, geom.fontSize, geom.fontWeight, geom.align, fillColor]);
-    return (React.createElement(Text, { text: geom.text, style: style, anchor: { x: 0.5, y: 0.5 } }));
-}
-/**
- * Sprite entity renderer
- */
-function SpriteEntity({ geom }) {
-    // For now, just render a placeholder
-    // Full sprite loading requires texture management
-    const draw = useCallback((g) => {
-        g.clear();
-        g.beginFill(0x888888);
-        const w = geom.w ?? 32;
-        const h = geom.h ?? 32;
-        g.drawRect(-w / 2, -h / 2, w, h);
-        g.endFill();
-        // Draw X to indicate missing sprite
-        g.lineStyle(2, 0xff0000);
-        g.moveTo(-w / 2, -h / 2);
-        g.lineTo(w / 2, h / 2);
-        g.moveTo(w / 2, -h / 2);
-        g.lineTo(-w / 2, h / 2);
-    }, [geom.w, geom.h]);
-    // TODO: Load actual sprite from geom.src
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Particle emitter entity renderer
- * This is a simplified version - full particle system is in effects/
- */
-function EmitterEntity({ geom, fillColor, }) {
-    // For now, just draw a marker for the emitter
-    const draw = useCallback((g) => {
-        g.clear();
-        g.beginFill(fillColor, 0.3);
-        g.drawCircle(0, 0, 10);
-        g.endFill();
-        // Draw emitter indicator
-        g.lineStyle(1, fillColor);
-        g.drawCircle(0, 0, 15);
-    }, [fillColor]);
-    // TODO: Implement full particle system
-    return React.createElement(Graphics, { draw: draw });
-}
-/**
- * Debug bounds renderer
- */
-function DebugBounds({ geom }) {
-    const draw = useCallback((g) => {
-        g.clear();
-        g.lineStyle(1, 0x00ff00, 0.5);
-        g.drawRect(-geom.w / 2, -geom.h / 2, geom.w, geom.h);
-    }, [geom.w, geom.h]);
-    return React.createElement(Graphics, { draw: draw });
-}