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

package/dist/components/layout/toolbar/tools/more-options/FullScreenTool.js

@@ -1,10 +1,10 @@
-import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { MenuItem as c } from "../../MenuItem.js";
-import u from "../../../../ui/RPTooltip.js";
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import { MenuItem as u } from "../../MenuItem.js";
+import c from "../../../../ui/RPTooltip.js";
 import { FullScreenIcon as f } from "../../../../icons/FullScreenIcon.js";
-import { useViewportContext as s } from "../../../../../contexts/ViewportContext.js";
-import { useFullScreenContext as S } from "../../../../../contexts/FullScreenContext.js";
-import { useLocalizationContext as d } from "../../../../../contexts/LocalizationContext.js";
+import { useViewportContext as S } from "../../../../../contexts/ViewportContext.js";
+import { useFullScreenContext as d } from "../../../../../contexts/FullScreenContext.js";
+import { useLocalizationContext as x } from "../../../../../contexts/LocalizationContext.js";
 import "../../../../../index-a48ec088.js";
 import "react";
 import "../../../../../index-c9a2990a.js";
@@ -16,16 +16,24 @@ import "../../../../../contexts/LayoutContainerContext.js";
 import "../../../../../utils/hooks/useFullScreen.js";
 import "../../../../../utils/appConsole.js";
 import "../../../../../utils/hooks/useLocalization.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 const y = (m) => {
-  const { icon: r, isToolVisible: e = !0 } = m, { toggleFullScreen: n, isSupported: p } = S(), { isSmallScreen: i } = s(), { localeMessages: o } = d();
+  const { icon: t, isToolVisible: e = !0 } = m, { toggleFullScreen: n, isSupported: p } = d(), { isSmallScreen: i } = S(), { localeMessages: o } = x();
   if (!e || !i)
     return null;
   if (i)
