react_epub

# React-Epub-Viewer [![Latest Stable Version](https://img.shields.io/npm/v/react-epub-viewer.svg?style=for-the-badge)](https://www.npmjs.com/package/react-epub-viewer) [![License](https://img.shields.io/badge/license-mit-red.svg?style=for-the-badge)](https://www.npmjs.com/package/react-epub-viewer) **React-Epub-Viewer** is Epub Viewer for React.js powered by [Epub.js](https://github.com/futurepress/epub.js/) v0.3 You can use React-Epub-Viewer together with React.
## Getting Started 📢 **[Online demo](https://altmshfkgudtjr.github.io/react-epub-viewer)** **Features** - Table of contents - Setting - Font - Font size - Line height - Viewer horizontal margin - Viewer vertical margin - Change viewer type - Scrolled-doc [`true`/`false`] - Spread [`true`/`false`] - Current Page Information - Current chapter name - Current page number - Total page number - Move page by arrow keys - Highlight (Using `mouseup` event) - Select highlight color ### Getting the Code Install library from [NPM](https://www.npmjs.com/package/react-epub-viewer) ```shell npm install react-epub-viewer ``` Import viewer component ```javascript import { useRef } from 'react' import { EpubViewer, ReactEpubViewer } from 'react-epub-viewer' const App = () => { const viewerRef = useRef(null); return (
); } export default App ``` You can find other parameters in [Component Props](##Component Props).
## Component Props You can see also Types for React-Epub-Viewer [here](https://github.com/altmshfkgudtjr/react-epub-viewer/blob/main/src/types/index.d.ts). ### EpubViewer Props - `ref` [RefObject] Viewer Ref - `url` [string] - Epub file path - `epubFileOptions` - [[object](http://epubjs.org/documentation/0.3/#book)] Epub file option (Epub.js BookOption) - `epubOptions` - [[object](http://epubjs.org/documentation/0.3/#rendition)] Epub viewer option (Epub.js RenditionOption) - `style` - [object] Epub wrapper style - `location` - [string] Epub [CFI](http://idpf.org/epub/linking/cfi/epub-cfi.html) or Spine href - `bookChanged` - [function] Run when epub book changed - `renditionChanged` - [function] Run when rendition changed - `pageChanged` - [function] Run when page changed - `tocChanged` - [function] Run when toc changed - `selectionChanged` - [function] Run when selected - `loadingView` - [ReactNode] React Loading Component ### ReactEpubViewer Props - `ref` [RefObject] Viewer Ref - `url` [string] - Epub file path - `viewerLayout` - [object] Viewer layout values (header height, footer height, etc...) - `viewerOption` - [object] Viewer option (whether is flow or is spread) - `onBookInfoChange` - [function] Run when book information changed - `onPageChange ` - [function] Run when page changed - `onTocChange ` - [function] Run when toc changed - `onSelection ` - [function] Run when selected - `loadingView` - [ReactNode] React Loading Component
---