Flickering when using three panels

I am using three horizontally aligned panels. There is some flickering occurring on the right panel whenever I resize with the left handle. I tried to fix this by saving the layout with a cookie as is mentioned in the documentation, but that doesn't seem to fix it. This issue occurs regardless of whether I use client or server components. I set up a codesanbox as an example using only client components. The flickering occurs only on some positions of the right handle. I noticed, that this effect is not present in versions 0.0.55 and below.

Locally I set up an example with a server component as in the documentation. Here this issue is also arising. I a am using version 12.0.13 in this example.

Server component:

import { cookies } from "next/headers";
import ClientComponent from "./ClientComponent";

export default function Home() {
  const layout = cookies().get("react-resizable-panels:layout");

  let defaultLayout;
  if (layout) {
    defaultLayout = JSON.parse(layout.value);
  }

  return <ClientComponent defaultLayout={defaultLayout} />;
}

Client component:

"use client";

import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";

export default function ClientComponent({
  defaultLayout = [30, 40, 30],
}: {
  defaultLayout: number[] | undefined;
}) {
  const onLayout = (sizes: number[]) => {
    document.cookie = `react-resizable-panels:layout=${JSON.stringify(sizes)}`;
  };

  return (
    <PanelGroup direction="horizontal" onLayout={onLayout}>
      <Panel
        className="bg-slate-100 rounded-lg flex items-center justify-center text-center p-2"
        defaultSize={30}
        minSize={10}
      >
        Left panel
      </Panel>
      <PanelResizeHandle className="mx-1 w-2 bg-slate-300" />
      <Panel
        className="bg-slate-100 rounded-lg flex items-center justify-center text-center p-2"
        defaultSize={30}
        minSize={10}
      >
        Middle panel
      </Panel>
      <PanelResizeHandle className="mx-1 w-2 bg-slate-300" />
      <Panel
        className="bg-slate-100 rounded-lg flex items-center justify-center text-center p-2"
        defaultSize={40}
        minSize={10}
      >
        Right panel
      </Panel>
    </PanelGroup>
  );
}

bvaughn / react-resizable-panels

Flickering when using three panels #322