import React from 'react';
export function PHXIframe({ hasBorder = false, height = 'large', isFullWidth = true, isMobile = false, rounded = false, src, srcDoc, title = 'Iframe Content', }) {
    const widthClass = isFullWidth ? 'w-full' : 'w-auto';
    const heightClass = {
        small: 'h-56',
        medium: 'h-[270px]',
        large: 'h-96',
        full: 'h-full',
    }[height];
    const borderClass = hasBorder ? 'border border-gray-200' : 'border-none';
    const roundedClass = rounded ? 'rounded-lg' : '';
    const iframeClasses = `${widthClass} ${heightClass} ${borderClass} ${roundedClass}`.trim();
    const baseStyle = `
    <style>
      html, body {
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -ms-overflow-style: none;
        scrollbar-width: none;
      }
      html::-webkit-scrollbar, body::-webkit-scrollbar {
        display: none !important;
      }
      body {
        font-family: system-ui, -apple-system, sans-serif;
      }
      * {
        line-height: 1.5 !important;
      }
    
      img {
        max-width: 100% !important;
        height: auto !important;
      }
      ${isMobile
        ? `
      .preview-scale-wrapper {
        zoom: 0.6;
        -moz-transform: scale(0.6);
        -moz-transform-origin: 0 0;
        box-sizing: border-box;
      }
      h3 {
        font-weight: 500 !important;
      }
      `
        : ''}
    </style>
  `;
    const finalSrcDoc = srcDoc ? `${baseStyle} <div class="preview-scale-wrapper">${srcDoc}</div>` : undefined;
    return (React.createElement(React.Fragment, null,
        React.createElement("iframe", { className: iframeClasses, src: src, srcDoc: finalSrcDoc, title: title })));
}
//# sourceMappingURL=PHXIframe.js.map