'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { cn } from '@/lib/utils';
export function Frame({ children, caption, className }) {
    return /*#__PURE__*/ _jsxs("figure", {
        className: cn('my-6', className),
        children: [
            /*#__PURE__*/ _jsx("div", {
                className: "overflow-hidden rounded-lg border border-border bg-muted/30",
                children: /*#__PURE__*/ _jsx("div", {
                    className: "[&>img]:m-0 [&>img]:w-full [&>img]:h-auto",
                    children: children
                })
            }),
            caption && /*#__PURE__*/ _jsx("figcaption", {
                className: "mt-2 text-center text-sm text-muted-foreground",
                children: caption
            })
        ]
    });
}
export function Columns({ children, cols = 2, className }) {
    const gridCols = {
        1: 'grid-cols-1',
        2: 'grid-cols-1 md:grid-cols-2',
        3: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
        4: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-4'
    };
    return /*#__PURE__*/ _jsx("div", {
        className: cn('grid gap-4 my-4', gridCols[cols], className),
        children: children
    });
}
export function Snippet({ file, className }) {
    // In production, this would dynamically load the snippet content
    // For now, we show a placeholder
    return /*#__PURE__*/ _jsx("div", {
        className: cn('my-4 p-4 rounded-lg border border-dashed border-border bg-muted/30', className),
        children: /*#__PURE__*/ _jsxs("div", {
            className: "text-sm text-muted-foreground",
            children: [
                "Snippet: ",
                /*#__PURE__*/ _jsx("code", {
                    className: "text-xs bg-muted px-1 py-0.5 rounded",
                    children: file
                })
            ]
        })
    });
}
export function Latex({ children, className }) {
    // In production, this would render LaTeX using KaTeX
    // For now, we show the raw expression in a styled container
    return /*#__PURE__*/ _jsx("span", {
        className: cn('inline-block px-2 py-1 font-mono text-sm bg-muted rounded', className),
        children: children
    });
}