-    return /* @__PURE__ */ t(c, { onClick: n, disabled: !p, children: /* @__PURE__ */ l(u, { className: "rp-menu-item", content: o == null ? void 0 : o.fullScreenTooltip, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: r || /* @__PURE__ */ t(f, {}) }),
-      o == null ? void 0 : o.fullScreenTooltip
-    ] }) });
+    return /* @__PURE__ */ r(
+      u,
+      {
+        onClick: n,
+        disabled: !p,
+        "aria-label": o == null ? void 0 : o.fullScreenTooltip,
+        children: /* @__PURE__ */ l(c, { className: "rp-menu-item", content: o == null ? void 0 : o.fullScreenTooltip, children: [
+          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: t || /* @__PURE__ */ r(f, { "aria-hidden": "true" }) }),
+          o == null ? void 0 : o.fullScreenTooltip
+        ] })
+      }
+    );
 };
 export {
   y as FullScreenTool

package/dist/components/layout/toolbar/tools/more-options/MostPageTool.js

@@ -1,9 +1,9 @@
-import { jsxs as p, jsx as t } from "react/jsx-runtime";
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
 import { MenuItem as a } from "../../MenuItem.js";
-import s from "../../../../ui/RPTooltip.js";
-import { u as C, s as G } from "../../../../../ToolbarLayout.module-89b2bf85.js";
+import l from "../../../../ui/RPTooltip.js";
+import { u as C, s as G } from "../../../../../ToolbarLayout.module-00eddd49.js";
 import { G as L } from "../../../../../index-a48ec088.js";
-import { useMemo as l, useCallback as c } from "react";
+import { useMemo as d, useCallback as s } from "react";
 import "../../../../../contexts/RPDocumentContext.js";
 import "../../../../../contexts/DocumentPasswordContext.js";
 import "../../../../../contexts/DarkModeContext.js";
@@ -43,7 +43,8 @@ import "../../../../../contexts/ToolbarComponentContext.js";
 import "../../../sidebar/RPSplitter.js";
 import "../../../WrapperLayout.js";
 import "../../../../RPDropFileZone.js";
-import "../../../../../LayoutWrapper-6224491f.js";
+import "../../../../../LayoutWrapper-3f4d0a19.js";
+import "../../../SkipLink.js";
 import "../../../../ui/Button.js";
 import "../../../../../SearchCloseButton-08d57275.js";
 import "../../../../ui/Input.js";
@@ -55,7 +56,7 @@ import { MenuSeparator as v } from "../../MenuSeparator.js";
 import "../../../../../utils/dateFormatter.js";
 import "../../PropertyItem.js";
 import "../../../../../RotateTool.module-67946714.js";
-import { GoToDownIcon as d } from "../../../../icons/GoToDownIcon.js";
+import { GoToDownIcon as c } from "../../../../icons/GoToDownIcon.js";
 import "../../../../../clsx-0c6e471a.js";
 import "../../../../../index-c9a2990a.js";
 import "react-dom";
@@ -63,7 +64,7 @@ import "../../../../../index-808ea7bf.js";
 import "../../../../../utils/withRef.js";
 import "../../../../icons/ChevronUpIcon.js";
 import "../../../../../utils/types.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../utils/highlight.js";
 import "../../../../../utils/charators.js";
 import "../../../../../utils/Queue.js";
@@ -112,6 +113,7 @@ import "../../../../icons/ClockwiseIcon.js";
 import "../../../../../utils/hooks/useRotate.js";
 import "../../ViewModeTool.js";
 import "../../../../icons/DualPageIcon.js";
+import "../../../../icons/DualPageWithCoverIcon.js";
 import "../../../../icons/SinglePageIcon.js";
 import "../../../../icons/CheckIcon.js";
 import "../../ScrollModeTool.js";
@@ -134,24 +136,40 @@ import "../../../../icons/ClearIcon.js";
 import "../../../../../utils/hooks/useHighlight.js";
 import "../../../../icons/LightPdfIcon.js";
 import "../../../../icons/DarkPdfIcon.js";
-const u = { width: "100%" }, ti = (f) => {
-  const { icons: P, isToolVisible: h = !0 } = f, { firstPageIcon: e, lastPageIcon: n } = P ?? {}, { goToPage: i, totalPages: r, focusedPage: m } = C(), { localeMessages: o } = N(), T = l(() => m === 1, [m]), g = l(() => m === r, [m, r]), b = c(() => {
+const u = { width: "100%" }, ri = (P) => {
+  const { icons: f, isToolVisible: h = !0 } = P, { firstPageIcon: n, lastPageIcon: e } = f ?? {}, { goToPage: i, totalPages: r, focusedPage: m } = C(), { localeMessages: t } = N(), T = d(() => m === 1, [m]), b = d(() => m === r, [m, r]), g = s(() => {
     i(1);
-  }, [i]), x = c(() => {
+  }, [i]), x = s(() => {
     i(r);
   }, [i, r]);
   return h ? /* @__PURE__ */ p(L, { children: [
-    /* @__PURE__ */ t(a, { onClick: b, children: /* @__PURE__ */ t(s, { content: o == null ? void 0 : o.firstPageTooltip, style: u, children: /* @__PURE__ */ p("div", { className: "rp-menu-item", "aria-disabled": T, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: e || /* @__PURE__ */ t(d, { className: G["rp-go-to-Top"] }) }),
-      /* @__PURE__ */ t("span", { children: o == null ? void 0 : o.firstPageLabel })
-    ] }) }) }),
-    /* @__PURE__ */ t(a, { onClick: x, children: /* @__PURE__ */ t(s, { content: o == null ? void 0 : o.lastPageTooltip, style: u, children: /* @__PURE__ */ p("div", { className: "rp-menu-item", "aria-disabled": g, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: n || /* @__PURE__ */ t(d, {}) }),
-      /* @__PURE__ */ t("span", { children: o == null ? void 0 : o.lastPageLabel })
-    ] }) }) }),
-    /* @__PURE__ */ t(v, {})
+    /* @__PURE__ */ o(
+      a,
+      {
+        onClick: g,
+        disabled: T,
+        "aria-label": t == null ? void 0 : t.firstPageTooltip,
+        children: /* @__PURE__ */ o(l, { content: t == null ? void 0 : t.firstPageTooltip, style: u, children: /* @__PURE__ */ p("div", { className: "rp-menu-item", children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: n || /* @__PURE__ */ o(c, { className: G["rp-go-to-Top"], "aria-hidden": "true" }) }),
+          /* @__PURE__ */ o("span", { children: t == null ? void 0 : t.firstPageLabel })
+        ] }) })
+      }
+    ),
+    /* @__PURE__ */ o(
+      a,
+      {
+        onClick: x,
+        disabled: b,
+        "aria-label": t == null ? void 0 : t.lastPageTooltip,
+        children: /* @__PURE__ */ o(l, { content: t == null ? void 0 : t.lastPageTooltip, style: u, children: /* @__PURE__ */ p("div", { className: "rp-menu-item", children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: e || /* @__PURE__ */ o(c, { "aria-hidden": "true" }) }),
+          /* @__PURE__ */ o("span", { children: t == null ? void 0 : t.lastPageLabel })
+        ] }) })
+      }
+    ),
+    /* @__PURE__ */ o(v, {})
   ] }) : null;
 };
 export {
-  ti as MostPageTool
+  ri as MostPageTool
 };

