'use client';
import { jsx as _jsx } from "react/jsx-runtime";
import React from 'react';
import { cn } from '@/lib/utils';
export function Iframe({ src, title = 'Embedded content', width, height, aspectRatio, allowFullScreen = true, allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture', className, frameBorder = 0 }) {
    // Determine sizing approach
    const hasFixedSize = width || height;
    const useAspectRatio = aspectRatio && !hasFixedSize;
    // Convert numeric values to pixels
    const getSize = (value)=>{
        if (value === undefined) return undefined;
        if (typeof value === 'number') return `${value}px`;
        return value;
    };
    const containerStyle = useAspectRatio ? {
        aspectRatio
    } : {};
    const iframeStyle = {
        width: getSize(width) || (useAspectRatio ? '100%' : undefined),
        height: getSize(height) || (useAspectRatio ? '100%' : undefined)
    };
    return /*#__PURE__*/ _jsx("div", {
        className: cn('docs-iframe my-4 overflow-hidden rounded-lg border border-border', useAspectRatio && 'w-full', className),
        style: containerStyle,
        children: /*#__PURE__*/ _jsx("iframe", {
            src: src,
            title: title,
            style: iframeStyle,
            frameBorder: frameBorder,
            allowFullScreen: allowFullScreen,
            allow: allow,
            className: cn('docs-iframe-content', useAspectRatio && 'w-full h-full')
        })
    });
}
export function Video({ src, title = 'Video', aspectRatio = '16/9', className }) {
    // Convert YouTube watch URLs to embed URLs
    let embedSrc = src;
    if (src.includes('youtube.com/watch')) {
        const videoId = new URL(src).searchParams.get('v');
        if (videoId) {
            embedSrc = `https://www.youtube.com/embed/${videoId}`;
        }
    } else if (src.includes('youtu.be/')) {
        const videoId = src.split('youtu.be/')[1]?.split('?')[0];
        if (videoId) {
            embedSrc = `https://www.youtube.com/embed/${videoId}`;
        }
    } else if (src.includes('vimeo.com/') && !src.includes('player.vimeo.com')) {
        const videoId = src.split('vimeo.com/')[1]?.split('?')[0];
        if (videoId) {
            embedSrc = `https://player.vimeo.com/video/${videoId}`;
        }
    }
    return /*#__PURE__*/ _jsx(Iframe, {
        src: embedSrc,
        title: title,
        aspectRatio: aspectRatio,
        className: cn('docs-video', className)
    });
}
export function Loom({ id, title = 'Loom video', className }) {
    return /*#__PURE__*/ _jsx(Iframe, {
        src: `https://www.loom.com/embed/${id}`,
        title: title,
        aspectRatio: "16/9",
        className: cn('docs-loom', className)
    });
}
