How to pass initial state with Next.js Router.push?

I have an onClick event handler that fires when a data point on a graph is clicked. There are two curves on the graph, and depending on the curve clicked I want the child component to have an initial state set. For example, click on curve1 and have that set as initial state in the next component, and likewise for curve2.

Using recharts I render several Line components with the onClick handler in the activeDot prop:

<Line
    name={properties.prettyName}
    isAnimationActive={true}
    activeDot={{
        onClick: (data) =>
            changeURLView(data)
    }}
    type="linear"
    key={properties.key}
    dataKey={properties.dataKey}
    stroke={properties.color}
/>

And the changeURLViewScan handler:

const changeURLView = (data) => {
// I can check which curve the datapoint belongs to here
        const sID: string = data.payload.id
        

        router.push(
            '/p/[pID]/s/[sID]',
            router.asPath + `/s/${sID}`
        )
    }

React Router has a generatePath function which allows you to pass props on to the next component, however I don't see something that will accomplish this with Next.js.

Next/Router does let you pass query parameters, but I don't want that in the URL. I want to be able to click on a curve and have the next component's initial state already populate depending on the curve clicked. I might be able to have a prop initialCurveState and set the component state that way, however the issue remains - how do I pass a prop or set initial state using Next.js?