react-native-readium 4.0.2 → 5.0.0-rc.1

package/lib/web/hooks/useReaderRef.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type { ReadiumProps } from '../../src/components/ReadiumView';
-export declare const useReaderRef: ({ file, onLocationChange, onTableOfContents, }: Pick<ReadiumProps, 'file' | 'onLocationChange' | 'onTableOfContents'>) => import("react").MutableRefObject<import("@d-i-t-a/reader").default | null>;

package/lib/web/hooks/useReaderRef.js

@@ -1,85 +0,0 @@
-import { useCallback, useEffect, useRef } from 'react';
-export const useReaderRef = ({ file, onLocationChange, onTableOfContents, }) => {
-    const readerRef = useRef(null);
-    const readingOrder = useRef([]);
-    const onLocationChangeWithTotalProgression = useCallback((newLocation) => {
-        if (!onLocationChange ||
-            !readingOrder.current ||
-            !newLocation.locations) {
-            return;
-        }
-        if (!newLocation.locations.totalProgression) {
-            const newLocationIndex = readingOrder.current.findIndex((entry) => entry.href === newLocation.href);
-            if (newLocationIndex < 0 || !readingOrder.current[newLocationIndex]) {
-                return;
-            }
-            const readingOrderCount = readingOrder.current.length;
-            const chapterTotalProgression = readingOrder.current[newLocationIndex].locations?.totalProgression ||
-                0;
-            const intraChapterTotalProgression = newLocation.locations.progression / readingOrderCount;
-            newLocation.locations.totalProgression =
-                chapterTotalProgression + intraChapterTotalProgression;
-        }
-        onLocationChange(newLocation);
-    }, [onLocationChange]);
-    useEffect(() => {
-        async function run() {
-            const D2Reader = await import('@d-i-t-a/reader');
-            const ref = await D2Reader.load({
-                url: new URL(file.url),
-                lastReadingPosition: file.initialLocation,
-                userSettings: { verticalScroll: false },
-                api: {
-                    updateCurrentLocation: async (location) => {
-                        onLocationChangeWithTotalProgression(location);
-                        return location;
-                    },
-                },
-                injectables: injectables,
-            });
-            if (onTableOfContents) {
-                onTableOfContents(ref.tableOfContents);
-            }
-            // This way of estimating the totalProgression treats all reading order
-            // entries as equal in length.
-            // It is based on the implementation in the Readium Go toolkit
-            // https://github.com/readium/go-toolkit/blob/31c6a65b588f825ffb6b4f2445337ffdc53af685/pkg/pub/service_positions.go#L66
-            const oldReadingOrder = ref.readingOrder;
-            const readingOrderCount = oldReadingOrder.length;
-            readingOrder.current = oldReadingOrder.map((item, index) => {
-                const totalProgression = index / readingOrderCount;
-                return {
-                    ...item,
-                    locations: {
-                        ...item.locations,
-                        progression: 0,
-                        totalProgression: totalProgression,
-                    },
-                };
-            });
-            readerRef.current = ref;
-        }
-        run();
-    }, [file.url]);
-    return readerRef;
-};
-// NOTE: right now we're serving these through statically.io, which is just
-// pulling them from Github... Might not be the best way and maybe we should
-// consider bundling them with the library.
-const injectables = [
-    {
-        type: 'style',
-        url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-before.css',
-        r2before: true,
-    },
-    {
-        type: 'style',
-        url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-default.css',
-        r2default: true,
-    },
-    {
-        type: 'style',
-        url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-after.css',
-        r2after: true,
-    },
-];

package/lib/web/hooks/useSettingsObserver.d.ts

@@ -1,2 +0,0 @@
-import type { Preferences } from '../../src/interfaces';
-export declare const useSettingsObserver: (reader?: D2Reader | null, preferences?: Partial<Preferences> | null) => void;

package/lib/web/hooks/useSettingsObserver.js

