SSR support

[hkalbasi]

Accessing document in top level cause problems in server side rendering. There is one of them at util.js:43 but maybe there is more. With typeof document === 'undefined' we can find out that it code is in node or browser and don't access dom in case of node. An if (typeof document === 'undefined') return () => ({}); in the util.js should work if I understand your code correctly.

[fableforce]

I second this. Frustrating to use this library in NextJS.

[Matheswaaran]

@fableforce This can be solved by dynamically importing the Impress component using next/dynamic

Here is an example on how I have consumed React-impressJS in a NextJs App

Use the following code in the pages/index.js

import dynamic from 'next/dynamic'

const Impress = dynamic(
  () => import('../components/Impress'),
  {ssr: false}
);

export default function Home() {
  return (
    <Impress/>
  );
}

And in components/Impress.js:

import {Impress, Step} from 'react-impressjs';
import React from "react";

const HomeSections = () => {
  return (
    <Impress fallbackMessage="Sorry, your device or browser couldn't support well.">
      <Step
        id="step-1"
        data={{ x: -1000, y: -1500 }}
      >
        Step 1
      </Step>
      <Step
        id="step-2"
        data={{ x: -300, y: -1500 }}
      >
        Step 2
      </Step>
    </Impress>
  );
};

export default ImpressContainer;

I have written my site using this package. Please refer the code in the repo matheswaaran/matheswaaran.com

@GeorgioWan Thanks for this package.