"use client";
import { jsxs as s, jsx as e } from "react/jsx-runtime";
import { Input as I } from "../shared/input.js";
import { Label as S } from "../shared/label.js";
import { useSettings as b } from "../../hooks/use-settings.js";
import { getCurrentBreakpoint as j } from "../../../../../store/selectors.js";
import { createId as B, classNames as C } from "../../../../../utils.js";
import { useAppSelector as y } from "../../hooks/use-app-selector.js";
import { cva as E } from "../../../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
import { l as F } from "../../../../../_virtual/lodash.js";
import { useRef as R, useEffect as A } from "react";
import { useFieldName as L } from "../../hooks/use-field-name.js";
import { BreakpointSelector as q } from "../shared/breakpoint-selector.js";
import { LanguageSelector as D } from "../shared/language-selector.js";
const G = E("", {
  variants: {
    direction: {
      row: "flex-row justify-between items-center",
      col: "flex-col"
    }
  },
  defaultVariants: {
    direction: "col"
  }
}), _ = ({
  className: c,
  label: o,
  responsive: a,
  mode: i,
  isLocalized: l,
  type: f,
  fieldName: u,
  direction: p,
  inputProps: d,
  labelProps: x,
  placeholder: N,
  min: g,
  max: h
}) => {
  const v = y(j), t = R(null), w = L({
    key: u,
    responsive: a,
    mode: i,
    isLocalized: l
  }), [m, V] = b(w, f), n = B(), k = F.debounce((r) => {
    V(r);
  }, 400);
  return A(() => {
    t.current && (t.current.value = m ?? "");
  }, [v, m]), /* @__PURE__ */ s(
    "div",
    {
      className: C("mt-4 flex w-full gap-1.5", G({ direction: p, className: c })),
      children: [
        o && /* @__PURE__ */ s(S, { htmlFor: n, className: "flex w-full flex-1 items-center", ...x, children: [
          /* @__PURE__ */ e("span", { children: o }),
          a && /* @__PURE__ */ e(q, {}),
          l && /* @__PURE__ */ e(D, { className: "ms-auto" })
        ] }),
        /* @__PURE__ */ e(
          I,
          {
            ref: t,
            id: n,
            className: "flex-1 text-[12px]",
            defaultValue: "",
            onChange: (r) => k(r.target.value),
            placeholder: N,
            min: g,
            max: h,
            ...d
          }
        )
      ]
    }
  );
};
export {
  _ as InputControl
};
//# sourceMappingURL=input.control.js.map
