"use client";
'use strict';

const jsxRuntime = require('react/jsx-runtime');
const React = require('react');
const steppedAutoForm = require('../auto-form/stepped-auto-form.cjs');
const helpers = require('../auto-form/helpers.cjs');
const button = require('../button.cjs');
const utils = require('../../lib/utils.cjs');
const schemaConverter = require('../../lib/schema-converter.cjs');

function FormPreview({ schema, className, fieldComponents, defaultValues }) {
  const [submittedValues, setSubmittedValues] = React.useState(null);
  const zodSchema = React.useMemo(() => {
    try {
      if (!schema.properties || Object.keys(schema.properties).length === 0) {
        return null;
      }
      return schemaConverter.formSchemaToZod(schema);
    } catch (error) {
      console.error("Failed to parse JSON Schema:", error);
      return null;
    }
  }, [schema]);
  const mergedFieldComponents = React.useMemo(() => fieldComponents ?? {}, [fieldComponents]);
  const fieldConfig = React.useMemo(() => {
    try {
      return helpers.buildFieldConfigFromJsonSchema(
        schema,
        mergedFieldComponents
      );
    } catch (error) {
      console.error("Failed to build field config:", error);
      return {};
    }
  }, [schema, mergedFieldComponents]);
  const handleSubmit = (values) => {
    setSubmittedValues(values);
  };
  const handleReset = () => {
    setSubmittedValues(null);
  };
  if (!zodSchema) {
    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("p-8 text-center text-muted-foreground", className), children: [
      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium mb-2", children: "No fields to preview" }),
      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: "Add some fields to your form to see a preview" })
    ] });
  }
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("p-4 md:p-6", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-2xl mx-auto", children: submittedValues ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold", children: "Submitted Values" }),
      /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", onClick: handleReset, children: "Try Again" })
    ] }),
    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border bg-muted/50 p-4", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-sm overflow-auto whitespace-pre-wrap", children: JSON.stringify(submittedValues, null, 2) }) })
  ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-6", children: [
      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold", children: "Form Preview" }),
      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Test your form and see the submitted values" })
    ] }),
    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border bg-card p-6", children: /* @__PURE__ */ jsxRuntime.jsx(
      steppedAutoForm.default,
      {
        formSchema: zodSchema,
        onSubmit: handleSubmit,
        fieldConfig,
        values: defaultValues,
        submitButtonText: "Submit"
      }
    ) })
  ] }) }) });
}

exports.FormPreview = FormPreview;