package/dist/components/layout/toolbar/tools/more-options/PrintTool.js

@@ -1,9 +1,9 @@
-import { jsx as o, jsxs as e } from "react/jsx-runtime";
+import { jsx as i, jsxs as e } from "react/jsx-runtime";
 import { PrintDefaultTool as l } from "../../../../icons/PrintDefaultIcon.js";
-import { c } from "../../../../../ToolbarLayout.module-89b2bf85.js";
-import { useViewportContext as f } from "../../../../../contexts/ViewportContext.js";
-import { useLocalizationContext as u } from "../../../../../contexts/LocalizationContext.js";
-import { MenuItem as s } from "../../MenuItem.js";
+import { c as u } from "../../../../../ToolbarLayout.module-00eddd49.js";
+import { useViewportContext as c } from "../../../../../contexts/ViewportContext.js";
+import { useLocalizationContext as f } from "../../../../../contexts/LocalizationContext.js";
+import { MenuItem as d } from "../../MenuItem.js";
 import x from "../../../../ui/RPTooltip.js";
 import "react";
 import "../../../../icons/ChevronUpIcon.js";
@@ -12,7 +12,7 @@ import "../../../../../clsx-0c6e471a.js";
 import "../../../../../utils/withRef.js";
 import "../../../../ui/Input.js";
 import "../../../../../utils/types.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../contexts/ScrollModeContext.js";
 import "../../../../../utils/appConsole.js";
 import "../../../../../contexts/InitialStateContext.js";
@@ -74,7 +74,8 @@ import "../../../WrapperLayout.js";
 import "../../../../RPDropFileZone.js";
 import "../../../../icons/LightPdfIcon.js";
 import "../../../../icons/DarkPdfIcon.js";
-import "../../../../../LayoutWrapper-6224491f.js";
+import "../../../../../LayoutWrapper-3f4d0a19.js";
+import "../../../SkipLink.js";
 import "../../../../../SearchCloseButton-08d57275.js";
 import "../../../../icons/CloseIcon.js";
 import "../../../../ui/Checkbox.js";
@@ -117,6 +118,7 @@ import "../../../../icons/ClockwiseIcon.js";
 import "../../../../../utils/hooks/useRotate.js";
 import "../../ViewModeTool.js";
 import "../../../../icons/DualPageIcon.js";
+import "../../../../icons/DualPageWithCoverIcon.js";
 import "../../../../icons/SinglePageIcon.js";
 import "../../ScrollModeTool.js";
 import "../../../../icons/PageScrollingIcon.js";
@@ -134,16 +136,23 @@ import "../../../../icons/ZoomOutIcon.js";
 import "../../../../../utils/zoom.js";
 import "../../../../icons/SearchIcon.js";
 import "../../../../icons/ClearIcon.js";
-const Oo = (m) => {
-  const { icon: r, isToolVisible: p = !0 } = m, { print: n } = c(), { isSmallScreen: i } = f(), { localeMessages: t } = u();
-  if (!p || !i)
+const Qi = (m) => {
+  const { icon: r, isToolVisible: p = !0 } = m, { print: n } = u(), { isSmallScreen: o } = c(), { localeMessages: t } = f();
+  if (!p || !o)
     return null;
-  if (i)
-    return /* @__PURE__ */ o(s, { onClick: n, children: /* @__PURE__ */ e(x, { className: "rp-menu-item", content: t == null ? void 0 : t.printTooltip, children: [
-      /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: r || /* @__PURE__ */ o(l, {}) }),
-      t == null ? void 0 : t.printLabel
-    ] }) });
+  if (o)
+    return /* @__PURE__ */ i(
+      d,
+      {
+        onClick: n,
+        "aria-label": t == null ? void 0 : t.printTooltip,
+        children: /* @__PURE__ */ e(x, { className: "rp-menu-item", content: t == null ? void 0 : t.printTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: r || /* @__PURE__ */ i(l, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.printLabel
+        ] })
+      }
+    );
 };
 export {
-  Oo as PrintTool
+  Qi as PrintTool
 };

