'use strict';
'use client';
import { c } from 'react/compiler-runtime';
import { jsxs, jsx } from 'react/jsx-runtime';
import { Image } from '../../../fd-component-toolbox/image/Image.js';
import { useState } from 'react';
import { Button } from '../../../fd-component-toolbox/button/Button.js';
import { Input } from '../../../fd-component-toolbox/input/Input.js';
import { onTakeScreenshot } from './TestScreenshotPage.funcs.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function TestScreenshotPage() {
  const $ = c(5);
  const [websiteUrl, setWebsiteUrl] = useState("");
  const [imageSrc, setImageSrc] = useState("");
  let t0;
  if ($[0] !== imageSrc || $[1] !== websiteUrl) {
    let t1;
    if ($[3] !== websiteUrl) {
      t1 = async () => onTakeScreenshot(websiteUrl, setImageSrc);
      $[3] = websiteUrl;
      $[4] = t1;
    } else {
      t1 = $[4];
    }
    t0 = jsxs("div", {
      className: "flex size-full flex-col items-center justify-center gap-5",
      children: [jsxs("div", {
        className: "flex gap-5",
        children: [jsx(Input, {
          value: websiteUrl,
          onChange: setWebsiteUrl,
          variant: "bordered"
        }), jsx(Button, {
          onClick: t1,
          children: "Take Screenshot"
        })]
      }), imageSrc && jsx(Image, {
        src: imageSrc,
        width: 500,
        height: 500,
        alt: "screenshot-result",
        className: "object-contain"
      })]
    });
    $[0] = imageSrc;
    $[1] = websiteUrl;
    $[2] = t0;
  } else {
    t0 = $[2];
  }
  return t0;
}
__name(TestScreenshotPage, "TestScreenshotPage");

export { TestScreenshotPage as default };
