'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { blockRenderers, FallbackPreview } from '../block-renderers/index.js';
function getBlockLabel(blockType) {
    return blockType.charAt(0).toUpperCase() + blockType.slice(1);
}
export function BlockRenderer({ node, selectedNodeId, onSelectNode }) {
    const [hovered, setHovered] = useState(false);
    const isSelected = selectedNodeId === node.id;
    const blockType = node.settings.blockType;
    const label = getBlockLabel(blockType);
    const Preview = blockRenderers[blockType];
    const handleClick = (e) => {
        e.stopPropagation();
        onSelectNode(node.id);
    };
    return (_jsxs("div", { "data-node-id": node.id, "data-block-type": blockType, className: `relative min-h-[48px] transition-shadow ${isSelected ? 'ring-primary ring-2 ring-offset-2' : hovered ? 'ring-primary/50 ring-1' : ''}`, onClick: handleClick, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [(hovered || isSelected) && (_jsx("span", { className: "bg-primary text-primary-foreground absolute -top-2 -left-1 z-10 rounded px-1.5 py-0.5 text-xs font-medium", children: label })), _jsx("div", { className: "pointer-events-none", children: Preview ? (_jsx(Preview, { data: node.data, variant: node.settings.variant })) : (_jsx(FallbackPreview, { blockType: blockType, data: node.data })) })] }));
}
//# sourceMappingURL=BlockRenderer.js.map