package/dist/components/layout/toolbar/tools/more-options/RotateTool.js

@@ -1,12 +1,12 @@
-import { jsx as t, Fragment as C, jsxs as r } from "react/jsx-runtime";
-import { c as d } from "../../../../../RotateTool.module-67946714.js";
+import { jsx as o, Fragment as C, jsxs as r } from "react/jsx-runtime";
+import { c as k } from "../../../../../RotateTool.module-67946714.js";
 import { MenuItem as e } from "../../MenuItem.js";
 import n from "../../../../ui/RPTooltip.js";
 import { G as f } from "../../../../../index-a48ec088.js";
 import { ClockwiseIcon as p } from "../../../../icons/ClockwiseIcon.js";
-import { MenuSeparator as k } from "../../MenuSeparator.js";
-import { useRotate as h } from "../../../../../utils/hooks/useRotate.js";
-import { useLocalizationContext as w } from "../../../../../contexts/LocalizationContext.js";
+import { MenuSeparator as h } from "../../MenuSeparator.js";
+import { useRotate as w } from "../../../../../utils/hooks/useRotate.js";
+import { useLocalizationContext as s } from "../../../../../contexts/LocalizationContext.js";
 import "../../../../../clsx-0c6e471a.js";
 import "react";
 import "../../../../../index-c9a2990a.js";
@@ -20,7 +20,7 @@ import "../../../../../contexts/RPDocumentContext.js";
 import "../../../../../utils/hooks/useLoadPdf.js";
 import "pdfjs-dist";
 import "../../../../../utils/types.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../utils/getThumbnailViewport.js";
 import "../../../../../contexts/ConfigContext.js";
 import "../../../../../contexts/DocumentPasswordContext.js";
