import { jsx as t, jsxs as c } from "react/jsx-runtime";
import m from "react";
import { L as b, j as u } from "../../index-Iq3n7zsQ.js";
import { Dot as f } from "lucide-react";
import { c as o } from "../../index-BtlgVD4m.js";
const x = ({ ref: e, className: r, containerClassName: a, ...s }) => /* @__PURE__ */ t(
  b,
  {
    ref: e,
    containerClassName: o("flex items-center gap-[var(--spacing-2)] has-[:disabled]:opacity-[var(--opacity-opacity-50)]", a),
    className: o("disabled:cursor-not-allowed !opacity-0", r),
    ...s
  }
);
x.displayName = "BaseInputOTP";
const y = ({ ref: e, className: r, ...a }) => /* @__PURE__ */ t("div", { ref: e, className: o("flex items-center", r), ...a });
y.displayName = "InputOTPGroup";
const v = ({
  ref: e,
  index: r,
  className: a,
  isError: s,
  ...n
}) => {
  const i = m.useContext(u), { char: l, hasFakeCaret: d, isActive: p } = i.slots[r];
  return /* @__PURE__ */ c(
    "div",
    {
      ref: e,
      className: o(
        [
          "relative",
          "flex",
          "h-9",
          "w-9",
          "items-center",
          "justify-center",
          "border-y",
          "border-r",
          "border-(--base-border)",
          "text-[length:var(--typography-base-sizes-small-font-size)]",
          "font-[var(--font-weight-normal)]",
          "leading-[var(--typography-base-sizes-small-line-height)]",
          "transition-all",
          "first:rounded-l-md",
          "first:border-l",
          "last:rounded-r-md",
          s && "border-y-[2px] border-r-[2px] first:border-l-[2px] border-(--base-danger-border) text-[var(--base-danger-text)]"
        ],
        p && `${s ? "border-2" : "border"} border-(--base-ring)`,
        a
      ),
      ...n,
      children: [
        l,
        d && /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ t("div", { className: "h-4 w-px animate-caret-blink bg-[var(--base-foreground)] duration-1000" }) })
      ]
    }
  );
};
v.displayName = "InputOTPSlot";
const h = ({ ref: e, ...r }) => /* @__PURE__ */ t("div", { ref: e, role: "separator", ...r, children: /* @__PURE__ */ t(f, {}) });
h.displayName = "InputOTPSeparator";
export {
  x as BaseInputOTP,
  y as InputOTPGroup,
  h as InputOTPSeparator,
  v as InputOTPSlot
};
//# sourceMappingURL=InputOTPPrimitive.js.map
