import { jsxs as d, jsx as s } from "react/jsx-runtime";
import { isValidElement as g, cloneElement as V } from "react";
import { InputLabel as l } from "../InputLabel/InputLabel.es.js";
import { merge as u } from "../../utilities/merge.es.js";
import { Validation as f } from "../../utilities/validation.es.js";
var k = /* @__PURE__ */ ((t) => (t.Primary = "Primary", t.Positive = "Positive", t.Danger = "Danger", t))(k || {});
const p = {
  Primary: f.Default,
  Positive: f.Success,
  Danger: f.Error
}, m = ({
  text: t,
  disabled: e,
  style: i,
  fullWidth: n = !1,
  "data-test-id": r = "form-control"
}) => {
  let a;
  switch (!0) {
    case e:
      a = "tw-text-black-40";
      break;
    case i === "Danger":
      a = "tw-text-red-60";
      break;
    case i === "Positive":
      a = "tw-text-green-60";
      break;
    default:
      a = "tw-text-black-80";
      break;
  }
  return /* @__PURE__ */ s(
    "span",
    {
      "data-test-id": `${r}-helper-text`,
      className: `tw-text-s tw-font-sans ${n ? "tw-w-full" : ""} ${a}`,
      children: t
    }
  );
};
m.displayName = "FondueHelperText";
var N = /* @__PURE__ */ ((t) => (t.Before = "Before", t.After = "After", t))(N || {}), P = /* @__PURE__ */ ((t) => (t.Horizontal = "Horizontal", t.Vertical = "Vertical", t))(P || {});
const H = ({
  label: t,
  children: e,
  extra: i,
  name: n,
  helper: r,
  disabled: a,
  clickable: v,
  direction: o = "Vertical",
  style: c = "Primary",
  "data-test-id": w = "form-control"
}) => {
  const x = (r == null ? void 0 : r.position) === "Before";
  return /* @__PURE__ */ d(
    "div",
    {
      "data-test-id": w,
      "data-name": n,
      className: u([
        "tw-flex tw-items-center tw-gap-2",
        o === "Horizontal" ? "tw-flex-row" : "tw-w-full tw-flex-col"
      ]),
      children: [
        ((t == null ? void 0 : t.children) || i) && /* @__PURE__ */ d(
          "div",
          {
            className: u([
              "tw-flex tw-flew-row tw-items-center tw-justify-between",
              o === "Vertical" && "tw-w-full"
            ]),
            children: [
              (t == null ? void 0 : t.children) && /* @__PURE__ */ s(l, { ...t, disabled: a, clickable: v }),
              i && /* @__PURE__ */ s(
                "span",
                {
                  "data-test-id": `${w}-extra`,
                  className: "tw-pl-2 tw-text-black-80 tw-font-sans tw-text-s tw-whitespace-nowrap",
                  children: i
                }
              )
            ]
          }
        ),
        (r == null ? void 0 : r.text) && x && /* @__PURE__ */ s(
          m,
          {
            style: c,
            fullWidth: o === "Vertical",
            text: r.text,
            disabled: a,
            "data-test-id": w
          }
        ),
        e && /* @__PURE__ */ s(
          "div",
          {
            className: o === "Vertical" ? "tw-w-full tw-grid tw-grid-cols-1 tw-gap-5" : "",
            children: g(e) ? V(e, {
              id: (t == null ? void 0 : t.htmlFor) ?? e.props.id,
              disabled: a,
              validation: p[c]
            }) : e
          }
        ),
        (r == null ? void 0 : r.text) && !x && /* @__PURE__ */ s(
          m,
          {
            fullWidth: o === "Vertical",
            text: r.text,
            disabled: a,
            style: c,
            "data-test-id": w
          }
        )
      ]
    }
  );
};
H.displayName = "FondueFormControl";
export {
  H as FormControl,
  P as FormControlDirection,
  k as FormControlStyle,
  N as HelperPosition
};
//# sourceMappingURL=FormControl.es.js.map