@@ -29,17 +29,31 @@ import "../../../../../utils/convertPdfDate.js";
 import "../../../../../utils/formatFileSize.js";
 import "../../../../../utils/hooks/useLocalization.js";
 const Z = (c) => {
-  const { icons: l, isToolVisible: a = !0 } = c, { rotateClockwiseIcon: i, rotateCounterClockwiseIcon: m } = l ?? {}, { handleRotateClockwise: u, handleRotateCounterclockwise: s } = h(), { localeMessages: o } = w();
-  return a ? /* @__PURE__ */ t(C, { children: /* @__PURE__ */ r(f, { children: [
-    /* @__PURE__ */ t(e, { onClick: u, children: /* @__PURE__ */ r(n, { className: "rp-menu-item", content: o == null ? void 0 : o.rotateClockwiseTooltip, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: i || /* @__PURE__ */ t(p, {}) }),
-      o == null ? void 0 : o.rotateClockwiseLabel
-    ] }) }),
-    /* @__PURE__ */ t(e, { onClick: s, children: /* @__PURE__ */ r(n, { className: "rp-menu-item", content: o == null ? void 0 : o.rotateCounterclockwiseTooltip, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: m || /* @__PURE__ */ t(p, { className: d["rp-rotate-counterclockwise"] }) }),
-      o == null ? void 0 : o.rotateCounterclockwiseLabel
-    ] }) }),
-    /* @__PURE__ */ t(k, {})
+  const { icons: l, isToolVisible: a = !0 } = c, { rotateClockwiseIcon: i, rotateCounterClockwiseIcon: m } = l ?? {}, { handleRotateClockwise: u, handleRotateCounterclockwise: d } = w(), { localeMessages: t } = s();
+  return a ? /* @__PURE__ */ o(C, { children: /* @__PURE__ */ r(f, { children: [
+    /* @__PURE__ */ o(
+      e,
+      {
+        onClick: u,
+        "aria-label": t == null ? void 0 : t.rotateClockwiseTooltip,
+        children: /* @__PURE__ */ r(n, { className: "rp-menu-item", content: t == null ? void 0 : t.rotateClockwiseTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: i || /* @__PURE__ */ o(p, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.rotateClockwiseLabel
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(
+      e,
+      {
+        onClick: d,
+        "aria-label": t == null ? void 0 : t.rotateCounterclockwiseTooltip,
+        children: /* @__PURE__ */ r(n, { className: "rp-menu-item", content: t == null ? void 0 : t.rotateCounterclockwiseTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: m || /* @__PURE__ */ o(p, { className: k["rp-rotate-counterclockwise"], "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.rotateCounterclockwiseLabel
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(h, {})
   ] }) }) : null;
 };
 export {

package/dist/components/layout/toolbar/tools/more-options/ScrollModeTool.js

@@ -1,16 +1,16 @@
-import { jsx as r, Fragment as f, jsxs as t } from "react/jsx-runtime";
-import { useMemo as N } from "react";
-import l from "../../../../ui/RPTooltip.js";
-import { G as C } from "../../../../../index-a48ec088.js";
-import { MenuItem as e } from "../../MenuItem.js";
+import { jsx as i, Fragment as C, jsxs as n } from "react/jsx-runtime";
+import { useMemo as f } from "react";
+import e from "../../../../ui/RPTooltip.js";
+import { G as R } from "../../../../../index-a48ec088.js";
+import { MenuItem as c } from "../../MenuItem.js";
 import { PageScrollingIcon as G } from "../../../../icons/PageScrollingIcon.js";
-import { VerticalScrollingIcon as R } from "../../../../icons/VerticalScrollingIcon.js";
-import { HorizontalScrollingIcon as O } from "../../../../icons/HorizontalScrollingIcon.js";
-import { useScrollModeContext as T } from "../../../../../contexts/ScrollModeContext.js";
-import { ViewMode as A, ScrollMode as i } from "../../../../../utils/types.js";
-import { CheckIcon as c } from "../../../../icons/CheckIcon.js";
-import { useViewModeContext as v } from "../../../../../contexts/ViewModeContext.js";
-import { useLocalizationContext as _ } from "../../../../../contexts/LocalizationContext.js";
+import { VerticalScrollingIcon as O } from "../../../../icons/VerticalScrollingIcon.js";
+import { HorizontalScrollingIcon as T } from "../../../../icons/HorizontalScrollingIcon.js";
+import { useScrollModeContext as A } from "../../../../../contexts/ScrollModeContext.js";
+import { ViewMode as L, ScrollMode as o } from "../../../../../utils/types.js";
+import { CheckIcon as p } from "../../../../icons/CheckIcon.js";
+import { useViewModeContext as _ } from "../../../../../contexts/ViewModeContext.js";
+import { useLocalizationContext as E } from "../../../../../contexts/LocalizationContext.js";
 import "../../../../../index-c9a2990a.js";
 import "react-dom";
 import "../../../../../index-808ea7bf.js";
@@ -18,35 +18,53 @@ import "../../../../../utils/withRef.js";
 import "../../../../../clsx-0c6e471a.js";
 import "../../../../../utils/appConsole.js";
 import "../../../../../contexts/InitialStateContext.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../utils/hooks/useLocalization.js";
-const Q = (S) => {
-  const { icons: h, isToolVisible: I = !0 } = S, { pageScrollIcon: p, verticalScrollIcon: d, horizontalScrollIcon: u } = h ?? {}, { viewMode: L } = v(), { scrollMode: n, setScrollMode: m } = T(), { localeMessages: o } = _(), a = N(() => L === A.DUAL_PAGE, [L]);
-  return I ? /* @__PURE__ */ r(f, { children: /* @__PURE__ */ t(C, { children: [
-    /* @__PURE__ */ r(e, { onClick: () => m(i.PAGE_SCROLLING), children: /* @__PURE__ */ t(l, { className: "rp-menu-item", content: o == null ? void 0 : o.pageScrollingTooltip, children: [
-      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: p || /* @__PURE__ */ r(G, {}) }),
-      o == null ? void 0 : o.pageScrollingLabel,
-      n === i.PAGE_SCROLLING ? /* @__PURE__ */ r(c, { className: "rp-menu-item-right" }) : null
-    ] }) }),
-    /* @__PURE__ */ r(e, { onClick: () => m(i.VERTICAL_SCROLLING), children: /* @__PURE__ */ t(l, { className: "rp-menu-item", content: o == null ? void 0 : o.verticalScrollingTooltip, children: [
-      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: d || /* @__PURE__ */ r(R, {}) }),
-      o == null ? void 0 : o.verticalScrollingLabel,
-      n === i.VERTICAL_SCROLLING ? /* @__PURE__ */ r(c, { className: "rp-menu-item-right" }) : null
-    ] }) }),
-    /* @__PURE__ */ r(
-      e,
+const X = (h) => {
+  const { icons: S, isToolVisible: I = !0 } = h, { pageScrollIcon: d, verticalScrollIcon: a, horizontalScrollIcon: u } = S ?? {}, { viewMode: l } = _(), { scrollMode: t, setScrollMode: m } = A(), { localeMessages: r } = E(), N = f(() => l === L.DUAL_PAGE || l === L.DUAL_PAGE_WITH_COVER, [l]);
+  return I ? /* @__PURE__ */ i(C, { children: /* @__PURE__ */ n(R, { children: [
+    /* @__PURE__ */ i(
+      c,
       {
-        disabled: a,
-        onClick: () => m(i.HORIZONTAL_SCROLLING),
-        children: /* @__PURE__ */ t(l, { className: "rp-menu-item", content: o == null ? void 0 : o.horizontalTooltip, children: [
-          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: u || /* @__PURE__ */ r(O, {}) }),
-          o == null ? void 0 : o.horizontalLabel,
-          n === i.HORIZONTAL_SCROLLING ? /* @__PURE__ */ r(c, { className: "rp-menu-item-right" }) : null
+        onClick: () => m(o.PAGE_SCROLLING),
+        "aria-label": r == null ? void 0 : r.pageScrollingTooltip,
+        "aria-checked": t === o.PAGE_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.pageScrollingTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: d || /* @__PURE__ */ i(G, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.pageScrollingLabel,
+          t === o.PAGE_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ i(
+      c,
+      {
+        onClick: () => m(o.VERTICAL_SCROLLING),
+        "aria-label": r == null ? void 0 : r.verticalScrollingTooltip,
+        "aria-checked": t === o.VERTICAL_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.verticalScrollingTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: a || /* @__PURE__ */ i(O, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.verticalScrollingLabel,
+          t === o.VERTICAL_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ i(
+      c,
+      {
+        disabled: N,
+        onClick: () => m(o.HORIZONTAL_SCROLLING),
+        "aria-label": r == null ? void 0 : r.horizontalTooltip,
+        "aria-checked": t === o.HORIZONTAL_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.horizontalTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: u || /* @__PURE__ */ i(T, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.horizontalLabel,
+          t === o.HORIZONTAL_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
         ] })
       }
     )
   ] }) }) : null;
 };
 export {
-  Q as ScrollModeTool
+  X as ScrollModeTool
 };

package/dist/components/layout/toolbar/tools/more-options/SelectionModeTool.js

@@ -1,39 +1,55 @@
-import { jsx as t, Fragment as a, jsxs as e } from "react/jsx-runtime";
-import l from "../../../../ui/RPTooltip.js";
-import { G as T } from "../../../../../index-a48ec088.js";
+import { jsx as o, Fragment as T, jsxs as e } from "react/jsx-runtime";
+import p from "../../../../ui/RPTooltip.js";
+import { G as f } from "../../../../../index-a48ec088.js";
 import { TextSelectionDefaultIcon as x } from "../../../../icons/TextSelectionDefaultIcon.js";
 import { HandModeDefaultIcon as S } from "../../../../icons/HandModeDefaultIcon.js";
-import { CheckIcon as p } from "../../../../icons/CheckIcon.js";
-import { MenuItem as d } from "../../MenuItem.js";
+import { CheckIcon as d } from "../../../../icons/CheckIcon.js";
+import { MenuItem as l } from "../../MenuItem.js";
 import { SelectionMode as i } from "../../../../../utils/types.js";
 import { MenuSeparator as N } from "../../MenuSeparator.js";
-import { useSelectionModeContext as s } from "../../../../../contexts/SelectionModeContext.js";
-import { useLocalizationContext as I } from "../../../../../contexts/LocalizationContext.js";
+import { useSelectionModeContext as I } from "../../../../../contexts/SelectionModeContext.js";
+import { useLocalizationContext as b } from "../../../../../contexts/LocalizationContext.js";
 import "react";
 import "../../../../../index-c9a2990a.js";
 import "react-dom";
 import "../../../../../index-808ea7bf.js";
 import "../../../../../utils/withRef.js";
 import "../../../../../clsx-0c6e471a.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../utils/appConsole.js";
 import "../../../../../utils/hooks/useLocalization.js";
-const y = (u) => {
-  const { icons: f, isToolVisible: h = !0 } = u, { textSelectionIcon: r, handModeIcon: n } = f ?? {}, { selectionMode: m, setSelectionMode: c } = s(), { localeMessages: o } = I();
-  return h ? /* @__PURE__ */ t(a, { children: /* @__PURE__ */ e(T, { children: [
-    /* @__PURE__ */ t(d, { onClick: () => c(i.TEXT), children: /* @__PURE__ */ e(l, { className: "rp-menu-item", content: o == null ? void 0 : o.textSelectionTooltip, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: r || /* @__PURE__ */ t(x, {}) }),
-      o == null ? void 0 : o.textSelectionLabel,
-      m === i.TEXT ? /* @__PURE__ */ t(p, { className: "rp-menu-item-right" }) : null
-    ] }) }),
-    /* @__PURE__ */ t(d, { onClick: () => c(i.HAND), children: /* @__PURE__ */ e(l, { className: "rp-menu-item", content: o == null ? void 0 : o.handToolTooltip, children: [
-      /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: n || /* @__PURE__ */ t(S, {}) }),
-      o == null ? void 0 : o.handToolLabel,
-      m === i.HAND ? /* @__PURE__ */ t(p, { className: "rp-menu-item-right" }) : null
-    ] }) }),
-    /* @__PURE__ */ t(N, {})
+const J = (a) => {
+  const { icons: u, isToolVisible: h = !0 } = a, { textSelectionIcon: n, handModeIcon: m } = u ?? {}, { selectionMode: r, setSelectionMode: c } = I(), { localeMessages: t } = b();
+  return h ? /* @__PURE__ */ o(T, { children: /* @__PURE__ */ e(f, { children: [
+    /* @__PURE__ */ o(
+      l,
+      {
+        onClick: () => c(i.TEXT),
+        "aria-label": t == null ? void 0 : t.textSelectionTooltip,
+        "aria-checked": r === i.TEXT,
+        children: /* @__PURE__ */ e(p, { className: "rp-menu-item", content: t == null ? void 0 : t.textSelectionTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: n || /* @__PURE__ */ o(x, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.textSelectionLabel,
+          r === i.TEXT ? /* @__PURE__ */ o(d, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(
+      l,
+      {
+        onClick: () => c(i.HAND),
+        "aria-label": t == null ? void 0 : t.handToolTooltip,
+        "aria-checked": r === i.HAND,
+        children: /* @__PURE__ */ e(p, { className: "rp-menu-item", content: t == null ? void 0 : t.handToolTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: m || /* @__PURE__ */ o(S, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.handToolLabel,
+          r === i.HAND ? /* @__PURE__ */ o(d, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(N, {})
   ] }) }) : null;
 };
 export {
-  y as SelectionModeTool
+  J as SelectionModeTool
 };

package/dist/components/layout/toolbar/tools/more-options/ViewModeTool.js

@@ -1,16 +1,17 @@
-import { jsx as r, Fragment as h, jsxs as i } from "react/jsx-runtime";
-import { useMemo as I } from "react";
-import l from "../../../../ui/RPTooltip.js";
-import { G as N } from "../../../../../index-a48ec088.js";
-import { MenuSeparator as L } from "../../MenuSeparator.js";
-import { MenuItem as p } from "../../MenuItem.js";
-import { DualPageIcon as C } from "../../../../icons/DualPageIcon.js";
-import { SinglePageIcon as S } from "../../../../icons/SinglePageIcon.js";
-import { useViewModeContext as x } from "../../../../../contexts/ViewModeContext.js";
-import { ScrollMode as G, ViewMode as c } from "../../../../../utils/types.js";
-import { CheckIcon as u } from "../../../../icons/CheckIcon.js";
-import { useScrollModeContext as T } from "../../../../../contexts/ScrollModeContext.js";
-import { useLocalizationContext as b } from "../../../../../contexts/LocalizationContext.js";
+import { jsx as r, Fragment as g, jsxs as e } from "react/jsx-runtime";
+import { useMemo as L } from "react";
+import n from "../../../../ui/RPTooltip.js";
+import { G } from "../../../../../index-a48ec088.js";
+import { MenuSeparator as T } from "../../MenuSeparator.js";
+import { MenuItem as m } from "../../MenuItem.js";
+import { DualPageIcon as b } from "../../../../icons/DualPageIcon.js";
+import { DualPageWithCoverIcon as v } from "../../../../icons/DualPageWithCoverIcon.js";
+import { SinglePageIcon as A } from "../../../../icons/SinglePageIcon.js";
+import { useViewModeContext as D } from "../../../../../contexts/ViewModeContext.js";
+import { ScrollMode as E, ViewMode as o } from "../../../../../utils/types.js";
+import { CheckIcon as l } from "../../../../icons/CheckIcon.js";
+import { useScrollModeContext as S } from "../../../../../contexts/ScrollModeContext.js";
+import { useLocalizationContext as _ } from "../../../../../contexts/LocalizationContext.js";
 import "../../../../../index-c9a2990a.js";
 import "react-dom";
 import "../../../../../index-808ea7bf.js";
@@ -18,24 +19,46 @@ import "../../../../../utils/withRef.js";
 import "../../../../../clsx-0c6e471a.js";
 import "../../../../../utils/appConsole.js";
 import "../../../../../contexts/InitialStateContext.js";
-import "../../../../../th_TH-d627cd51.js";
+import "../../../../../th_TH-d1686d95.js";
 import "../../../../../utils/hooks/useLocalization.js";
-const Q = (a) => {
-  const { icons: d, isToolVisible: s = !0 } = a, { singlePageIcon: t, dualPageIcon: e } = d ?? {}, { viewMode: m, setDualPage: f, setSinglePage: P } = x(), { scrollMode: n } = T(), { localeMessages: o } = b(), g = I(() => [G.HORIZONTAL_SCROLLING].includes(n), [n]);
-  return s ? /* @__PURE__ */ r(h, { children: /* @__PURE__ */ i(N, { children: [
-    /* @__PURE__ */ r(p, { onClick: P, children: /* @__PURE__ */ i(l, { className: "rp-menu-item", content: o == null ? void 0 : o.singlePageTooltip, children: [
-      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: t || /* @__PURE__ */ r(S, {}) }),
-      o == null ? void 0 : o.singlePageLabel,
-      m === c.SINGLE_PAGE ? /* @__PURE__ */ r(u, { className: "rp-menu-item-right" }) : null
+const M = (h) => {
+  const { icons: P, isToolVisible: f = !0 } = h, { singlePageIcon: a, dualPageIcon: d, dualPageWithCoverIcon: p } = P ?? {}, { viewMode: t, setDualPage: C, setDualPageWithCover: I, setSinglePage: N } = D(), { scrollMode: u } = S(), { localeMessages: i } = _(), c = L(() => [E.HORIZONTAL_SCROLLING].includes(u), [u]);
+  return f ? /* @__PURE__ */ r(g, { children: /* @__PURE__ */ e(G, { children: [
+    /* @__PURE__ */ r(
+      m,
+      {
+        onClick: N,
+        "aria-label": i == null ? void 0 : i.singlePageTooltip,
+        "aria-checked": t === o.SINGLE_PAGE,
+        children: /* @__PURE__ */ e(n, { className: "rp-menu-item", content: i == null ? void 0 : i.singlePageTooltip, children: [
+          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: a || /* @__PURE__ */ r(A, { "aria-hidden": "true" }) }),
+          i == null ? void 0 : i.singlePageLabel,
+          t === o.SINGLE_PAGE ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ r(
+      m,
+      {
+        disabled: c,
+        onClick: C,
+        "aria-label": i == null ? void 0 : i.dualPageTooltip,
+        "aria-checked": t === o.DUAL_PAGE,
+        children: /* @__PURE__ */ e(n, { className: "rp-menu-item", content: i == null ? void 0 : i.dualPageTooltip, children: [
+          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: d || /* @__PURE__ */ r(b, { "aria-hidden": "true" }) }),
+          i == null ? void 0 : i.dualPageLabel,
+          t === o.DUAL_PAGE ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ r(m, { disabled: c, onClick: I, children: /* @__PURE__ */ e(n, { className: "rp-menu-item", content: i == null ? void 0 : i.dualPageWithCoverTooltip, children: [
+      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: p || /* @__PURE__ */ r(v, {}) }),
+      i == null ? void 0 : i.dualPageWithCoverLabel,
+      t === o.DUAL_PAGE_WITH_COVER ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right" }) : null
     ] }) }),
-    /* @__PURE__ */ r(p, { disabled: g, onClick: f, children: /* @__PURE__ */ i(l, { className: "rp-menu-item", content: o == null ? void 0 : o.dualPageTooltip, children: [
-      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: e || /* @__PURE__ */ r(C, {}) }),
-      o == null ? void 0 : o.dualPageLabel,
-      m === c.DUAL_PAGE ? /* @__PURE__ */ r(u, { className: "rp-menu-item-right" }) : null
-    ] }) }),
-    /* @__PURE__ */ r(L, {})
+    /* @__PURE__ */ r(T, {})
   ] }) }) : null;
 };
 export {
-  Q as ViewModeTool
+  M as ViewModeTool
 };