diff --git a/pdfjs/pdf.js b/pdfjs/pdf.js
index 159a1d56..046158be 160000
--- a/pdfjs/pdf.js
+++ b/pdfjs/pdf.js
@@ -1 +1 @@
-Subproject commit 159a1d5612b803ca1d8b1f5d7498d5e84a58c284
+Subproject commit 046158be54cebc3a43b65d0e54731d5635cfbedb
diff --git a/src/common/components/reader-ui.js b/src/common/components/reader-ui.js
index 34da34d9..862430bf 100644
--- a/src/common/components/reader-ui.js
+++ b/src/common/components/reader-ui.js
@@ -167,6 +167,7 @@ const ReaderUI = React.forwardRef((props, ref) => {
}
diff --git a/src/common/components/sidebar/outline-view.js b/src/common/components/sidebar/outline-view.js
index 63ec2fac..5ba0550b 100644
--- a/src/common/components/sidebar/outline-view.js
+++ b/src/common/components/sidebar/outline-view.js
@@ -5,7 +5,7 @@ import { IconTreeItemCollapsed, IconTreeItemExpanded } from '../common/icons';
-function Item({ item, children, onNavigate, onUpdate }) {
+function Item({ item, children, onNavigate, onOpenLink, onUpdate }) {
function handleExpandToggleClick(event) {
item.expanded = !item.expanded;
onUpdate();
@@ -13,21 +13,39 @@ function Item({ item, children, onNavigate, onUpdate }) {
function handleKeyDown(event) {
event.preventDefault();
- if (event.key === 'Enter') {
- handleExpandToggleClick();
- }
- else if (!window.rtl && event.key === 'ArrowLeft' || window.rtl && event.key === 'ArrowRight') {
- item.expanded = false;
- onUpdate();
+ if (event.key === 'Enter' && item.url) {
+ onOpenLink(item.url);
}
- else if (!window.rtl && event.key === 'ArrowRight' || window.rtl && event.key === 'ArrowLeft') {
- item.expanded = true;
- onUpdate();
+ if (item?.items.length) {
+ if (event.key === 'Enter') {
+ handleExpandToggleClick();
+ }
+ else if (!window.rtl && event.key === 'ArrowLeft' || window.rtl && event.key === 'ArrowRight') {
+ item.expanded = false;
+ onUpdate();
+ }
+ else if (!window.rtl && event.key === 'ArrowRight' || window.rtl && event.key === 'ArrowLeft') {
+ item.expanded = true;
+ onUpdate();
+ }
}
}
function handleFocus(event) {
- onNavigate(item.location);
+ if (item.location) {
+ onNavigate(item.location);
+ }
+ }
+
+ function handleClick() {
+ if (item.items?.length) {
+ handleExpandToggleClick();
+ }
+ }
+
+ function handleURLClick(event) {
+ event.preventDefault();
+ onOpenLink(item.url);
}
let toggle;
@@ -49,14 +67,15 @@ function Item({ item, children, onNavigate, onUpdate }) {
tabIndex={-1}
onFocus={handleFocus}
onKeyDown={handleKeyDown}
- >{item.title}
+ onClick={handleClick}
+ >{item.title}{item.url && (<> [URL]>)}
{children &&
{children}
}
);
}
-function OutlineView({ outline, onNavigate, onUpdate}) {
+function OutlineView({ outline, onNavigate, onOpenLink, onUpdate}) {
const intl = useIntl();
function handleUpdate() {
@@ -71,6 +90,7 @@ function OutlineView({ outline, onNavigate, onUpdate}) {
key={index}
item={item}
onNavigate={onNavigate}
+ onOpenLink={onOpenLink}
onUpdate={handleUpdate}
>
{item.expanded && item.items && renderItems(item.items)}