@@ -1,44 +0,0 @@
-import { useDeepCompareEffect } from 'use-deep-compare';
-export const useSettingsObserver = (reader, preferences) => {
-    useDeepCompareEffect(() => {
-        if (reader && preferences) {
-            const settings = preferencesToUserSettings(preferences);
-            reader?.applyUserSettings(settings);
-        }
-    }, [preferences, !!reader]);
-};
-const preferencesToUserSettings = (preferences) => ({
-    appearance: preferences.theme
-        ? themeToUserSettingsAppearance(preferences.theme)
-        : undefined,
-    fontSize: preferences.fontSize ? preferences.fontSize * 100 : undefined,
-    // fontOverride: boolean;
-    // fontFamily: number;
-    verticalScroll: preferences.scroll,
-    columnCount: columnCountToUserSettingsColumnCount(preferences.columnCount),
-    // direction: number;
-    wordSpacing: preferences.wordSpacing,
-    letterSpacing: preferences.letterSpacing,
-    pageMargins: preferences.pageMargins,
-    lineHeight: preferences.lineHeight,
-    // userProperties?: UserProperties;
-    // view: BookView;
-});
-const themeToUserSettingsAppearance = (theme) => {
-    if (theme === 'dark') {
-        return 'night';
-    }
-    if (theme === 'sepia') {
-        return 'sepia';
-    }
-    return 'day';
-};
-const columnCountToUserSettingsColumnCount = (columnCount) => {
-    if (columnCount === '1') {
-        return 1;
-    }
-    if (columnCount === '2') {
-        return 2;
-    }
-    return undefined;
-};

package/src/components/BaseReadiumView.tsx

@@ -1,11 +0,0 @@
-import { requireNativeComponent, UIManager } from 'react-native';
-
-import type { BaseReadiumViewProps } from '../interfaces';
-import { COMPONENT_NAME, LINKING_ERROR } from '../utils';
-
-export const BaseReadiumView =
-  UIManager.getViewManagerConfig(COMPONENT_NAME) != null
-    ? requireNativeComponent<BaseReadiumViewProps>(COMPONENT_NAME)
-    : () => {
-        throw new Error(LINKING_ERROR);
-      };

package/src/components/BaseReadiumView.web.tsx

@@ -1 +0,0 @@
-export const BaseReadiumView = () => null;

package/src/enums/Appearance.ts

@@ -1,14 +0,0 @@
-// NOTE: readium uses an index so the order is very important here
-export enum Appearance {
-  /**
-   * A traditional "light" mode
-   */
-  DEFAULT = 'readium-default-on',
-
-  SEPIA = 'readium-sepia-on',
-
-  /**
-   * A traditional "dark" mode
-   */
-  NIGHT = 'readium-night-on',
-}

package/src/enums/ColumnCount.ts

@@ -1,6 +0,0 @@
-// NOTE: readium uses an index so the order is very important here
-export enum ColumnCount {
-  AUTO = 'auto',
-  ONE = '1',
-  TWO = '2',
-}

package/src/enums/FontFamily.ts

@@ -1,11 +0,0 @@
-// NOTE: readium uses an index so the order is very important here
-export enum FontFamily {
-  ORIGINAL = 'Original',
-  HELVETICA_NEUE = 'Helvetica Neue',
-  IOWAN_OLD_STYLE = 'Iowan Old Style',
-  ATHELAS = 'Athelas',
-  SERAVEK = 'Seravek',
-  OPEN_DYSLEXIC = 'OpenDyslexic',
-  ACCESSIBLE_DFA = 'AccessibleDfA',
-  IA_WRITER_DUOSPACE = 'IA Writer Duospace',
-}

package/src/enums/TextAlignment.ts

@@ -1,5 +0,0 @@
-// NOTE: readium uses an index so the order is very important here
-export enum TextAlignment {
-  JUSTIFY = 'justify',
-  START = 'start',
-}

package/src/enums/index.ts

@@ -1,4 +0,0 @@
-export * from './Appearance';
-export * from './ColumnCount';
-export * from './FontFamily';
-export * from './TextAlignment';

package/src/interfaces/BaseReadiumViewProps.ts

