react-native-simple-epub-reader 0.1.0

package/lib/typescript/src/types/index.d.ts

@@ -0,0 +1,72 @@
+import type { GestureUpdateEvent, PinchGestureHandlerEventPayload } from 'react-native-gesture-handler';
+export interface LocationChangeData {
+    totalLocations: number;
+    currentLocation: Location;
+    progress: number;
+    currentSection: Section | null;
+}
+export type Location = {
+    atStart?: boolean;
+    atEnd?: boolean;
+    end: {
+        cfi: ePubCfi;
+        displayed: {
+            page: number;
+            total: number;
+        };
+        href: string;
+        index: number;
+        location: number;
+        percentage: number;
+    };
+    start: {
+        cfi: ePubCfi;
+        displayed: {
+            page: number;
+            total: number;
+        };
+        href: string;
+        index: number;
+        location: number;
+        percentage: number;
+    };
+};
+export type Section = {
+    id: string;
+    href: string;
+    label: string;
+    parent?: any;
+    subitems: any[];
+};
+/**
+ * @example
+ * ````
+ * epubcfi(/6/6!/4/2,/2/2/1:0,/4[q1]/2/14/2/1:14)
+ * ````
+ */
+export type ePubCfi = string;
+export declare enum SourceType {
+    EPUB = "epub"
+}
+export type Theme = {
+    [key: string]: {
+        [key: string]: string;
+    };
+};
+export interface GestureHandlerProps {
+    onSwipeLeft?: () => void;
+    onSwipeRight?: () => void;
+    onTap?: () => void;
+    onPinch?: (e: GestureUpdateEvent<PinchGestureHandlerEventPayload>) => void;
+}
+export type ReaderProps = {
+    src: string;
+    initialLocation?: string;
+    onLocationChange?: (data: LocationChangeData) => void;
+    onLocationsReady?: (epubKey: string, locations: ePubCfi[]) => void;
+    onFinish?: () => void;
+    onBeginning?: () => void;
+    LoaderComponent?: React.ComponentType;
+} & GestureHandlerProps;
+export type Flow = 'paginated' | 'scrolled-doc';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,kBAAkB,EAClB,+BAA+B,EAChC,MAAM,8BAA8B,CAAC;AAEtC,MAAM,WAAW,kBAAkB;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,QAAQ,CAAC;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,OAAO,GAAG,IAAI,CAAC;CAChC;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,GAAG,EAAE;QACH,GAAG,EAAE,OAAO,CAAC;QACb,SAAS,EAAE;YACT,IAAI,EAAE,MAAM,CAAC;YACb,KAAK,EAAE,MAAM,CAAC;SACf,CAAC;QACF,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,KAAK,EAAE;QACL,GAAG,EAAE,OAAO,CAAC;QACb,SAAS,EAAE;YACT,IAAI,EAAE,MAAM,CAAC;YACb,KAAK,EAAE,MAAM,CAAC;SACf,CAAC;QACF,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;QACjB,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,QAAQ,EAAE,GAAG,EAAE,CAAC;CACjB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,OAAO,GAAG,MAAM,CAAC;AAE7B,oBAAY,UAAU;IACpB,IAAI,SAAS;CACd;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;CACH,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,kBAAkB,CAAC,+BAA+B,CAAC,KAAK,IAAI,CAAC;CAC5E;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACtD,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,IAAI,CAAC;IACnE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACvC,GAAG,mBAAmB,CAAC;AAExB,MAAM,MAAM,IAAI,GAAG,WAAW,GAAG,cAAc,CAAC"}

package/lib/typescript/src/types/state.types.d.ts

