@papyrus-sdk/ui-react-native 0.2.27 → 0.2.29

package/dist/index.d.mts

@@ -202,4 +202,11 @@ declare const MOBILE_CHROME_METRICS: {
     readonly progressHorizontalOffset: 10;
 };
 
-export { AnnotationEditor, BottomBar, CoverPreview, DocumentActionsSheet, InfoSheet, MOBILE_CHROME_METRICS, MobilePerfProvider, DedicatedAndroidPdfViewer as NativePdfDocumentViewer, OverflowSheet, _default as PageRenderer, ProgressPill, ReadingShell, RightSheet, SearchOverlay, SearchResultsSheet, SettingsSheet, ToolDock, Topbar, Viewer, createPerfSession, createRunId, useMobilePerf };
+type IconProps = {
+    size?: number;
+    color?: string;
+    strokeWidth?: number;
+};
+declare const IconPageNav: React.FC<IconProps>;
+
+export { AnnotationEditor, BottomBar, CoverPreview, DocumentActionsSheet, IconPageNav, InfoSheet, MOBILE_CHROME_METRICS, MobilePerfProvider, DedicatedAndroidPdfViewer as NativePdfDocumentViewer, OverflowSheet, _default as PageRenderer, ProgressPill, ReadingShell, RightSheet, SearchOverlay, SearchResultsSheet, SettingsSheet, ToolDock, Topbar, Viewer, createPerfSession, createRunId, useMobilePerf };

package/dist/index.d.ts

@@ -202,4 +202,11 @@ declare const MOBILE_CHROME_METRICS: {
     readonly progressHorizontalOffset: 10;
 };
 
-export { AnnotationEditor, BottomBar, CoverPreview, DocumentActionsSheet, InfoSheet, MOBILE_CHROME_METRICS, MobilePerfProvider, DedicatedAndroidPdfViewer as NativePdfDocumentViewer, OverflowSheet, _default as PageRenderer, ProgressPill, ReadingShell, RightSheet, SearchOverlay, SearchResultsSheet, SettingsSheet, ToolDock, Topbar, Viewer, createPerfSession, createRunId, useMobilePerf };
+type IconProps = {
+    size?: number;
+    color?: string;
+    strokeWidth?: number;
+};
+declare const IconPageNav: React.FC<IconProps>;
+
+export { AnnotationEditor, BottomBar, CoverPreview, DocumentActionsSheet, IconPageNav, InfoSheet, MOBILE_CHROME_METRICS, MobilePerfProvider, DedicatedAndroidPdfViewer as NativePdfDocumentViewer, OverflowSheet, _default as PageRenderer, ProgressPill, ReadingShell, RightSheet, SearchOverlay, SearchResultsSheet, SettingsSheet, ToolDock, Topbar, Viewer, createPerfSession, createRunId, useMobilePerf };

package/dist/index.js

