Quick Start

Isoflow can be imported as an ES6 module:

import Isoflow from "isoflow";

Basic usage

import React from 'react';
import Isoflow from 'isoflow';

const App = () => {
  return (
    <Isoflow />
  );
}

export default App;

Note: this will display a blank Isoflow editor, without icons (which is not very useful!). To initialise the editor with an iconset, see Loading Isopacks.

Dimensions of Isoflow

Isoflow takes 100% of width and height of the containing block so make sure the container in which you render Isoflow in has non-zero dimensions.

Integration with NextJS

Isoflow cannot be server-side rendered and has to be imported using next/dyanmic:

import dynamic from 'next/dynamic';

export const IsoflowDynamic = dynamic(() => {
    return import('isoflow');
  },
  {
    ssr: false
  }
);

import { IsoflowDynamic } from './IsoflowDynamic';

const App = () => {
  return (
    <IsoflowDynamic />
  );
}

export default App;