@@ -0,0 +1,83 @@
+import type { ePubCfi, Flow, Location, Section, Theme } from './index';
+export declare enum Actions {
+    CHANGE_FONT_SIZE = "CHANGE_FONT_SIZE",
+    SET_AT_START = "SET_AT_START",
+    SET_AT_END = "SET_AT_END",
+    SET_KEY = "SET_KEY",
+    SET_TOTAL_LOCATIONS = "SET_TOTAL_LOCATIONS",
+    SET_CURRENT_LOCATION = "SET_CURRENT_LOCATION",
+    SET_META = "SET_META",
+    SET_PROGRESS = "SET_PROGRESS",
+    SET_LOCATIONS = "SET_LOCATIONS",
+    SET_IS_LOADING = "SET_IS_LOADING",
+    SET_IS_RENDERING = "SET_IS_RENDERING",
+    SET_SECTION = "SET_SECTION",
+    SET_TOC = "SET_TOC",
+    SET_LANDMARKS = "SET_LANDMARKS",
+    SET_FLOW = "SET_FLOW",
+    CHANGE_THEME = "CHANGE_THEME",
+    CHANGE_FONT_FAMILY = "CHANGE_FONT_FAMILY"
+}
+type BookPayload = {
+    [Actions.CHANGE_THEME]: Theme;
+    [Actions.CHANGE_FONT_SIZE]: string;
+    [Actions.SET_AT_START]: boolean;
+    [Actions.SET_AT_END]: boolean;
+    [Actions.SET_KEY]: string;
+    [Actions.SET_TOTAL_LOCATIONS]: number;
+    [Actions.SET_CURRENT_LOCATION]: Location;
+    [Actions.SET_META]: {
+        cover: string | ArrayBuffer | null | undefined;
+        author: string;
+        title: string;
+        description: string;
+        language: string;
+        publisher: string;
+        rights: string;
+    };
+    [Actions.SET_PROGRESS]: number;
+    [Actions.SET_LOCATIONS]: ePubCfi[];
+    [Actions.SET_IS_LOADING]: boolean;
+    [Actions.SET_IS_RENDERING]: boolean;
+    [Actions.SET_SECTION]: Section | null;
+    [Actions.SET_FLOW]: Flow;
+    [Actions.CHANGE_FONT_FAMILY]: string;
+};
+type ActionMap<M extends {
+    [index: string]: unknown;
+}> = {
+    [Key in keyof M]: M[Key] extends undefined ? {
+        type: Key;
+    } : {
+        type: Key;
+        payload: M[Key];
+    };
+};
+export type BookActions = ActionMap<BookPayload>[keyof ActionMap<BookPayload>];
+export type InitialState = {
+    theme: Theme;
+    fontFamily: string;
+    fontSize: string;
+    atStart: boolean;
+    atEnd: boolean;
+    key: string;
+    totalLocations: number;
+    currentLocation: Location | null;
+    meta: {
+        cover: string | ArrayBuffer | null | undefined;
+        author: string;
+        title: string;
+        description: string;
+        language: string;
+        publisher: string;
+        rights: string;
+    };
+    progress: number;
+    locations: ePubCfi[];
+    isLoading: boolean;
+    isRendering: boolean;
+    section: Section | null;
+    flow: Flow;
+};
+export {};
+//# sourceMappingURL=state.types.d.ts.map

