A minimal, unstyled React component library for rendering and interacting with ebooks in web applications.
npm install react-ebookjs
A minimal, unstyled React component library for rendering and interacting with ebooks in web applications.
react-ebook provides React components and utilities for displaying and navigating ebooks in various formats (EPUB, FB2, Comic Books) in web applications. It is built on top of foliate-js, the JavaScript library that powers the Foliate ebook reader application.
> Note: This package relies on foliate-js, which is currently in development and not yet considered stable. APIs may change in future versions.
- Render ebooks in EPUB, FB2, and Comic Book formats
- Paginated or scrolled reading modes
- Navigation controls (next/previous page)
- Table of contents navigation
- Search functionality
- Customizable text display (font size, line spacing, justification, hyphenation)
- Progress tracking
``bash`
npm install react-ebookjs
`jsx
import { useState } from 'react';
import {
Reader,
ReaderContent,
ReaderNext,
ReaderPrevious,
loadEPUB
} from 'react-ebookjs';
function EbookReader() {
const [book, setBook] = useState(null);
const [progress, setProgress] = useState(0);
const handleFileChange = async (e) => {
const file = e.target.files[0];
if (file) {
const loadedBook = await loadEPUB(file);
setBook(loadedBook);
}
};
if (!book) {
return (
return (
progress={progress}
onProgressChange={setProgress}
>
Philosophy
is intentionally designed to be minimal and unstyled, focusing on functionality rather than appearance. This gives you complete control over the styling and integration with your application's design system.The library provides the core functionality needed to render and interact with ebooks, while leaving the UI implementation details to you. This approach makes it highly flexible and adaptable to different design requirements.
Supported Formats
- EPUB (2 and 3)
- FB2
- Comic Books (CBZ, CBR)
API
$3
-
Reader: The main component that provides the reading context
- ReaderContent: Renders the book content
- ReaderNext: Button component to navigate to the next page
- ReaderPrevious: Button component to navigate to the previous page$3
-
useBookNavigator: Hook for programmatic navigation
- useSearch: Hook for searching within the book$3
-
loadEPUB: Load an EPUB file
- loadFB2: Load an FB2 file
- loadComicBook`: Load a comic book file (CBZ, CBR)This library is built on top of foliate-js, created by John Factotum. Foliate-js is the JavaScript library that powers the Foliate ebook reader application.
MIT