@edrlab/thorium-web 1.0.0-beta.5 → 1.0.0-beta.6

package/dist/components/Epub/index.mjs

@@ -1,11 +1,11 @@
-import { require_debounce, useAppSelector, useAppDispatch, setColumnCount, setFontFamily, setFontWeight, setHyphens, setScroll, setLetterSpacing, setPublisherStyles, setLineHeight, setParagraphIndent, setParagraphSpacing, setSettingsContainer, setTextAlign, setTextNormalization, setTheme, setWordSpacing, setFontSize, setFullscreen, setActionOpen, dockAction, setReducedTransparency, setReducedMotion, setMonochrome, setForcedColors, setContrast, setColorScheme, setBreakpoint, setTimeline, setImmersive, setHovering, setArrows, toggleImmersive, setProgression, useAppStore, toggleActionOpen, setDirection, setPlatformModifier, setRTL, setFXL, setRunningHead, setOverflow, setScrollAffordance, setPublicationStart, setPublicationEnd, setPositionsList, setLoading, setTocEntry, collapseDockPanel, expandDockPanel, activateDockPanel, deactivateDockPanel, setDockPanelWidth } from '../../chunk-OCASVHBV.mjs';
-export { ThStoreProvider, actionsSlice, activateDockPanel, collapseDockPanel, deactivateDockPanel, dockAction, expandDockPanel, makeStore, publicationSlice, readerSlice, setActionOpen, setArrows, setBreakpoint, setColorScheme, setColumnCount, setContrast, setDirection, setDockPanelWidth, setFXL, setFontFamily, setFontSize, setFontWeight, setForcedColors, setFullscreen, setHovering, setHyphens, setImmersive, setLetterSpacing, setLineHeight, setLineLength, setLoading, setMonochrome, setOverflow, setParagraphIndent, setParagraphSpacing, setPlatformModifier, setPositionsList, setProgression, setPublicationEnd, setPublicationStart, setPublisherStyles, setRTL, setReducedMotion, setReducedTransparency, setRunningHead, setScroll, setScrollAffordance, setSettingsContainer, setTextAlign, setTextNormalization, setTheme, setTimeline, setTocEntry, setTocTree, setWordSpacing, settingsSlice, themeSlice, toggleActionOpen, toggleImmersive, useAppDispatch, useAppSelector, useAppStore } from '../../chunk-OCASVHBV.mjs';
-import { defaultFontFamilyOptions, usePreferences, defaultLetterSpacing, defaultLineHeights, defaultParagraphIndent, defaultParagraphSpacing, defaultSpacingSettingsSubpanel, defaultSpacingSettingsMain, defaultTextSettingsSubpanel, defaultTextSettingsMain, usePreferenceKeys, buildThemeObject, defaultWordSpacing, defaultFontSize, useTheming } from '../../chunk-TXILKP4F.mjs';
-export { ThPreferencesProvider, usePreferences, useTheming } from '../../chunk-TXILKP4F.mjs';
-import { ThRadioGroup, ThDropdown, ThSlider, ThSwitch, ThNumberField, ThSettingsWrapper, ThActionButton, ThMenu, ThCollapsibleActionsBar, ThMenuItem, ThPopover, ThContainerHeader, ThNavigationButton, ThContainerBody, ThBottomSheet, ThCloseButton, ThModal, ThDockedPanel, ThTypedComponentRenderer, useActions, ThForm, ThFormNumberField, ThFormSearchField, ThLoader, ThGrid, ThInteractiveOverlay, ThHeader, ThRunningHead, ThFooter, ThPagination, ThProgression } from '../../chunk-SDVDRPT5.mjs';
+import { require_debounce, useAppSelector, useAppDispatch, setColumnCount, setFontFamily, setFontWeight, setHyphens, setScroll, setLetterSpacing, setPublisherStyles, setLineHeight, setParagraphIndent, setParagraphSpacing, setSettingsContainer, setTextAlign, setTextNormalization, setTheme, setWordSpacing, setFontSize, setFullscreen, setActionOpen, dockAction, setReducedTransparency, setReducedMotion, setMonochrome, setForcedColors, setContrast, setColorScheme, setBreakpoint, setTimeline, setImmersive, setHovering, setArrows, toggleImmersive, setProgression, useAppStore, toggleActionOpen, setDirection, setPlatformModifier, setRTL, setFXL, setRunningHead, setOverflow, setScrollAffordance, setPublicationStart, setPublicationEnd, setPositionsList, setLoading, setTocEntry, collapseDockPanel, expandDockPanel, activateDockPanel, deactivateDockPanel, setDockPanelWidth } from '../../chunk-MS2TXXYX.mjs';
+export { ThStoreProvider, actionsSlice, activateDockPanel, collapseDockPanel, deactivateDockPanel, dockAction, expandDockPanel, makeStore, publicationSlice, readerSlice, setActionOpen, setArrows, setBreakpoint, setColorScheme, setColumnCount, setContrast, setDirection, setDockPanelWidth, setFXL, setFontFamily, setFontSize, setFontWeight, setForcedColors, setFullscreen, setHovering, setHyphens, setImmersive, setLetterSpacing, setLineHeight, setLineLength, setLoading, setMonochrome, setOverflow, setParagraphIndent, setParagraphSpacing, setPlatformModifier, setPositionsList, setProgression, setPublicationEnd, setPublicationStart, setPublisherStyles, setRTL, setReducedMotion, setReducedTransparency, setRunningHead, setScroll, setScrollAffordance, setSettingsContainer, setTextAlign, setTextNormalization, setTheme, setTimeline, setTocEntry, setTocTree, setWordSpacing, settingsSlice, themeSlice, toggleActionOpen, toggleImmersive, useAppDispatch, useAppSelector, useAppStore } from '../../chunk-MS2TXXYX.mjs';
+import { defaultFontFamilyOptions, usePreferences, defaultLetterSpacing, defaultLineHeights, defaultParagraphIndent, defaultParagraphSpacing, defaultSpacingSettingsSubpanel, defaultSpacingSettingsMain, defaultTextSettingsSubpanel, defaultTextSettingsMain, usePreferenceKeys, buildThemeObject, defaultWordSpacing, defaultFontSize, useTheming } from '../../chunk-SNRTM7N3.mjs';
+export { ThPreferencesProvider, usePreferences, useTheming } from '../../chunk-SNRTM7N3.mjs';
+import { ThRadioGroup, ThDropdown, ThSlider, ThSwitch, ThNumberField, ThSettingsWrapper, ThActionButton, ThMenu, ThCollapsibleActionsBar, ThMenuItem, ThPopover, ThContainerHeader, ThNavigationButton, ThContainerBody, ThBottomSheet, ThCloseButton, ThModal, ThDockedPanel, ThTypedComponentRenderer, useActions, ThForm, ThFormNumberField, ThFormSearchField, ThLoader, ThGrid, ThInteractiveOverlay, ThHeader, ThRunningHead, ThFooter, ThLink, ThLibrary, ThHome, ThPagination, ThProgression } from '../../chunk-BD5MZ3QC.mjs';
 import '../../chunk-MLEYTQGK.mjs';
