@pdf-viewer/react/dist/components/ui/Checkbox.js

The PDF Viewer component for React and Next.js

import { jsxs as g, jsx as s } from "react/jsx-runtime";
import * as c from "react";
import { e as j, a as A, f as B, P as S, c as _, g as H, h as K } from "../../index-1cb41342.js";
import { CheckIcon as L } from "../icons/CheckIcon.js";
import '../../assets/Checkbox.css';function q(e) {
  const r = c.useRef({ value: e, previous: e });
  return c.useMemo(() => (r.current.value !== e && (r.current.previous = r.current.value, r.current.value = e), r.current.previous), [e]);
}
var E = "Checkbox", [z, W] = j(E), [F, T] = z(E), w = c.forwardRef(
  (e, r) => {
    const {
      __scopeCheckbox: t,
      name: a,
      checked: p,
      defaultChecked: n,
      required: h,
      disabled: u,
      value: b = "on",
      onCheckedChange: m,
      form: l,
      ...x
    } = e, [i, C] = c.useState(null), v = A(r, (o) => C(o)), y = c.useRef(!1), I = i ? l || !!i.closest("form") : !0, [f = !1, P] = B({
      prop: p,
      defaultProp: n,
      onChange: m
    }), O = c.useRef(f);
    return c.useEffect(() => {
      const o = i == null ? void 0 : i.form;
      if (o) {
        const k = () => P(O.current);
        return o.addEventListener("reset", k), () => o.removeEventListener("reset", k);
      }
    }, [i, P]), /* @__PURE__ */ g(F, { scope: t, state: f, disabled: u, children: [
      /* @__PURE__ */ s(
        S.button,
        {
          type: "button",
          role: "checkbox",
          "aria-checked": d(f) ? "mixed" : f,
          "aria-required": h,
          "data-state": M(f),
          "data-disabled": u ? "" : void 0,
          disabled: u,
          value: b,
          ...x,
          ref: v,
          onKeyDown: _(e.onKeyDown, (o) => {
            o.key === "Enter" && o.preventDefault();
          }),
          onClick: _(e.onClick, (o) => {
            P((k) => d(k) ? !0 : !k), I && (y.current = o.isPropagationStopped(), y.current || o.stopPropagation());
          })
        }
      ),
      I && /* @__PURE__ */ s(
        X,
        {
          control: i,
          bubbles: !y.current,
          name: a,
          value: b,
          checked: f,
          required: h,
          disabled: u,
          form: l,
          style: { transform: "translateX(-100%)" },
          defaultChecked: d(n) ? !1 : n
        }
      )
    ] });
  }
);
w.displayName = E;
var N = "CheckboxIndicator", D = c.forwardRef(
  (e, r) => {
    const { __scopeCheckbox: t, forceMount: a, ...p } = e, n = T(N, t);
    return /* @__PURE__ */ s(H, { present: a || d(n.state) || n.state === !0, children: /* @__PURE__ */ s(
      S.span,
      {
        "data-state": M(n.state),
        "data-disabled": n.disabled ? "" : void 0,
        ...p,
        ref: r,
        style: { pointerEvents: "none", ...e.style }
      }
    ) });
  }
);
D.displayName = N;
var X = (e) => {
  const { control: r, checked: t, bubbles: a = !0, defaultChecked: p, ...n } = e, h = c.useRef(null), u = q(t), b = K(r);
  c.useEffect(() => {
    const l = h.current, x = window.HTMLInputElement.prototype, C = Object.getOwnPropertyDescriptor(x, "checked").set;
    if (u !== t && C) {
      const v = new Event("click", { bubbles: a });
      l.indeterminate = d(t), C.call(l, d(t) ? !1 : t), l.dispatchEvent(v);
    }
  }, [u, t, a]);
  const m = c.useRef(d(t) ? !1 : t);
  return /* @__PURE__ */ s(
    "input",
    {
      type: "checkbox",
      "aria-hidden": !0,
      defaultChecked: p ?? m.current,
      ...n,
      tabIndex: -1,
      ref: h,
      style: {
        ...e.style,
        ...b,
        position: "absolute",
        pointerEvents: "none",
        opacity: 0,
        margin: 0
      }
    }
  );
};
function d(e) {
  return e === "indeterminate";
}
function M(e) {
  return d(e) ? "indeterminate" : e ? "checked" : "unchecked";
}
var U = w, G = D;
const R = {
  "rp-checkbox": "_rp-checkbox_3f10x_1",
  "rp-checkbox-indicator": "_rp-checkbox-indicator_3f10x_21"
}, Y = ({
  children: e,
  value: r,
  name: t,
  onChange: a
}) => /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
  /* @__PURE__ */ s(U, { className: R["rp-checkbox"], checked: r, id: t, onCheckedChange: a, children: /* @__PURE__ */ s(G, { className: R["rp-checkbox-indicator"], children: /* @__PURE__ */ s(L, {}) }) }),
  /* @__PURE__ */ s("label", { className: R["rp-checkbox-label"], htmlFor: t, children: e })
] });
export {
  Y as UICheckbox
};