@@ -1,16 +0,0 @@
-import type { ViewStyle } from 'react-native';
-import type { Link } from './Link';
-import type { Locator } from './Locator';
-import type { File } from './File';
-
-export type BaseReadiumViewProps = {
-  file: File;
-  location?: Locator | Link;
-  preferences?: string; // JSON between native and JS, which we deserialise later
-  style?: ViewStyle;
-  onLocationChange?: (locator: Locator) => void;
-  onTableOfContents?: (toc: Link[] | null) => void;
-  ref?: any;
-  height?: number;
-  width?: number;
-};

package/src/utils/COMPONENT_NAME.ts

@@ -1 +0,0 @@
-export const COMPONENT_NAME = 'ReadiumView';

package/src/utils/LINKING_ERROR.ts

@@ -1,7 +0,0 @@
-import { Platform } from 'react-native';
-
-export const LINKING_ERROR =
-  `The package 'react-native-readium' doesn't seem to be linked. Make sure: \n\n` +
-  Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) +
-  '- You rebuilt the app after installing the package\n' +
-  '- You are not using Expo managed workflow\n';

package/src/utils/clamp.ts

@@ -1,5 +0,0 @@
-export const clamp = (val: number, lower: number, upper: number): number => {
-  if (val < lower) return lower;
-  if (val > upper) return upper;
-  return val;
-};

package/src/utils/createFragment.ts

@@ -1,15 +0,0 @@
-import { UIManager } from 'react-native';
-
-import { COMPONENT_NAME } from './COMPONENT_NAME';
-
-export const createFragment = (viewId: number | null) => {
-  if (viewId !== null) {
-    UIManager.dispatchViewManagerCommand(
-      viewId,
-      // we are calling the 'create' command
-      // @ts-ignore
-      UIManager.getViewManagerConfig(COMPONENT_NAME).Commands.create.toString(),
-      [viewId]
-    );
-  }
-};

package/src/utils/getWidthOrHeightValue.ts

@@ -1,7 +0,0 @@
-import { Platform, PixelRatio } from 'react-native';
-
-export const getWidthOrHeightValue = (val: number) => {
-  return Platform.OS === 'android'
-    ? PixelRatio.getPixelSizeForLayoutSize(val)
-    : val;
-};

package/src/utils/indexOfObjectValue.ts

@@ -1,3 +0,0 @@
-export const indexOfObjectValue = (obj: any, val: any): number => {
-  return Object.values(obj).indexOf(val);
-};

package/web/hooks/useReaderRef.ts

