"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { cn } from "@open-mercato/shared/lib/utils";
import { Switch } from "./switch.js";
const SwitchField = React.forwardRef(({
  id: idProp,
  label,
  sublabel,
  description,
  badge,
  link,
  flip = false,
  containerClassName,
  contentClassName,
  className,
  disabled,
  ...switchProps
}, ref) => {
  const fallbackId = React.useId();
  const id = idProp ?? fallbackId;
  const hasMultiLine = Boolean(description || sublabel || link);
  const switchEl = /* @__PURE__ */ jsx(
    Switch,
    {
      ref,
      id,
      disabled,
      className: cn(hasMultiLine && "mt-0.5", className),
      ...switchProps
    }
  );
  const content = /* @__PURE__ */ jsxs("div", { className: cn("flex flex-1 min-w-0 flex-col gap-2.5", contentClassName), children: [
    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
      /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1", children: [
        /* @__PURE__ */ jsx(
          "label",
          {
            htmlFor: id,
            className: cn(
              "text-sm font-medium leading-5 text-foreground select-none",
              disabled ? "cursor-not-allowed opacity-60" : "cursor-pointer"
            ),
            children: label
          }
        ),
        sublabel ? /* @__PURE__ */ jsx("span", { className: "text-xs leading-4 text-muted-foreground select-none", children: sublabel }) : null,
        badge ? /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0", children: badge }) : null
      ] }),
      description ? /* @__PURE__ */ jsx("p", { className: "text-xs leading-4 text-muted-foreground", children: description }) : null
    ] }),
    link ? /* @__PURE__ */ jsx("div", { className: "flex", children: link }) : null
  ] });
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: cn(
        "flex gap-3",
        hasMultiLine ? "items-start" : "items-center",
        containerClassName
      ),
      children: flip ? /* @__PURE__ */ jsxs(Fragment, { children: [
        switchEl,
        content
      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
        content,
        switchEl
      ] })
    }
  );
});
SwitchField.displayName = "SwitchField";
export {
  SwitchField
};
//# sourceMappingURL=switch-field.js.map