package/lib/typescript/src/types/state.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.types.d.ts","sourceRoot":"","sources":["../../../../src/types/state.types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,171 @@
+{
+  "name": "react-native-simple-epub-reader",
+  "version": "0.1.0",
+  "description": "Simple ePub renderer for React Native",
+  "main": "./lib/module/index.js",
+  "types": "./lib/typescript/src/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.tsx",
+      "types": "./lib/typescript/src/index.d.ts",
+      "default": "./lib/module/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "src",
+    "lib",
+    "android",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "react-native.config.js",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "scripts": {
+    "watch": "bob build --watch",
+    "example": "yarn workspace react-native-simple-epub-reader-example",
+    "clean": "del-cli lib",
+    "prepare": "bob build",
+    "typecheck": "tsc",
+    "test": "jest",
+    "release": "release-it --only-version",
+    "lint": "eslint \"**/*.{js,ts,tsx}\""
+  },
+  "keywords": [
+    "react-native",
+    "ios",
+    "android"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/marcinradzik81-ui/react-native-simple-epub-reader.git"
+  },
+  "author": "Marcin Radzik <marcinradzik81@gmail.com> (https://github.com/marcinradzik81-ui)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/marcinradzik81-ui/react-native-simple-epub-reader/issues"
+  },
+  "homepage": "https://github.com/marcinradzik81-ui/react-native-simple-epub-reader#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^20.5.0",
+    "@eslint/compat": "^2.0.3",
+    "@eslint/eslintrc": "^3.3.5",
+    "@eslint/js": "^10.0.1",
+    "@jest/globals": "^30.0.0",
+    "@react-native/babel-preset": "0.85.0",
+    "@react-native/eslint-config": "0.85.0",
+    "@react-native/jest-preset": "0.85.0",
+    "@release-it/conventional-changelog": "^10.0.6",
+    "@types/react": "^19.2.0",
+    "commitlint": "^20.5.0",
+    "del-cli": "^7.0.0",
+    "eslint": "^9.39.4",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-ft-flow": "^3.0.11",
+    "eslint-plugin-prettier": "^5.5.5",
+    "expo-file-system": "^55.0.16",
+    "jest": "^30.3.0",
+    "lefthook": "^2.1.4",
+    "prettier": "^3.8.1",
+    "react": "19.1.0",
+    "react-native": "0.81.5",
+    "react-native-builder-bob": "^0.41.0",
+    "react-native-gesture-handler": "^2.31.1",
+    "react-native-webview": "^13.16.1",
+    "release-it": "^19.2.4",
+    "turbo": "^2.8.21",
+    "typescript": "^6.0.2"
+  },
+  "peerDependencies": {
+    "expo-file-system": "*",
+    "react": "*",
+    "react-native": "*",
+    "react-native-gesture-handler": "*",
+    "react-native-webview": "*",
+    "@expo/vector-icons": "*"
+  },
+  "workspaces": [
+    "example"
+  ],
+  "packageManager": "yarn@4.11.0",
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  },
+  "jest": {
+    "preset": "@react-native/jest-preset",
+    "modulePathIgnorePatterns": [
+      "<rootDir>/example/node_modules",
+      "<rootDir>/lib/"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release ${version}",
+      "tagName": "v${version}"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": {
+          "name": "angular"
+        }
+      }
+    }
+  },
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false
+  },
+  "create-react-native-library": {
+    "type": "library",
+    "languages": "js",
+    "tools": [
+      "jest",
+      "lefthook",
+      "release-it",
+      "eslint"
+    ],
+    "version": "0.61.0"
+  }
+}

package/src/components/GestureHandler/index.tsx

@@ -0,0 +1,63 @@
+import type { FC, PropsWithChildren } from 'react';
+
+import {
+  Directions,
+  Gesture,
+  GestureDetector,
+  GestureHandlerRootView,
+} from 'react-native-gesture-handler';
+import type { GestureHandlerProps } from '../../types';
+
+const GestureHandler: FC<PropsWithChildren<GestureHandlerProps>> = ({
+  children,
+  onSwipeLeft,
+  onSwipeRight,
+  onTap,
+  onPinch,
+}) => {
+  const swipeLeftGesture = Gesture.Fling()
+    .runOnJS(true)
+    .direction(Directions.LEFT)
+    .onEnd(() => {
+      onSwipeLeft?.();
+    });
+
+  const swipeRightGesture = Gesture.Fling()
+    .runOnJS(true)
+    .direction(Directions.RIGHT)
+    .onEnd(() => {
+      onSwipeRight?.();
+    });
+
+  const tapGesture = Gesture.Tap()
+    .runOnJS(true)
+    .maxDuration(250)
+    .onStart(() => {
+      onTap?.();
+    });
+
+  const pinchGesture = Gesture.Pinch()
+    .runOnJS(true)
+    .onUpdate((e) => {
+      onPinch?.(e);
+    });
+
+  const combinedGesture = Gesture.Race(
+    Gesture.Exclusive(swipeLeftGesture, swipeRightGesture),
+    tapGesture,
+    pinchGesture
+  );
+  return (
+    <GestureHandlerRootView style={styles.container}>
+      <GestureDetector gesture={combinedGesture}>{children}</GestureDetector>
+    </GestureHandlerRootView>
+  );
+};
+
+const styles = {
+  container: {
+    flex: 1,
+  },
+};
+
+export default GestureHandler;

