import { jsxs as o, jsx as r } from "react/jsx-runtime";
import { Toggle as c } from "./TogglePrimitive.js";
import f from "../icon/components/icon-extend/IconExtend.js";
import { c as v } from "../../index-BtlgVD4m.js";
import { toggleSizes as p } from "./types/ToggleSize.js";
import { toggleVariants as u } from "./types/ToggleVariant.js";
import b from "../error-message/ErrorMessage.js";
const x = ({
  variant: s = "default",
  size: t = "default",
  icon: e,
  label: a,
  value: i,
  isDisabled: n,
  onChange: d,
  errorMessage: g,
  ref: l,
  ...m
}) => /* @__PURE__ */ o("div", { className: "relative", children: [
  /* @__PURE__ */ o(
    c,
    {
      ref: l,
      className: v(
        "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium transition-colors hover:text-[var(--base-muted-foreground)] hover:bg-[var(--base-muted)] hover:cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-[var(--opacity-opacity-50)] data-[state=on]:bg-[var(--base-accent)] data-[state=on]:text-[var(--base-foreground)] [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
        u[s],
        p[t]
      ),
      pressed: i,
      disabled: n,
      onPressedChange: d,
      ...m,
      children: [
        e && /* @__PURE__ */ r(f, { icon: e, size: 16 }),
        a
      ]
    }
  ),
  /* @__PURE__ */ r(b, { message: g })
] });
x.displayName = "Toggle";
export {
  x as default
};
//# sourceMappingURL=Toggle.js.map