-import { makeBreakpointsMap, isKeyboardTriggered, isActiveElement, isInteractiveElement } from '../../chunk-NOV43IG4.mjs';
-export { isActiveElement, isInteractiveElement, isKeyboardTriggered, makeBreakpointsMap } from '../../chunk-NOV43IG4.mjs';
+import { makeBreakpointsMap, isKeyboardTriggered, isActiveElement, isInteractiveElement } from '../../chunk-SN7KBNGK.mjs';
+export { isActiveElement, isInteractiveElement, isKeyboardTriggered, makeBreakpointsMap } from '../../chunk-SN7KBNGK.mjs';
 import { propsToCSSVars } from '../../chunk-TTGURRX3.mjs';
 export { propsToCSSVars } from '../../chunk-TTGURRX3.mjs';
 import { isIOSish, getPlatformModifier, buildShortcut, metaKeys } from '../../chunk-IEYR7QV7.mjs';
@@ -14,22 +14,23 @@ import { useEpubNavigator, useFullscreen, usePrevious, useLocalStorage, useTimel
 export { useEpubNavigator } from '../../chunk-NA3KMUS4.mjs';
 import '../../chunk-BNPR6V7V.mjs';
 import '../../chunk-NQ2ZSGCX.mjs';
-import { __commonJS, __toESM, ThDockingTypes, ThSheetTypes } from '../../chunk-RQFPGXWN.mjs';
-import React49, { createContext, useState, useMemo, useCallback, useEffect, useRef, useContext, isValidElement, cloneElement } from 'react';
+import { __commonJS, __toESM, ThDockingTypes, ThSheetTypes } from '../../chunk-HUMV6I5L.mjs';
+import React50, { createContext, useState, useMemo, useCallback, useEffect, useRef, useContext, isValidElement, cloneElement } from 'react';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import settingsStyles3 from '../../settings.module-O2SOKTIN.module.css';
 import { ListBox, ListBoxItem, Radio, Text, useFilter, Tree, TreeItem, TreeItemContent, Button, Collection, Link, Keyboard, Toolbar } from 'react-aria-components';
 import { fontWeightRangeConfig, TextAlignment } from '@readium/navigator';
 import classNames10 from 'classnames';
-import readerSharedUI3 from '../../readerSharedUI.module-Y2VDWFS5.module.css';
+import readerSharedUI4 from '../../readerSharedUI.module-Y2VDWFS5.module.css';
 import '../../reader-NGCQJKLX.css';
 import arrowStyles2 from '../../readerArrowButton.module-EFLOIADG.module.css';
 import { I18nProvider, useFocusWithin } from 'react-aria';
 import { HttpFetcher, Manifest, Publication, ReadingProgression, EPUBLayout, Link as Link$1 } from '@readium/shared';
 import dockingStyles from '../../docking.module-TDNYZX4H.module.css';
 import { PanelGroup, Panel, PanelResizeHandle } from 'react-resizable-panels';
-import readerHeaderStyles from '../../readerHeader.module-K7OLOIJP.module.css';
+import readerHeaderStyles from '../../readerHeader.module-RNGQFLVS.module.css';
 import overflowMenuStyles from '../../overflowMenu.module-FO27A2A3.module.css';
+import backLinkStyles from '../../backLink.module-QFOMD4RA.module.css';
 import readerPaginationStyles2 from '../../readerPagination.module-W4IAEOSH.module.css';
 import progressionStyles from '../../readerProgression.module-7PU7L74S.module.css';
 import jumpToPositionStyles from '../../jumpToPosition.module-4C47UYPE.module.css';
@@ -449,6 +450,10 @@ var en_default = {
         dockingCollapsed: "Is Collapsed, contains {{ action }}"
       },
       header: {
+        backLink: {
+          trigger: "Back to the library",
+          tooltip: "Library"
+        },
         label: "Top bar",
         runningHead: "Running head",
         runningHeadFallback: "...",
@@ -1014,7 +1019,7 @@ var StatefulNumberField = ({
           className: settingsStyles3.readerSettingsLabel
         },
         stepper: {
-          className: readerSharedUI3.icon
+          className: readerSharedUI4.icon
         },
         input: {
           className: settingsStyles3.readerSettingsInput
@@ -1320,7 +1325,7 @@ var StatefulGroupWrapper = ({
           className: classNames10(settingsStyles3.readerSettingsLabel, settingsStyles3.readerSettingsGroupLabel)
         },
         button: {
-          className: classNames10(readerSharedUI3.icon, settingsStyles3.readerSettingsAdvancedIcon),
+          className: classNames10(readerSharedUI4.icon, settingsStyles3.readerSettingsAdvancedIcon),
           "aria-label": moreLabel,
           compounds: {
             tooltipTrigger: {
@@ -1328,7 +1333,7 @@ var StatefulGroupWrapper = ({
               closeDelay: RSPrefs.theming.icon.tooltipDelay
             },
             tooltip: {
-              className: readerSharedUI3.tooltip,
+              className: readerSharedUI4.tooltip,
               placement: "top",
               offset: RSPrefs.theming.icon.tooltipOffset || 0
             },
@@ -2092,6 +2097,83 @@ var StatefulDockingWrapper = ({
     ] }) });
   }
 };
+var StatefulBackLink = ({
+  className
+}) => {
+  const RSPrefs = usePreferences();
+  const variant = RSPrefs.header.backLink?.variant || "home" /* home */;
+  const href = RSPrefs.header.backLink?.href;
+  const content = RSPrefs.header.backLink?.content;
+  const compounds = {
+    tooltipTrigger: {
+      delay: RSPrefs.theming.arrow.tooltipDelay,
+      closeDelay: RSPrefs.theming.arrow.tooltipDelay
+    },
+    tooltip: {
+      className: readerSharedUI4.tooltip
+    },
+    label: en_default.reader.app.header.backLink.tooltip
+  };
+  if (!href) return null;
+  switch (variant) {
+    case "home" /* home */:
+      return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
+        ThHome,
+        {
+          className: backLinkStyles.backLink,
+          href,
+          "aria-label": en_default.reader.app.header.backLink.trigger,
+          compounds
+        }
+      ) });
+    case "library" /* library */:
+      return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
+        ThLibrary,
+        {
+          className: backLinkStyles.backLink,
+          href,
+          "aria-label": en_default.reader.app.header.backLink.trigger,
+          compounds
+        }
+      ) });
+    default:
+      if (!content) return null;
+      let contentNode = null;
+      switch (content.type) {
+        case "img":
+          contentNode = /* @__PURE__ */ jsx("img", { alt: content.alt ?? "", src: content.src });
+          break;
+        case "svg":
+          const parser = new DOMParser();
+          const doc = parser.parseFromString(content.content, "image/svg+xml");
+          const svgElement = doc.documentElement;
+          const attributes = {};
+          for (const { name, value } of Array.from(svgElement.attributes)) {
+            attributes[name] = value;
+          }
+          contentNode = React50.createElement("svg", {
+            ...attributes,
+            "aria-hidden": "true",
+            focusable: "false",
+            xmlns: "http://www.w3.org/2000/svg",
+            dangerouslySetInnerHTML: {
+              __html: svgElement.innerHTML
+            }
+          });
+          break;
+      }
+      return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
+        ThLink,
+        {
+          className: backLinkStyles.backLink,
+          href,
+          "aria-label": en_default.reader.app.header.backLink.trigger,
+          compounds,
+          children: contentNode
+        }
+      ) });
+  }
+};
 var SvgMoreVert = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", fill: "inherit", ...props, children: /* @__PURE__ */ jsx("path", { d: "M480-160q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 33-23.5 56.5T480-160Zm0-240q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm0-240q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Z" }) });
 var more_vert_default = SvgMoreVert;
 var StatefulActionIcon = ({
@@ -2108,10 +2190,10 @@ var StatefulActionIcon = ({
     let className = "";
     switch (visibility) {
       case "always" /* always */:
-        className = readerSharedUI3.alwaysVisible;
+        className = readerSharedUI4.alwaysVisible;
         break;
       case "partially" /* partially */:
-        className = readerSharedUI3.partiallyVisible;
+        className = readerSharedUI4.partiallyVisible;
         break;
     }
     return className;
@@ -2133,7 +2215,7 @@ var StatefulActionIcon = ({
     ThActionButton,
     {
       ref: triggerRef,
-      className: classNames10(readerSharedUI3.icon, handleClassNameFromState(), props.className),
+      className: classNames10(readerSharedUI4.icon, handleClassNameFromState(), props.className),
       onPress: props.onPress || defaultOnPressFunc,
       onKeyDown: blurOnEsc,
       onFocus: handleImmersive,
@@ -2143,7 +2225,7 @@ var StatefulActionIcon = ({
           closeDelay: RSPrefs.theming.icon.tooltipDelay
         },
         tooltip: {
-          className: readerSharedUI3.tooltip,
+          className: readerSharedUI4.tooltip,
           placement,
           offset: RSPrefs.theming.icon.tooltipOffset || 0
         },
@@ -2316,6 +2398,7 @@ var StatefulReaderHeader = ({
         onMouseLeave: removeHover,
         ...focusWithinProps,
         children: [
+          RSPrefs.header.backLink && /* @__PURE__ */ jsx(StatefulBackLink, { className: readerHeaderStyles.backLinkWrapper }),
           /* @__PURE__ */ jsx(
             ThRunningHead,
             {
@@ -2413,7 +2496,7 @@ var StatefulReaderArrowButton = ({
         },
         tooltip: {
           placement: direction === "left" ? "right" : "left",
-          className: readerSharedUI3.tooltip
+          className: readerSharedUI4.tooltip
         },
         label
       }
@@ -2719,7 +2802,7 @@ var StatefulFullscreenTrigger = ({ variant }) => {
   ) : /* @__PURE__ */ jsx(
     StatefulActionIcon,
     {
-      className: readerSharedUI3.iconCompSm,
+      className: readerSharedUI4.iconCompSm,
       visibility: RSPrefs.actions.keys["fullscreen" /* fullscreen */].visibility,
       "aria-label": label,
       placement: "bottom",
@@ -2798,7 +2881,7 @@ var StatefulDockStart = ({ variant, associatedKey }) => {
   ) : /* @__PURE__ */ jsx(
     StatefulActionIcon,
     {
-      className: readerSharedUI3.dockerButton,
+      className: readerSharedUI4.dockerButton,
       "aria-label": localeKey.trigger,
       placement: "bottom",
       tooltipLabel: localeKey.tooltip,
@@ -2838,7 +2921,7 @@ var StatefulDockEnd = ({ variant, associatedKey }) => {
   ) : /* @__PURE__ */ jsx(
     StatefulActionIcon,
     {
-      className: readerSharedUI3.dockerButton,
+      className: readerSharedUI4.dockerButton,
       "aria-label": localeKey.trigger,
       placement: "bottom",
       tooltipLabel: localeKey.tooltip,
@@ -2877,7 +2960,7 @@ var StatefulDockTransientPopover = ({ variant, associatedKey }) => {
   ) : /* @__PURE__ */ jsx(
     StatefulActionIcon,
     {
-      className: readerSharedUI3.dockerButton,
+      className: readerSharedUI4.dockerButton,
       "aria-label": en_default.reader.app.docker.popover.trigger,
       placement: "bottom",
       tooltipLabel: en_default.reader.app.docker.popover.tooltip,
@@ -2923,7 +3006,7 @@ var StatefulDocker = ({
         id: `${id}-docker-overflowMenu`,
         items: listActionItems(),
         className: dockingStyles.docker,
-        overflowMenuClassName: readerSharedUI3.dockerButton,
+        overflowMenuClassName: readerSharedUI4.dockerButton,
         prefs: RSPrefs.docking,
         "aria-label": en_default.reader.app.docker.wrapper
       }
@@ -2932,7 +3015,7 @@ var StatefulDocker = ({
       ThCloseButton,
       {
         ref,
-        className: readerSharedUI3.dockerButton,
+        className: readerSharedUI4.dockerButton,
         "aria-label": en_default.reader.app.docker.close.trigger,
         onPress: onClose,
         compounds: {
@@ -2941,7 +3024,7 @@ var StatefulDocker = ({
             closeDelay: RSPrefs.theming.icon.tooltipDelay
           },
           tooltip: {
-            className: readerSharedUI3.tooltip
+            className: readerSharedUI4.tooltip
           },
           label: en_default.reader.app.docker.close.tooltip
         }
@@ -2999,7 +3082,7 @@ var StatefulPopoverSheet = ({
   const popoverBodyRef = useRef(null);
   const popoverCloseRef = useRef(null);
   useWebkitPatch(!!isOpen);
-  if (React49.Children.toArray(children).length > 0) {
+  if (React50.Children.toArray(children).length > 0) {
     return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
       ThPopover,
       {
@@ -3042,7 +3125,7 @@ var StatefulPopoverSheet = ({
                   direction: direction === "ltr" ? "left" : "right",
                   label: en_default.reader.app.back.trigger,
                   ref: popoverCloseRef,
-                  className: classNames10(className, readerSharedUI3.backButton),
+                  className: classNames10(className, readerSharedUI4.backButton),
                   "aria-label": en_default.reader.app.back.trigger,
                   onPress: onClosePress
                 }
@@ -3230,7 +3313,7 @@ var StatefulBottomSheet = ({
   const scrimClassName = useMemo(() => {
     return scrimPref.active ? sheetStyles2.bottomSheetScrim : "";
   }, [scrimPref]);
-  if (React49.Children.toArray(children).length > 0) {
+  if (React50.Children.toArray(children).length > 0) {
     return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
       ThBottomSheet,
       {
@@ -3299,7 +3382,7 @@ var StatefulBottomSheet = ({
                   direction: direction === "ltr" ? "left" : "right",
                   label: en_default.reader.app.back.trigger,
                   ref: bottomSheetCloseRef,
-                  className: classNames10(className, readerSharedUI3.backButton),
+                  className: classNames10(className, readerSharedUI4.backButton),
                   "aria-label": en_default.reader.app.back.trigger,
                   onPress: onClosePress
                 }
@@ -3307,7 +3390,7 @@ var StatefulBottomSheet = ({
                 ThCloseButton,
                 {
                   ref: bottomSheetCloseRef,
-                  className: readerSharedUI3.closeButton,
+                  className: readerSharedUI4.closeButton,
                   "aria-label": en_default.reader.app.docker.close.trigger,
                   onPress: onClosePress
                 }
@@ -3343,7 +3426,7 @@ var StatefulFullScreenSheet = ({
   const fullScreenBodyRef = useRef(null);
   const fullScreenCloseRef = useRef(null);
   useWebkitPatch(!!isOpen);
-  if (React49.Children.toArray(children).length > 0) {
+  if (React50.Children.toArray(children).length > 0) {
     return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
       ThModal,
       {
@@ -3385,7 +3468,7 @@ var StatefulFullScreenSheet = ({
                   direction: direction === "ltr" ? "left" : "right",
                   label: en_default.reader.app.back.trigger,
                   ref: fullScreenCloseRef,
-                  className: classNames10(className, readerSharedUI3.backButton),
+                  className: classNames10(className, readerSharedUI4.backButton),
                   "aria-label": en_default.reader.app.back.trigger,
                   onPress: onClosePress
                 }
@@ -3393,7 +3476,7 @@ var StatefulFullScreenSheet = ({
                 ThCloseButton,
                 {
                   ref: fullScreenCloseRef,
-                  className: readerSharedUI3.closeButton,
+                  className: readerSharedUI4.closeButton,
                   "aria-label": en_default.reader.app.docker.close.trigger,
                   onPress: onClosePress
                 }
@@ -3438,7 +3521,7 @@ var StatefulDockedSheet = ({
       return direction === "ltr" /* ltr */ ? sheetStyles2.dockedSheetRightBorder : sheetStyles2.dockedSheetLeftBorder;
     }
   }, [flow, direction]);
-  if (React49.Children.toArray(children).length > 0) {
+  if (React50.Children.toArray(children).length > 0) {
     return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
       ThDockedPanel,
       {
@@ -3473,7 +3556,7 @@ var StatefulDockedSheet = ({
                   direction: direction === "ltr" ? "left" : "right",
                   label: en_default.reader.app.back.trigger,
                   ref: dockedSheetCloseRef,
-                  className: classNames10(className, readerSharedUI3.backButton),
+                  className: classNames10(className, readerSharedUI4.backButton),
                   "aria-label": en_default.reader.app.back.trigger,
                   onPress: onClosePress
                 }
@@ -4018,8 +4101,8 @@ var StatefulTocContainer = ({ triggerRef }) => {
   const docking = useDocking("toc" /* toc */);
   const sheetType = docking.sheetType;
   const { contains } = useFilter({ sensitivity: "base" });
-  const [filterValue, setFilterValue] = React49.useState("");
-  const searchInputRef = React49.useRef(null);
+  const [filterValue, setFilterValue] = React50.useState("");
+  const searchInputRef = React50.useRef(null);
   const filterTocTree = (items, filterValue2) => {
     if (!filterValue2) {
       return items;