mirador-mosaic
mirador-mosaic provides a tiling window manager for organizing a workspace of windows. mirador-mosaic is built around CSS Grids and provides flexible layout options for the end-user and developer.
The storybook is available on the demo site.
Usage
2-up image viewer
import { Grid } from 'mirador-mosaic';
import Window from './Window';
export default const App = () => (
<Grid><Window id="a">A</Window><Window id="b">B</Window></Grid>
);
Using a pre-defined layout
import { Grid } from 'mirador-mosaic';
import Window from './Window';
export default const App = () => (
<Grid initialLayout={{ rows: [1, 1], columns: [1, 1], areas: [["a","a"], ["b", "c"]] }}><Window id="a">A</Window><Window id="b">B</Window></Grid>
);