@@ -22176,6 +22176,7 @@ __export(ui_react_native_exports, {
   BottomBar: () => BottomBar_default,
   CoverPreview: () => CoverPreview_default,
   DocumentActionsSheet: () => DocumentActionsSheet,
+  IconPageNav: () => IconPageNav,
   InfoSheet: () => InfoSheet,
   MOBILE_CHROME_METRICS: () => MOBILE_CHROME_METRICS,
   MobilePerfProvider: () => MobilePerfProvider,
@@ -27137,6 +27138,17 @@ var Viewer = ({
     },
     [scaledListLayoutMetrics]
   );
+  const scrollToPendingTarget = (0, import_react5.useCallback)(
+    (animated) => {
+      const target = pendingScrollTargetRef.current;
+      if (target === null || listRef.current === null) return;
+      listRef.current.scrollToOffset({
+        offset: Math.max(0, getFallbackOffsetForIndex(target.listIndex)),
+        animated
+      });
+    },
+    [getFallbackOffsetForIndex]
+  );
   const restoreOrientationScrollOffset = (0, import_react5.useCallback)(() => {
     if (pendingOrientationRestoreWidthRef.current !== windowWidth || pageCount <= 0 || isSingle || isWebView) {
       return;
@@ -27167,6 +27179,11 @@ var Viewer = ({
     }
     restoreOrientationScrollOffset();
   }, [restoreOrientationScrollOffset, windowWidth]);
+  (0, import_react5.useEffect)(() => {
+    if (pendingScrollTargetRef.current !== null) {
+      scrollToPendingTarget(false);
+    }
+  }, [layoutRevision, scrollToPendingTarget]);
   const getItemLayout = (0, import_react5.useCallback)(
     (_, index) => {
       if (scaledListLayoutMetrics.itemCount === 0) {
@@ -27237,15 +27254,12 @@ var Viewer = ({
       },
       "scrollToPageSignal.flatList"
     );
-    listRef.current?.scrollToIndex({
-      index: target.listIndex,
-      animated: true,
-      viewPosition: 0
-    });
+    scrollToPendingTarget(true);
   }, [
     clearPendingScrollRetry,
     clearPendingScrollTarget,
     ensurePageDimensions,
+    scrollToPendingTarget,
     scrollToPageSignal,
     pageCount,
     setDocumentStateTracked,
@@ -27637,9 +27651,11 @@ var Viewer = ({
               onLayout: () => {
                 captureViewerFrame(listRef.current);
                 restoreOrientationScrollOffset();
+                scrollToPendingTarget(false);
               },
               onContentSizeChange: (_, height) => {
                 viewerContentHeightRef.current = height;
+                scrollToPendingTarget(false);
               },
               onScrollToIndexFailed: ({ index, averageItemLength }) => {
                 const dataLength = isDouble ? rows.length : pages.length;
@@ -27861,25 +27877,73 @@ function NativeSheet({
 }) {
   const insets = usePapyrusSafeAreaInsets();
   const palette = getNativeSheetPalette(Boolean(isDark));
+  const { height: windowHeight } = (0, import_react_native5.useWindowDimensions)();
+  const [rendered, setRendered] = (0, import_react7.useState)(visible);
+  const renderedRef = (0, import_react7.useRef)(visible);
+  const motion = (0, import_react7.useRef)(new import_react_native5.Animated.Value(visible ? 0 : 1)).current;
+  const backdropOpacity = (0, import_react7.useRef)(new import_react_native5.Animated.Value(visible ? 1 : 0)).current;
+  (0, import_react7.useEffect)(() => {
+    motion.stopAnimation();
+    backdropOpacity.stopAnimation();
+    if (visible) {
+      renderedRef.current = true;
+      setRendered(true);
+      motion.setValue(1);
+      backdropOpacity.setValue(0);
+      import_react_native5.Animated.parallel([
+        import_react_native5.Animated.spring(motion, {
+          toValue: 0,
+          damping: 22,
+          stiffness: 220,
+          mass: 0.8,
+          useNativeDriver: true
+        }),
+        import_react_native5.Animated.timing(backdropOpacity, {
+          toValue: 1,
+          duration: 180,
+          useNativeDriver: true
+        })
+      ]).start();
+      return;
+    }
+    if (!renderedRef.current) return;
+    import_react_native5.Animated.parallel([
+      import_react_native5.Animated.timing(motion, {
+        toValue: 1,
+        duration: 180,
+        useNativeDriver: true
+      }),
+      import_react_native5.Animated.timing(backdropOpacity, {
+        toValue: 0,
+        duration: 140,
+        useNativeDriver: true
+      })
+    ]).start(({ finished }) => {
+      if (!finished) return;
+      renderedRef.current = false;
+      setRendered(false);
+    });
+  }, [backdropOpacity, motion, visible]);
+  if (!rendered) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     import_react_native5.Modal,
     {
-      animationType: "fade",
+      animationType: "none",
       transparent: true,
-      visible,
+      visible: rendered,
       onRequestClose: onClose,
       children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_native5.View, { style: styles5.root, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_native5.Animated.View, { style: [styles5.backdrop, { opacity: backdropOpacity }], children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
           import_react_native5.Pressable,
           {
             accessibilityRole: "button",
             accessibilityLabel: closeAccessibilityLabel,
-            style: styles5.backdrop,
+            style: import_react_native5.StyleSheet.absoluteFill,
             onPress: onClose
           }
-        ),
+        ) }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-          import_react_native5.View,
+          import_react_native5.Animated.View,
           {
             style: [
               styles5.sheet,
@@ -27890,7 +27954,17 @@ function NativeSheet({
                 backgroundColor: palette.backgroundColor,
                 borderTopColor: palette.borderColor
               },
-              sheetStyle
+              sheetStyle,
+              {
+                transform: [
+                  {
+                    translateY: motion.interpolate({
+                      inputRange: [0, 1],
+                      outputRange: [0, windowHeight]
+                    })
+                  }
+                ]
+              }
             ],
             children: [
               showHeader ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_native5.View, { style: styles5.header, children: [
@@ -32871,7 +32945,11 @@ function ReadingShell({
           setSearchResultsOpen(false);
           closeMobileDestination();
         },
-        onOpenResults: () => setSearchResultsOpen(true)
+        onOpenResults: () => {
+          import_react_native20.Keyboard.dismiss();
+          setSearchResultsOpen(true);
+          closeMobileDestination();
+        }
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
@@ -32967,6 +33045,7 @@ var styles20 = import_react_native20.StyleSheet.create({
   BottomBar,
   CoverPreview,
   DocumentActionsSheet,
+  IconPageNav,
   InfoSheet,
   MOBILE_CHROME_METRICS,
   MobilePerfProvider,