This section describes how to serialize a dockview instance.

onDidLayoutChange	Invoked when any layout change occures, an aggregation of many events. onDidLayoutChange: Event<void>
toJSON	Create a serialized object of the current component. toJSON(): SerializedDockview

To retrieve the current state of the dock call toJSON(). You can listen to the event onDidlayoutChange to determine when the layout has changed.

const [api, setApi] = React.useState<DockviewApi>();

React.useEffect(() => {
  if(!api) {
    return;
  }

  const disposable = api.onDidLayoutChange(() => {
    const layout: SerializedDockview = api.toJSON();
    localStorage.setItem('my_layout', JSON.stringify(layout));
  });

  return () => disposable.dispose();
}, [api]);

const onReady = (event: DockviewReadyEvent) => {
  setApi(event.api);
}

return <DockviewComponent onReady={onReady}/>

Live Example