@pdf-viewer/react 1.17.0-beta.0 → 1.17.0-beta.1

package/dist/components/ui/Checkbox.js

@@ -1,13 +1,13 @@
 import { jsx as i, jsxs as w, Fragment as U } from "react/jsx-runtime";
 import * as s 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-35c7f4a2.js";
+import { c as z, u as B, P as y, a as S, b as G, d as K, e as X } from "../../index-c9a2990a.js";
 import { CheckIcon as J } from "../icons/CheckIcon.js";
 import "react-dom";
 function Q(e) {
   const r = s.useRef({ value: e, previous: e });
   return s.useMemo(() => (r.current.value !== e && (r.current.previous = r.current.value, r.current.value = e), r.current.previous), [e]);
 }
-var g = "Checkbox", [V, oe] = z(g), [W, P] = V(g);
+var g = "Checkbox", [V, oe] = z(g), [W, E] = V(g);
 function Y(e) {
   const {
     __scopeCheckbox: r,
@@ -15,29 +15,29 @@ function Y(e) {
     children: d,
     defaultChecked: n,
     disabled: t,
-    form: h,
+    form: u,
     name: f,
-    onCheckedChange: u,
+    onCheckedChange: l,
     required: k,
     value: C = "on",
     // @ts-expect-error
-    internal_do_not_use_render: l
-  } = e, [p, v] = X({
+    internal_do_not_use_render: p
+  } = e, [h, v] = X({
     prop: o,
     defaultProp: n ?? !1,
-    onChange: u,
+    onChange: l,
     caller: g
-  }), [m, x] = s.useState(null), [_, c] = s.useState(null), a = s.useRef(!1), I = m ? !!h || !!m.closest("form") : (
+  }), [m, x] = s.useState(null), [_, c] = s.useState(null), a = s.useRef(!1), I = m ? !!u || !!m.closest("form") : (
     // We set this to true by default so that events bubble to forms without JS (SSR)
     !0
   ), R = {
-    checked: p,
+    checked: h,
     disabled: t,
     setChecked: v,
     control: m,
     setControl: x,
     name: f,
-    form: h,
+    form: u,
     value: C,
     hasConsumerStoppedPropagationRef: a,
     required: k,
@@ -51,7 +51,7 @@ function Y(e) {
     {
       scope: r,
       ...R,
-      children: Z(l) ? l(R) : d
+      children: Z(p) ? p(R) : d
     }
   );
 }
@@ -59,40 +59,40 @@ var M = "CheckboxTrigger", T = s.forwardRef(
   ({ __scopeCheckbox: e, onKeyDown: r, onClick: o, ...d }, n) => {
     const {
       control: t,
-      value: h,
+      value: u,
       disabled: f,
-      checked: u,
+      checked: l,
       required: k,
       setControl: C,
-      setChecked: l,
-      hasConsumerStoppedPropagationRef: p,
+      setChecked: p,
+      hasConsumerStoppedPropagationRef: h,
       isFormControl: v,
       bubbleInput: m
-    } = P(M, e), x = B(n, C), _ = s.useRef(u);
+    } = E(M, e), x = B(n, C), _ = s.useRef(l);
     return s.useEffect(() => {
       const c = t == null ? void 0 : t.form;
       if (c) {
-        const a = () => l(_.current);
+        const a = () => p(_.current);
         return c.addEventListener("reset", a), () => c.removeEventListener("reset", a);
       }
-    }, [t, l]), /* @__PURE__ */ i(
-      E.button,
+    }, [t, p]), /* @__PURE__ */ i(
+      y.button,
       {
         type: "button",
         role: "checkbox",
-        "aria-checked": b(u) ? "mixed" : u,
+        "aria-checked": b(l) ? "mixed" : l,
         "aria-required": k,
-        "data-state": O(u),
+        "data-state": j(l),
         "data-disabled": f ? "" : void 0,
         disabled: f,
-        value: h,
+        value: u,
         ...d,
         ref: x,
         onKeyDown: S(r, (c) => {
           c.key === "Enter" && c.preventDefault();
         }),
         onClick: S(o, (c) => {
-          l((a) => b(a) ? !0 : !a), m && v && (p.current = c.isPropagationStopped(), p.current || c.stopPropagation());
+          p((a) => b(a) ? !0 : !a), m && v && (h.current = c.isPropagationStopped(), h.current || c.stopPropagation());
         })
       }
     );
@@ -106,12 +106,12 @@ var q = s.forwardRef(
       name: d,
       checked: n,
       defaultChecked: t,
-      required: h,
+      required: u,
       disabled: f,
-      value: u,
+      value: l,
       onCheckedChange: k,
       form: C,
-      ...l
+      ...p
     } = e;
     return /* @__PURE__ */ i(
       Y,
@@ -120,22 +120,22 @@ var q = s.forwardRef(
         checked: n,
         defaultChecked: t,
         disabled: f,
-        required: h,
+        required: u,
         onCheckedChange: k,
         name: d,
         form: C,
-        value: u,
-        internal_do_not_use_render: ({ isFormControl: p }) => /* @__PURE__ */ w(U, { children: [
+        value: l,
+        internal_do_not_use_render: ({ isFormControl: h }) => /* @__PURE__ */ w(U, { children: [
           /* @__PURE__ */ i(
             T,
             {
-              ...l,
+              ...p,
               ref: r,
               __scopeCheckbox: o
             }
           ),
-          p && /* @__PURE__ */ i(
-            L,
+          h && /* @__PURE__ */ i(
+            O,
             {
               __scopeCheckbox: o
             }
@@ -148,15 +148,15 @@ var q = s.forwardRef(
 q.displayName = g;
 var A = "CheckboxIndicator", F = s.forwardRef(
   (e, r) => {
-    const { __scopeCheckbox: o, forceMount: d, ...n } = e, t = P(A, o);
+    const { __scopeCheckbox: o, forceMount: d, ...n } = e, t = E(A, o);
     return /* @__PURE__ */ i(
       G,
       {
         present: d || b(t.checked) || t.checked === !0,
         children: /* @__PURE__ */ i(
-          E.span,
+          y.span,
           {
-            "data-state": O(t.checked),
+            "data-state": j(t.checked),
             "data-disabled": t.disabled ? "" : void 0,
             ...n,
             ref: r,
@@ -168,46 +168,46 @@ var A = "CheckboxIndicator", F = s.forwardRef(
   }
 );
 F.displayName = A;
-var D = "CheckboxBubbleInput", L = s.forwardRef(
+var D = "CheckboxBubbleInput", O = s.forwardRef(
   ({ __scopeCheckbox: e, ...r }, o) => {
     const {
       control: d,
       hasConsumerStoppedPropagationRef: n,
       checked: t,
-      defaultChecked: h,
+      defaultChecked: u,
       required: f,
-      disabled: u,
+      disabled: l,
       name: k,
       value: C,
-      form: l,
-      bubbleInput: p,
+      form: p,
+      bubbleInput: h,
       setBubbleInput: v
-    } = P(D, e), m = B(o, v), x = Q(t), _ = K(d);
+    } = E(D, e), m = B(o, v), x = Q(t), _ = K(d);
     s.useEffect(() => {
-      const a = p;
+      const a = h;
       if (!a)
         return;
       const I = window.HTMLInputElement.prototype, N = Object.getOwnPropertyDescriptor(
         I,
         "checked"
-      ).set, j = !n.current;
+      ).set, H = !n.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);
+        const L = new Event("click", { bubbles: H });
+        a.indeterminate = b(t), N.call(a, b(t) ? !1 : t), a.dispatchEvent(L);
       }
-    }, [p, x, t, n]);
+    }, [h, x, t, n]);
     const c = s.useRef(b(t) ? !1 : t);
     return /* @__PURE__ */ i(
-      E.input,
+      y.input,
       {
         type: "checkbox",
         "aria-hidden": !0,
-        defaultChecked: h ?? c.current,
+        defaultChecked: u ?? c.current,
         required: f,
-        disabled: u,
+        disabled: l,
         name: k,
         value: C,
-        form: l,
+        form: p,
         ...r,
         tabIndex: -1,
         ref: m,
@@ -227,17 +227,17 @@ var D = "CheckboxBubbleInput", L = s.forwardRef(
     );
   }
 );
-L.displayName = D;
+O.displayName = D;
 function Z(e) {
   return typeof e == "function";
 }
 function b(e) {
   return e === "indeterminate";
 }
-function O(e) {
+function j(e) {
   return b(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
-const y = {
+const P = {
   "rp-checkbox": "_rp-checkbox_1vwg8_1",
   "rp-checkbox-indicator": "_rp-checkbox-indicator_1vwg8_25"
 }, ne = ({
@@ -245,21 +245,28 @@ const y = {
   value: r,
   name: o,
   onChange: d,
-  tabIndex: n
-}) => /* @__PURE__ */ w("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
-  /* @__PURE__ */ i(
-    q,
-    {
-      tabIndex: n,
-      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 })
-] });
+  tabIndex: n,
+  "aria-label": t
+}) => {
+  const u = t ? { "aria-label": t } : {};
+  return /* @__PURE__ */ w("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
+    /* @__PURE__ */ i(
+      q,
+      {
+        tabIndex: n,
+        className: P["rp-checkbox"],
+        checked: r,
+        id: o,
+        onCheckedChange: d,
+        role: "checkbox",
+        "aria-checked": r,
+        ...u,
+        children: /* @__PURE__ */ i(F, { className: P["rp-checkbox-indicator"], "aria-hidden": "true", children: /* @__PURE__ */ i(J, {}) })
+      }
+    ),
+    /* @__PURE__ */ i("label", { className: P["rp-checkbox-label"], htmlFor: o, children: e })
+  ] });
+};
 export {
   ne as UICheckbox
 };

package/dist/components/ui/DropDown.js

@@ -1,10 +1,10 @@
 import { jsxs as p, jsx as d } from "react/jsx-runtime";
-import { R as l, T as c, P as _, C as m } from "../../index-f563c6f0.js";
+import { R as l, T as c, P as _, C as m } from "../../index-a48ec088.js";
 import { c as A } from "../../clsx-0c6e471a.js";
 import "react";
-import "../../index-35c7f4a2.js";
+import "../../index-c9a2990a.js";
 import "react-dom";
-import "../../floating-ui.react-dom-6b2fe0df.js";
+import "../../index-808ea7bf.js";
 const F = "_slideDownAndFade_1vzkq_1", w = "_slideLeftAndFade_1vzkq_1", f = "_slideUpAndFade_1vzkq_1", g = "_slideRightAndFade_1vzkq_1", h = {
   "rp-dropdown-content": "_rp-dropdown-content_1vzkq_1",
   slideDownAndFade: F,

package/dist/components/ui/Input.js

@@ -1,25 +1,26 @@
 import { jsxs as a, jsx as i } from "react/jsx-runtime";
-import { c as e } from "../../clsx-0c6e471a.js";
-import { withRef as u } from "../../utils/withRef.js";
+import { c as u } from "../../clsx-0c6e471a.js";
+import { withRef as l } from "../../utils/withRef.js";
 import "react";
-const r = {
+const t = {
   "rp-input": "_rp-input_3rj4v_1",
   "rp-input-wrapper": "_rp-input-wrapper_3rj4v_22",
   "rp-input-icon": "_rp-input-icon_3rj4v_26"
-}, h = u((n, t) => {
-  const { className: s, icon: p, children: o, ...c } = n;
-  return /* @__PURE__ */ a("div", { className: r["rp-input-wrapper"], children: [
+}, h = l((n, e) => {
+  const { className: o, icon: p, children: s, ...r } = n, c = r.role || (r.type === "text" || !r.type ? "textbox" : void 0);
+  return /* @__PURE__ */ a("div", { className: t["rp-input-wrapper"], children: [
     /* @__PURE__ */ i(
       "input",
       {
-        ...c,
+        ...r,
+        role: c,
         "data-icon": !!p,
-        ref: t,
-        className: e(s, r["rp-input"], "ignore-hover")
+        ref: e,
+        className: u(o, t["rp-input"], "ignore-hover")
       }
     ),
-    p && /* @__PURE__ */ i("span", { className: r["rp-input-icon"], children: p }),
-    o
+    p && /* @__PURE__ */ i("span", { className: t["rp-input-icon"], "aria-hidden": "true", children: p }),
+    s
   ] });
 });
 export {

package/dist/components/ui/LoadingIndicator.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import { q as Fr } from "../../ToolbarLayout.module-0245d511.js";
+import { q as Gr } from "../../ToolbarLayout.module-00eddd49.js";
 import "../../clsx-0c6e471a.js";
 import "../../contexts/LocalizationContext.js";
 import "react";
@@ -73,17 +73,18 @@ import "../icons/LightPdfIcon.js";
 import "../icons/DarkPdfIcon.js";
 import "../../utils/hooks/useLocalization.js";
 import "../../LayoutWrapper-3f4d0a19.js";
+import "../layout/SkipLink.js";
 import "../../SearchCloseButton-08d57275.js";
 import "./RPTooltip.js";
-import "../../index-35c7f4a2.js";
+import "../../index-c9a2990a.js";
 import "react-dom";
-import "../../floating-ui.react-dom-6b2fe0df.js";
+import "../../index-808ea7bf.js";
 import "../icons/CloseIcon.js";
 import "./Checkbox.js";
 import "../icons/CheckIcon.js";
 import "../../contexts/IconContext.js";
 import "./DropDown.js";
-import "../../index-f563c6f0.js";
+import "../../index-a48ec088.js";
 import "../layout/toolbar/MenuItem.js";
 import "../layout/toolbar/MenuSeparator.js";
 import "../../utils/dateFormatter.js";
@@ -136,5 +137,5 @@ import "../../utils/zoom.js";
 import "../icons/SearchIcon.js";
 import "../icons/ClearIcon.js";
 export {
-  Fr as default
+  Gr as default
 };

package/dist/components/ui/PasswordModal.js

@@ -1,12 +1,12 @@
-import { jsx as p, jsxs as t } from "react/jsx-runtime";
+import { jsx as o, jsxs as t } from "react/jsx-runtime";
 import { useState as u } from "react";
-import { c as o } from "../../clsx-0c6e471a.js";
-import { useLocalizationContext as c } from "../../contexts/LocalizationContext.js";
-import { useDocumentPasswordContext as _ } from "../../contexts/DocumentPasswordContext.js";
+import { c as a } from "../../clsx-0c6e471a.js";
+import { useLocalizationContext as _ } from "../../contexts/LocalizationContext.js";
+import { useDocumentPasswordContext as c } from "../../contexts/DocumentPasswordContext.js";
 import "../../utils/appConsole.js";
 import "../../utils/hooks/useLocalization.js";
 import "../../th_TH-d1686d95.js";
-const r = {
+const s = {
   "rp-password-overlay": "_rp-password-overlay_18s56_1",
   "rp-password-modal": "_rp-password-modal_18s56_13",
   "rp-password-title": "_rp-password-title_18s56_27",
@@ -16,46 +16,60 @@ const r = {
   "rp-password-input-invalid": "_rp-password-input-invalid_18s56_62",
   "rp-password-message-invalid": "_rp-password-message-invalid_18s56_66",
   "rp-password-submit-button": "_rp-password-submit-button_18s56_72"
-}, y = () => {
-  const [a, m] = u(""), { localeMessages: s } = c(), { setPassword: e, invalidPassword: i } = _(), w = (d) => {
-    m(d.target.value);
-  }, n = (d) => {
-    d.preventDefault(), a && a.trim() && e(a);
-  }, l = !a.trim();
-  return /* @__PURE__ */ p("div", { className: o(r["rp-password-overlay"]), children: /* @__PURE__ */ t("div", { className: o(r["rp-password-modal"]), children: [
-    /* @__PURE__ */ p("div", { className: o(r["rp-password-title"]), children: s == null ? void 0 : s.passwordModalTitle }),
-    /* @__PURE__ */ p("div", { className: o(r["rp-password-content"]), children: s == null ? void 0 : s.passwordModalMessage }),
+}, x = () => {
+  const [d, e] = u(""), { localeMessages: r } = _(), { setPassword: l, invalidPassword: p } = c(), m = (i) => {
+    e(i.target.value);
+  }, n = (i) => {
+    i.preventDefault(), d && d.trim() && l(d);
+  }, w = !d.trim();
+  return /* @__PURE__ */ o("div", { className: a(s["rp-password-overlay"]), role: "dialog", "aria-modal": "true", "aria-labelledby": "password-modal-title", children: /* @__PURE__ */ t("div", { className: a(s["rp-password-modal"]), children: [
+    /* @__PURE__ */ o("div", { id: "password-modal-title", className: a(s["rp-password-title"]), children: r == null ? void 0 : r.passwordModalTitle }),
+    /* @__PURE__ */ o("div", { className: a(s["rp-password-content"]), children: r == null ? void 0 : r.passwordModalMessage }),
     /* @__PURE__ */ t("form", { onSubmit: n, children: [
-      /* @__PURE__ */ t("div", { className: o(r["rp-password-form"]), children: [
-        /* @__PURE__ */ p(
+      /* @__PURE__ */ t("div", { className: a(s["rp-password-form"]), children: [
+        /* @__PURE__ */ o(
           "input",
           {
             type: "password",
-            value: a,
-            onChange: w,
-            className: o(
-              r["rp-password-input"],
-              i && r["rp-password-input-invalid"]
+            value: d,
+            onChange: m,
+            className: a(
+              s["rp-password-input"],
+              p && s["rp-password-input-invalid"]
             ),
-            placeholder: s == null ? void 0 : s.passwordPlaceholder,
-            autoComplete: "off"
+            placeholder: r == null ? void 0 : r.passwordPlaceholder,
+            autoComplete: "off",
+            "aria-label": r == null ? void 0 : r.passwordPlaceholder,
+            "aria-required": "true",
+            "aria-invalid": p,
+            "aria-describedby": p ? "password-error" : void 0
           }
         ),
-        /* @__PURE__ */ p("div", { className: o(r["rp-password-message-invalid"]), children: i && /* @__PURE__ */ p("span", { children: s == null ? void 0 : s.passwordError }) })
+        /* @__PURE__ */ o(
+          "div",
+          {
+            id: "password-error",
+            className: a(s["rp-password-message-invalid"]),
+            role: "alert",
+            "aria-live": "polite",
+            children: p && /* @__PURE__ */ o("span", { children: r == null ? void 0 : r.passwordError })
+          }
+        )
       ] }),
-      /* @__PURE__ */ p(
+      /* @__PURE__ */ o(
         "button",
         {
           type: "submit",
-          disabled: l,
-          className: o(r["rp-password-submit-button"]),
+          disabled: w,
+          className: a(s["rp-password-submit-button"]),
           onClick: n,
-          children: s == null ? void 0 : s.passwordConfirmLabel
+          "aria-label": r == null ? void 0 : r.passwordConfirmLabel,
+          children: r == null ? void 0 : r.passwordConfirmLabel
         }
       )
     ] })
   ] }) });
 };
 export {
-  y as default
+  x as default
 };