The combined stuff is available to components using the page store as $page.stuff, providing a mechanism for pages to pass data 'upward' to layouts.

Personally, I prefer an event-based communication, but I don't think it's actually better. The only problem with props is that it can cause problems if badly managed, but normally, both of them are ok. In real life, I would opt for storage.

while with server/externalFetch there is no direct way to pass cookie headers from the original request to the external one

Right now I am working around this issue by having an internal [...api].js, then call fetch for that endpoint (which automatically passes on cookies) and from there hit the actual external endpoint. It works, there is no risk of leaking anything, but imo shouldn't be necessary.

Sure you can abuse session but I don't like that since there is the risk of exposing credentials to client side code.

I don't know how much workaround is it, but for now I'm using this approach:

However, if more control is needed, you can pass any of these pieces of state as a prop (as indicated above) and that state becomes controlled. As soon as this.props[statePropKey] !== undefined, internally, downshift will determine its state based on your prop's value rather than its own internal state.

refKey: if you're rendering a composite component, that component will need to accept a prop which it forwards to the root DOM element. Commonly, folks call this innerRef. So you'd call: getRootProps({refKey: 'innerRef'}) and your composite component would forward like: <div ref={props.innerRef} />

Inner RefSome components are passed an innerRef property to facilitate for internally managed behaviour within the base select. This should be assigned to the ref property of the relevant dom element. i.e.const CustomOptionComponent = ({ innerProps, innerRef }) => (<div ref={innerRef} {...innerProps} />) Inner PropsAll functional properties that the component needs are provided in innerProps which you must spread.