Open abhishekmg opened 5 months ago
I'm searching similar
You can achieve it using local storage.
Here is the sample code.
import { Allotment } from "allotment"
const LOCAL_STORAGE_KEY = "splitSizes"
let initialSizes = [500, 500, 500]
if (typeof window !== "undefined") {
const savedSizes = localStorage.getItem(LOCAL_STORAGE_KEY)
if (savedSizes) {
initialSizes = JSON.parse(savedSizes)
}
}
function Test() {
return (
<>
<Allotment
defaultSizes={initialSizes}
onDragEnd={(sizes) => {
if (typeof window !== "undefined") {
localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(sizes))
}
}}
>
<div>First</div>
<div>Second</div>
<div>Third</div>
</Allotment>
</>
)
}
export default Test
When the changes the width of a pane and then refreshes the changes width needs to persist
current behaviour
https://github.com/johnwalley/allotment/assets/34393560/1820c05d-8c58-411c-9776-fb59bc3182ba