@clubmed/trident-ui/molecules/Forms/Radios/Radio.js

Shared ClubMed React UI components

import { jsxs as c, jsx as e } from "react/jsx-runtime";
import { c as b } from "../../../chunks/index.js";
import { useId as k } from "react";
import { useValue as w } from "../../../hooks/useValue.js";
/* empty css                       */
function R(d) {
  const n = k(), {
    id: o = n,
    name: l = o,
    className: m,
    dataTestId: h,
    disabled: a,
    checked: f = !1,
    value: i,
    size: t = 24,
    tabIndex: p = 0,
    children: u,
    onChange: s,
    ...v
  } = d, { value: r, setValue: x } = w({
    name: l,
    initialValue: f,
    onChange(g, y) {
      s == null || s(g, i !== void 0 ? i : y);
    }
  });
  return /* @__PURE__ */ c(
    "label",
    {
      className: b(m, "relative flex items-center gap-8", {
        "text-grey": a
      }),
      children: [
        /* @__PURE__ */ c("span", { className: "relative", children: [
          /* @__PURE__ */ e(
            "input",
            {
              ...v,
              name: l,
              "data-testid": h,
              type: "radio",
              tabIndex: p,
              onChange: () => {
                !a && x(!r);
              },
              defaultChecked: r,
              "data-name": "Radio",
              disabled: a,
              value: i
            }
          ),
          /* @__PURE__ */ e("span", { style: { height: t, width: t }, children: /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", width: t * 2 / 3, className: "overflow-visible", children: /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "8px", style: { fill: "hsl(var(--color-saffron))" } }) }) })
        ] }),
        u
      ]
    }
  );
}
export {
  R as Radio
};
//# sourceMappingURL=Radio.js.map