Skip to content

a11ywatch/react-reader

Repository files navigation

react-reader-view

j-mendez

Load any url into clean plain text for reading

Main Feature:

  • This provides a Safari reader mode like feel that display's content cleanly (For Reading)

How to use:

  • Just pass in a Url into the component and your good to go.

If you need to use this natively theres a react-native version react-native-reader

Installation Instructions

$ npm install react-reader-view

Example

Example App

import ReaderView from "react-reader-view";

<ReaderView
  url="https://www.nytimes.com"
  css={`
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    }
  `}
/>;
  • For more help getting started checkout Example

Available Props

prop default type description
url "" string Required: A valid web url source
css "" string Optional: A css stylesheet as a string
renderLoader "Loading..." Component Optional: A custom component to render while your content is being loaded
iframeProps null object Optional: A valid iframe html property
onParse null function Optional: A callback function that returns the readability Object
onError null function Optional: A function that fires the error if a url is not valid
config undefined Config Optional: configure html element determination