import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { starPoints, polygonPoints } from './vectorEditorTypes.js';

const ShapeRenderer = ({ shape: s, selected, zoom }) => {
    var _a;
    const selStroke = selected ? "rgba(85,102,204,0.6)" : undefined;
    const gProps = {};
    if (s.opacity < 1)
        gProps.opacity = s.opacity;
    if (s.rotation && s.type !== "polygon" && s.type !== "star") {
        gProps.transform = `rotate(${s.rotation} ${s.x + s.w / 2} ${s.y + s.h / 2})`;
    }
    const selBox = selected ? (jsx("rect", { x: s.x - 1, y: s.y - 1, width: s.w + 2, height: s.h + 2, fill: "none", stroke: selStroke, strokeWidth: 2 / zoom, strokeDasharray: `${4 / zoom}` })) : null;
    switch (s.type) {
        case "rect":
            return (jsxs("g", { ...gProps, children: [jsx("rect", { x: s.x, y: s.y, width: s.w, height: s.h, fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selBox] }));
        case "roundrect":
            return (jsxs("g", { ...gProps, children: [jsx("rect", { x: s.x, y: s.y, width: s.w, height: s.h, rx: s.rx || 12, fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selBox] }));
        case "ellipse":
            return (jsxs("g", { ...gProps, children: [jsx("ellipse", { cx: s.x + s.w / 2, cy: s.y + s.h / 2, rx: s.w / 2, ry: s.h / 2, fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selBox] }));
        case "line":
            return (jsxs("g", { ...gProps, children: [jsx("line", { x1: s.x, y1: s.y, x2: s.x2, y2: s.y2, stroke: s.stroke, strokeWidth: s.strokeWidth }), selected && (jsxs(Fragment, { children: [jsx("circle", { cx: s.x, cy: s.y, r: 4 / zoom, fill: "#5566cc" }), jsx("circle", { cx: s.x2, cy: s.y2, r: 4 / zoom, fill: "#5566cc" })] }))] }));
        case "arrow":
            return (jsxs("g", { ...gProps, children: [jsx("defs", { children: jsx("marker", { id: `ah-${s.id}`, markerWidth: "10", markerHeight: "7", refX: "10", refY: "3.5", orient: "auto", children: jsx("polygon", { points: "0 0, 10 3.5, 0 7", fill: s.stroke }) }) }), jsx("line", { x1: s.x, y1: s.y, x2: s.x2, y2: s.y2, stroke: s.stroke, strokeWidth: s.strokeWidth, markerEnd: `url(#ah-${s.id})` }), selected && (jsxs(Fragment, { children: [jsx("circle", { cx: s.x, cy: s.y, r: 4 / zoom, fill: "#5566cc" }), jsx("circle", { cx: s.x2, cy: s.y2, r: 4 / zoom, fill: "#5566cc" })] }))] }));
        case "polyline":
            if (!((_a = s.points) === null || _a === void 0 ? void 0 : _a.length))
                return null;
            return (jsxs("g", { ...gProps, children: [jsx("polyline", { points: s.points.map((p) => `${p.x},${p.y}`).join(" "), fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selected &&
                        s.points.map((p, i) => (jsx("circle", { cx: p.x, cy: p.y, r: 3 / zoom, fill: "#5566cc", stroke: "#fff", strokeWidth: 1 / zoom }, i)))] }));
        case "polygon": {
            const cx2 = s.x + s.w / 2;
            const cy2 = s.y + s.h / 2;
            const r2 = Math.min(s.w, s.h) / 2;
            const pts = polygonPoints(cx2, cy2, r2, s.sides || 6, s.rotation);
            return (jsxs("g", { opacity: s.opacity < 1 ? s.opacity : undefined, children: [jsx("polygon", { points: pts, fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selBox] }));
        }
        case "star": {
            const cx2 = s.x + s.w / 2;
            const cy2 = s.y + s.h / 2;
            const r2 = Math.min(s.w, s.h) / 2;
            const ir = r2 * (s.innerRadius || 0.4);
            const pts = starPoints(cx2, cy2, r2, ir, s.sides || 5, s.rotation);
            return (jsxs("g", { opacity: s.opacity < 1 ? s.opacity : undefined, children: [jsx("polygon", { points: pts, fill: s.fill, stroke: s.stroke, strokeWidth: s.strokeWidth }), selBox] }));
        }
        case "text":
            return (jsxs("g", { ...gProps, children: [jsx("text", { x: s.x, y: s.y + (s.fontSize || 24), fontSize: s.fontSize || 24, fontFamily: s.fontFamily || "sans-serif", fill: s.fill, children: s.text }), selBox] }));
        default:
            return null;
    }
};

export { ShapeRenderer };
//# sourceMappingURL=VectorEditorShapeRenderer.js.map
