wind-react-doc-view

Available Scripts

In the project directory, you can run:

yarn add wind-react-doc-view

or

npm i wind-react-doc-view

import { DocIframe } from "wind-react-doc-view";

function App() {
  const [isModal, setisModal] = useState(false);
  const video =
    "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4";
  const pdf = "http://www.africau.edu/images/default/sample.pdf";
  const image =
    "https://i.picsum.photos/id/918/200/300.jpg?hmac=1gEvFp6O-XDh4848VnlwyOIrVy8s_aJNhYyTzxN9_JA";
  const xls = "https://jyoti.co.in/wp-content/uploads/2015/03/sample.xlsx";

  return (
    <div className="App">
      {isModal && (
        <DocIframe onClose={(event) => setisModal(!isModal)} source={pdf} />
      )}
      <div>
        <button
          onClick={() => {
            setisModal(true);
          }}
        >
          Click
        </button>
      </div>
    </div>
  );
}

export default App;