@pdf-viewer/react
Version:
A react-pdf-viewer component for React and Next.js. Suitable for react-pdf document.
254 lines (253 loc) • 6.63 kB
JavaScript
import { jsx as i, jsxs as w, Fragment as U } from "react/jsx-runtime";
import * as c from "react";
import { c as z, u as B, P as E, a as S, b as G, d as K, e as X } from "../../index-6e0e48fa.js";
import { CheckIcon as J } 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 I = "Checkbox", [V, re] = z(I), [W, P] = V(I);
function Y(e) {
const {
__scopeCheckbox: r,
checked: o,
children: d,
defaultChecked: s,
disabled: t,
form: f,
name: h,
onCheckedChange: u,
required: k,
value: C = "on",
// @ts-expect-error
internal_do_not_use_render: l
} = e, [p, v] = X({
prop: o,
defaultProp: s ?? !1,
onChange: u,
caller: I
}), [m, x] = c.useState(null), [_, n] = c.useState(null), a = c.useRef(!1), R = m ? !!f || !!m.closest("form") : (
// We set this to true by default so that events bubble to forms without JS (SSR)
!0
), g = {
checked: p,
disabled: t,
setChecked: v,
control: m,
setControl: x,
name: h,
form: f,
value: C,
hasConsumerStoppedPropagationRef: a,
required: k,
defaultChecked: b(s) ? !1 : s,
isFormControl: R,
bubbleInput: _,
setBubbleInput: n
};
return /* @__PURE__ */ i(
W,
{
scope: r,
...g,
children: Z(l) ? l(g) : d
}
);
}
var M = "CheckboxTrigger", T = c.forwardRef(
({ __scopeCheckbox: e, onKeyDown: r, onClick: o, ...d }, s) => {
const {
control: t,
value: f,
disabled: h,
checked: u,
required: k,
setControl: C,
setChecked: l,
hasConsumerStoppedPropagationRef: p,
isFormControl: v,
bubbleInput: m
} = P(M, e), x = B(s, C), _ = c.useRef(u);
return c.useEffect(() => {
const n = t == null ? void 0 : t.form;
if (n) {
const a = () => l(_.current);
return n.addEventListener("reset", a), () => n.removeEventListener("reset", a);
}
}, [t, l]), /* @__PURE__ */ i(
E.button,
{
type: "button",
role: "checkbox",
"aria-checked": b(u) ? "mixed" : u,
"aria-required": k,
"data-state": O(u),
"data-disabled": h ? "" : void 0,
disabled: h,
value: f,
...d,
ref: x,
onKeyDown: S(r, (n) => {
n.key === "Enter" && n.preventDefault();
}),
onClick: S(o, (n) => {
l((a) => b(a) ? !0 : !a), m && v && (p.current = n.isPropagationStopped(), p.current || n.stopPropagation());
})
}
);
}
);
T.displayName = M;
var q = c.forwardRef(
(e, r) => {
const {
__scopeCheckbox: o,
name: d,
checked: s,
defaultChecked: t,
required: f,
disabled: h,
value: u,
onCheckedChange: k,
form: C,
...l
} = e;
return /* @__PURE__ */ i(
Y,
{
__scopeCheckbox: o,
checked: s,
defaultChecked: t,
disabled: h,
required: f,
onCheckedChange: k,
name: d,
form: C,
value: u,
internal_do_not_use_render: ({ isFormControl: p }) => /* @__PURE__ */ w(U, { children: [
/* @__PURE__ */ i(
T,
{
...l,
ref: r,
__scopeCheckbox: o
}
),
p && /* @__PURE__ */ i(
L,
{
__scopeCheckbox: o
}
)
] })
}
);
}
);
q.displayName = I;
var A = "CheckboxIndicator", F = c.forwardRef(
(e, r) => {
const { __scopeCheckbox: o, forceMount: d, ...s } = e, t = P(A, o);
return /* @__PURE__ */ i(
G,
{
present: d || b(t.checked) || t.checked === !0,
children: /* @__PURE__ */ i(
E.span,
{
"data-state": O(t.checked),
"data-disabled": t.disabled ? "" : void 0,
...s,
ref: r,
style: { pointerEvents: "none", ...e.style }
}
)
}
);
}
);
F.displayName = A;
var D = "CheckboxBubbleInput", L = c.forwardRef(
({ __scopeCheckbox: e, ...r }, o) => {
const {
control: d,
hasConsumerStoppedPropagationRef: s,
checked: t,
defaultChecked: f,
required: h,
disabled: u,
name: k,
value: C,
form: l,
bubbleInput: p,
setBubbleInput: v
} = P(D, e), m = B(o, v), x = Q(t), _ = K(d);
c.useEffect(() => {
const a = p;
if (!a)
return;
const R = window.HTMLInputElement.prototype, N = Object.getOwnPropertyDescriptor(
R,
"checked"
).set, j = !s.current;
if (x !== t && N) {
const H = new Event("click", { bubbles: j });
a.indeterminate = b(t), N.call(a, b(t) ? !1 : t), a.dispatchEvent(H);
}
}, [p, x, t, s]);
const n = c.useRef(b(t) ? !1 : t);
return /* @__PURE__ */ i(
E.input,
{
type: "checkbox",
"aria-hidden": !0,
defaultChecked: f ?? n.current,
required: h,
disabled: u,
name: k,
value: C,
form: l,
...r,
tabIndex: -1,
ref: m,
style: {
...r.style,
..._,
position: "absolute",
pointerEvents: "none",
opacity: 0,
margin: 0,
// We transform because the input is absolutely positioned but we have
// rendered it **after** the button. This pulls it back to sit on top
// of the button.
transform: "translateX(-100%)"
}
}
);
}
);
L.displayName = D;
function Z(e) {
return typeof e == "function";
}
function b(e) {
return e === "indeterminate";
}
function O(e) {
return b(e) ? "indeterminate" : e ? "checked" : "unchecked";
}
const y = {
"rp-checkbox": "_rp-checkbox_3f10x_1",
"rp-checkbox-indicator": "_rp-checkbox-indicator_3f10x_21"
}, oe = ({
children: e,
value: r,
name: o,
onChange: d
}) => /* @__PURE__ */ w("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
/* @__PURE__ */ i(q, { className: y["rp-checkbox"], checked: r, id: o, onCheckedChange: d, children: /* @__PURE__ */ i(F, { className: y["rp-checkbox-indicator"], children: /* @__PURE__ */ i(J, {}) }) }),
/* @__PURE__ */ i("label", { className: y["rp-checkbox-label"], htmlFor: o, children: e })
] });
export {
oe as UICheckbox
};