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