@@ -1,109 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-
-import type { ReadiumProps } from '../../src/components/ReadiumView';
-import type { Locator } from '../../src/interfaces';
-
-export const useReaderRef = ({
-  file,
-  onLocationChange,
-  onTableOfContents,
-}: Pick<ReadiumProps, 'file' | 'onLocationChange' | 'onTableOfContents'>) => {
-  const readerRef = useRef<D2Reader | null>(null);
-  const readingOrder = useRef<Locator[]>([]);
-
-  const onLocationChangeWithTotalProgression = useCallback(
-    (newLocation: Locator) => {
-      if (
-        !onLocationChange ||
-        !readingOrder.current ||
-        !newLocation.locations
-      ) {
-        return;
-      }
-      if (!newLocation.locations.totalProgression) {
-        const newLocationIndex = readingOrder.current.findIndex(
-          (entry) => entry.href === newLocation.href
-        );
-        if (newLocationIndex < 0 || !readingOrder.current[newLocationIndex]) {
-          return;
-        }
-        const readingOrderCount = readingOrder.current.length;
-        const chapterTotalProgression =
-          readingOrder.current[newLocationIndex].locations?.totalProgression ||
-          0;
-        const intraChapterTotalProgression =
-          newLocation.locations.progression / readingOrderCount;
-        newLocation.locations.totalProgression =
-          chapterTotalProgression + intraChapterTotalProgression;
-      }
-      onLocationChange(newLocation);
-    },
-    [onLocationChange]
-  );
-
-  useEffect(() => {
-    async function run() {
-      const D2Reader = await import('@d-i-t-a/reader');
-      const ref = await D2Reader.load({
-        url: new URL(file.url),
-        lastReadingPosition: file.initialLocation,
-        userSettings: { verticalScroll: false },
-        api: {
-          updateCurrentLocation: async (location: Locator) => {
-            onLocationChangeWithTotalProgression(location);
-            return location;
-          },
-        },
-        injectables: injectables,
-      });
-
-      if (onTableOfContents) {
-        onTableOfContents(ref.tableOfContents);
-      }
-
-      // This way of estimating the totalProgression treats all reading order
-      // entries as equal in length.
-      // It is based on the implementation in the Readium Go toolkit
-      // https://github.com/readium/go-toolkit/blob/31c6a65b588f825ffb6b4f2445337ffdc53af685/pkg/pub/service_positions.go#L66
-      const oldReadingOrder: Locator[] = ref.readingOrder;
-      const readingOrderCount = oldReadingOrder.length;
-      readingOrder.current = oldReadingOrder.map((item, index) => {
-        const totalProgression = index / readingOrderCount;
-        return {
-          ...item,
-          locations: {
-            ...item.locations,
-            progression: 0,
-            totalProgression: totalProgression,
-          },
-        };
-      });
-
-      readerRef.current = ref;
-    }
-    run();
-  }, [file.url]);
-
-  return readerRef;
-};
-
-// NOTE: right now we're serving these through statically.io, which is just
-// pulling them from Github... Might not be the best way and maybe we should
-// consider bundling them with the library.
-const injectables: any[] = [
-  {
-    type: 'style',
-    url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-before.css',
-    r2before: true,
-  },
-  {
-    type: 'style',
-    url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-default.css',
-    r2default: true,
-  },
-  {
-    type: 'style',
-    url: 'https://cdn.statically.io/gh/d-i-t-a/R2D2BC@production/viewer/readium-css/ReadiumCSS-after.css',
-    r2after: true,
-  },
-];

package/web/hooks/useSettingsObserver.ts

@@ -1,61 +0,0 @@
-import { useDeepCompareEffect } from 'use-deep-compare';
-
-import type { Preferences } from '../../src/interfaces';
-
-export const useSettingsObserver = (
-  reader?: D2Reader | null,
-  preferences?: Partial<Preferences> | null
-) => {
-  useDeepCompareEffect(() => {
-    if (reader && preferences) {
-      const settings = preferencesToUserSettings(preferences);
-      reader?.applyUserSettings(settings);
-    }
-  }, [preferences, !!reader]);
-};
-
-const preferencesToUserSettings = (
-  preferences: Preferences
-): Partial<D2UserSettings> => ({
-  appearance: preferences.theme
-    ? themeToUserSettingsAppearance(preferences.theme)
-    : undefined,
-  fontSize: preferences.fontSize ? preferences.fontSize * 100 : undefined,
-  // fontOverride: boolean;
-  // fontFamily: number;
-  verticalScroll: preferences.scroll,
-  columnCount: columnCountToUserSettingsColumnCount(preferences.columnCount),
-  // direction: number;
-  wordSpacing: preferences.wordSpacing,
-  letterSpacing: preferences.letterSpacing,
-  pageMargins: preferences.pageMargins,
-  lineHeight: preferences.lineHeight,
-  // userProperties?: UserProperties;
-  // view: BookView;
-});
-
-const themeToUserSettingsAppearance = (theme: Preferences['theme']) => {
-  if (theme === 'dark') {
-    return 'night';
-  }
-
-  if (theme === 'sepia') {
-    return 'sepia';
-  }
-
-  return 'day';
-};
-
-const columnCountToUserSettingsColumnCount = (
-  columnCount: Preferences['columnCount']
-) => {
-  if (columnCount === '1') {
-    return 1;
-  }
-
-  if (columnCount === '2') {
-    return 2;
-  }
-
-  return undefined;
-};