import {
  useDynamicForm
} from "./chunk-O2S7S5B4.js";
import {
  TextArea
} from "./chunk-5XYPLDI5.js";
import {
  TextField
} from "./chunk-6NPTJBFE.js";
import {
  Select
} from "./chunk-X2GMDZ7M.js";
import {
  RadioGroup
} from "./chunk-6DJOIRMF.js";
import {
  CheckboxGroup
} from "./chunk-W7X7KSJP.js";
import {
  Checkbox
} from "./chunk-VYCYVN3L.js";
import {
  __spreadProps,
  __spreadValues
} from "./chunk-CRTRMMJ7.js";

// src/molecules/dynamic-field.tsx
import { jsx, jsxs } from "react/jsx-runtime";
function DynamicFormField({
  field
}) {
  const {
    getFieldValue,
    getFieldError,
    getFieldTouched,
    setFieldValue,
    handleChange,
    handleBlur
  } = useDynamicForm();
  const { name, type } = field;
  const value = getFieldValue(name);
  const error = getFieldError(name);
  const touched = getFieldTouched(name);
  const hasError = Boolean(error && touched);
  const commonProps = {
    name,
    value: String(value || ""),
    onChange: handleChange,
    onBlur: handleBlur,
    error: hasError
  };
  switch (type) {
    case "short_text":
    case "email":
      return /* @__PURE__ */ jsx(
        TextField.Root,
        __spreadProps(__spreadValues({}, commonProps), {
          placeholder: field.placeholder,
          type: type === "short_text" ? "text" : type
        })
      );
    case "number":
      return /* @__PURE__ */ jsx(
        TextField.Root,
        __spreadProps(__spreadValues({}, commonProps), {
          inputMode: "numeric",
          pattern: "[0-9]*",
          placeholder: field.placeholder,
          type: "number"
        })
      );
    case "long_text":
      return /* @__PURE__ */ jsx(TextArea, __spreadProps(__spreadValues({}, commonProps), { placeholder: field.placeholder, rows: 4 }));
    case "dropdown":
      return /* @__PURE__ */ jsxs(
        Select.Root,
        {
          onValueChange: (newValue) => {
            void setFieldValue(name, newValue);
          },
          value,
          children: [
            /* @__PURE__ */ jsx(Select.Trigger, { placeholder: field.placeholder }),
            /* @__PURE__ */ jsx(Select.Content, { children: field.options.map((option) => /* @__PURE__ */ jsx(Select.Item, { value: String(option.value), children: option.label }, option.value)) })
          ]
        }
      );
    case "choice":
      return /* @__PURE__ */ jsx(
        RadioGroup.Root,
        {
          onValueChange: (newValue) => {
            void setFieldValue(name, newValue);
          },
          orientation: field.orientation,
          value: String(value || ""),
          children: field.options.map((option) => /* @__PURE__ */ jsx(RadioGroup.Item, { value: String(option.value), children: option.label }, option.value))
        }
      );
    case "choices":
      return /* @__PURE__ */ jsx(
        CheckboxGroup.Root,
        {
          onValueChange: (newValue) => {
            void setFieldValue(name, newValue);
          },
          orientation: field.orientation,
          value: Array.isArray(value) ? value.map(String) : [],
          children: field.options.map((option) => /* @__PURE__ */ jsx(CheckboxGroup.Item, { value: String(option.value), children: option.label }, option.value))
        }
      );
    case "yes_no":
      return /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: "8px" }, children: [
        /* @__PURE__ */ jsx(
          Checkbox,
          {
            checked: Boolean(value),
            onCheckedChange: (checked) => {
              void setFieldValue(name, checked);
            }
          }
        ),
        field.description ? /* @__PURE__ */ jsx("div", { style: { fontSize: "14px", color: "#666", lineHeight: "1.4" }, children: field.description }) : null
      ] });
    default:
      return null;
  }
}

export {
  DynamicFormField
};
//# sourceMappingURL=chunk-3JEVYSX3.js.map