@clubmed/trident-ui/ui/forms/checkboxes/Checkboxes.js

Shared ClubMed React UI components

import { jsx as I } from "react/jsx-runtime";
import { useId as N, Children as v, isValidElement as g, cloneElement as h } from "react";
import { useValue as k } from "../../hooks/useValue.js";
import { c as E } from "../../../chunks/clsx.js";
function q(i) {
  const m = N(), {
    id: r = m,
    name: n = r,
    children: u,
    value: c,
    defaultValue: p,
    onChange: d,
    disabled: f,
    readOnly: V,
    tabIndex: x = 0,
    ...s
  } = i, { value: t, setValue: o } = k({
    name: n,
    initialValue: c,
    formatter(e) {
      return e !== void 0 ? [].concat(e) : e;
    },
    defaultValue: p || [],
    onChange: d
  });
  return /* @__PURE__ */ I("div", { ...s, className: s.className, role: "listbox", children: v.map(u, (e, l) => {
    if (g(e)) {
      const a = e.props.value;
      return h(e, {
        ...e.props,
        name: n,
        id: `${r}-${l}`,
        disabled: f,
        readOnly: V,
        tabIndex: x + l + 1,
        className: E(e.props.className || "mt-8 first:mt-0"),
        checked: t.includes(a),
        onChange($, b) {
          o(b === null ? t.filter((C) => C !== a) : t.concat(a));
        }
      });
    }
    return e;
  }) });
}
export {
  q as Checkboxes
};
//# sourceMappingURL=Checkboxes.js.map