import { jsxs as s, jsx as l } from "react/jsx-runtime";
import b from "../../hooks/useFieldContext.js";
import g from "../../../label/Label.js";
import { c as u } from "../../../../index-BtlgVD4m.js";
import t from "../../../box/Box.js";
const v = ({ children: i, htmlFor: n, required: o = !1, disabled: c = !1, isError: m = !1, extra: a, className: d }) => {
  const { name: f, fieldState: e } = b(), p = n ?? f, x = m || (e == null ? void 0 : e.invalid), r = /* @__PURE__ */ s(
    g,
    {
      htmlFor: p,
      variant: "field",
      className: u(
        // Base layout for inline content (icon, tooltip, etc.)
        "inline-flex items-center gap-[var(--spacing-1)]",
        // Disabled state
        c && "opacity-50 cursor-not-allowed",
        // Error state
        x && "text-[var(--base-danger-text)]",
        d
      ),
      children: [
        i,
        o && /* @__PURE__ */ l("span", { className: "text-[var(--base-danger-text)]", "aria-hidden": "true", children: "*" })
      ]
    }
  );
  return a ? /* @__PURE__ */ s(t, { className: "flex items-center justify-between w-full gap-[var(--spacing-2)]", children: [
    r,
    /* @__PURE__ */ l(t, { className: "flex items-center gap-[var(--spacing-1)]", children: a })
  ] }) : r;
};
v.displayName = "FieldLabel";
export {
  v as default
};
//# sourceMappingURL=FieldLabel.js.map