package/src/components/Reader.tsx

@@ -0,0 +1,262 @@
+import { View, Text, ActivityIndicator, StyleSheet } from 'react-native';
+import { SourceType, type ReaderProps } from '../types';
+import {
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
+import { loadScripts } from '../helpers/loadScripts';
+import { saveTemplateToFile } from '../helpers/saveTemplateToFile';
+import { downloadEpub } from '../helpers/downloadEpub';
+import { Paths } from 'expo-file-system';
+import { useInjectWebViewVariables } from '../hooks/useInjectWebviewVariables';
+import WebView from 'react-native-webview';
+import GestureHandler from './GestureHandler';
+import { defaultTheme as initialTheme } from '../constants/theme';
+import { ReaderContext } from '../context/ReaderContext';
+import type {
+  GestureUpdateEvent,
+  PinchGestureHandlerEventPayload,
+} from 'react-native-gesture-handler';
+
+const Reader = ({
+  src,
+  onTap,
+  onSwipeLeft,
+  onSwipeRight,
+  initialLocation,
+  onLocationsReady = () => {},
+  onLocationChange = () => {},
+  onFinish = () => {},
+  onBeginning = () => {},
+  onPinch = () => {},
+  LoaderComponent,
+}: ReaderProps) => {
+  const [templateUri, setTemplateUri] = useState<string>('');
+
+  const {
+    registerBook,
+    goNext,
+    goPrevious,
+    setMeta,
+    setLocations,
+    setTotalLocations,
+    setCurrentLocation,
+    setProgress,
+    goToLocation,
+    setAtEnd,
+    setAtStart,
+    fontSize,
+    changeFontSize,
+    setIsLoading,
+    isLoading,
+  } = useContext(ReaderContext);
+
+  const { injectWebViewVariables } = useInjectWebViewVariables();
+  const bookRef = useRef<WebView | null>(null);
+
+  const onMessage = (event: any) => {
+    const parsedEvent = JSON.parse(event.nativeEvent.data);
+
+    switch (parsedEvent.type) {
+      case 'onLocationChange':
+        const { totalLocations, currentLocation, progress, currentSection } =
+          parsedEvent;
+
+        if (currentLocation.atStart) setAtStart(true);
+        else if (currentLocation.atEnd) setAtEnd(true);
+        else {
+          setAtStart(false);
+          setAtEnd(false);
+        }
+
+        onLocationChange?.({
+          totalLocations,
+          currentLocation,
+          progress,
+          currentSection,
+        });
+        break;
+      case 'meta':
+        const { metadata } = parsedEvent;
+        setMeta(metadata);
+        break;
+      case 'onLocationsReady':
+        const props = parsedEvent;
+        setLocations(parsedEvent.locations);
+        setTotalLocations(props.totalLocations);
+        setCurrentLocation(props.currentLocation);
+        setProgress(props.progress);
+
+        return onLocationsReady(props.epubKey, parsedEvent.locations);
+      case 'onReady':
+        if (initialLocation) {
+          goToLocation(initialLocation);
+        }
+        break;
+
+      case 'onBeginning':
+        setAtStart(true);
+
+        return onBeginning();
+
+      case 'onFinish':
+        setAtEnd(true);
+
+        return onFinish();
+
+      default:
+        console.warn('Unknown message type:', parsedEvent.type);
+    }
+  };
+
+  const handleOnTap = () => {
+    onTap?.();
+  };
+
+  const handleOnSwipeLeft = () => {
+    onSwipeLeft?.();
+    goNext();
+  };
+
+  const handleOnSwipeRight = () => {
+    onSwipeRight?.();
+    goPrevious();
+  };
+
+  const handleOnPinch = (
+    e: GestureUpdateEvent<PinchGestureHandlerEventPayload>
+  ) => {
+    const fontSizeValue = parseInt(fontSize.replace('pt', ''), 10);
+
+    const scaleValue = e.scale > 1 ? e.scale * 0.5 : e.scale;
+
+    const newFontSize = fontSizeValue * scaleValue;
+
+    const clampedFontSize = Math.min(Math.max(newFontSize, 6), 32);
+    changeFontSize(`${clampedFontSize}pt`);
+    onPinch?.(e);
+  };
+
+  const htmlTemplateName = useMemo(
+    () => src.split('/').pop()?.replace('.epub', '.html') || 'index.html',
+    [src]
+  );
+
+  const epubFileName = useMemo(
+    () => src.split('/').pop() || 'book.epub',
+    [src]
+  );
+
+  const handleBookRef = useCallback(
+    (instance: WebView | null) => {
+      bookRef.current = instance;
+      if (instance) {
+        registerBook(instance);
+      }
+    },
+    [registerBook]
+  );
+
+  useEffect(() => {
+    let isMounted = true;
+
+    const prepareReader = async () => {
+      try {
+        setIsLoading(true);
+
+        const [, jszip, epubjs] = await loadScripts();
+
+        if (!jszip || !epubjs) throw new Error('Failed to load scripts');
+
+        const localEpubUri = await downloadEpub(src, epubFileName);
+
+        const generatedTemplate = injectWebViewVariables({
+          jszip,
+          epubjs,
+          type: SourceType.EPUB,
+          allowScriptedContent: true,
+          book: localEpubUri,
+          theme: initialTheme,
+        });
+
+        const uri = saveTemplateToFile(generatedTemplate, htmlTemplateName);
+
+        if (isMounted) {
+          setTemplateUri(uri);
+        }
+      } catch (error) {
+        console.error('Reader Error:', error);
+      } finally {
+        if (isMounted) setIsLoading(false);
+      }
+    };
+
+    prepareReader();
+    return () => {
+      isMounted = false;
+    };
+  }, [
+    src,
+    htmlTemplateName,
+    epubFileName,
+    injectWebViewVariables,
+    setIsLoading,
+  ]);
+
+  if (isLoading) {
+    return LoaderComponent ? (
+      <LoaderComponent />
+    ) : (
+      <View style={styles.loaderContainer}>
+        <ActivityIndicator size="large" />
+        <Text>Przygotowuję książkę...</Text>
+      </View>
+    );
+  }
+
+  return (
+    <>
+      <GestureHandler
+        onSwipeLeft={handleOnSwipeLeft}
+        onSwipeRight={handleOnSwipeRight}
+        onTap={handleOnTap}
+        onPinch={handleOnPinch}
+      >
+        <WebView
+          pointerEvents="none"
+          ref={handleBookRef}
+          source={{ uri: templateUri }}
+          showsVerticalScrollIndicator={false}
+          javaScriptEnabled
+          originWhitelist={['*']}
+          scrollEnabled={false}
+          mixedContentMode="compatibility"
+          allowingReadAccessToURL={Paths.document.uri}
+          allowUniversalAccessFromFileURLs
+          allowFileAccessFromFileURLs
+          allowFileAccess
+          javaScriptCanOpenWindowsAutomatically
+          onMessage={onMessage}
+          style={styles.container}
+        />
+      </GestureHandler>
+    </>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+  loaderContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+});
+
+export default Reader;