Bindings for nested optional props



Suppose I’m writing bindings for a JS React component. Suppose it has a prop that is an object with optional properties. In JS parlance, <Select components={{ Option, Placeholder, LoadingIndicator /* ... */ }} />. Suppose I also want to retain the nested structure in Reason.

I guess I could make ~components accept a JS object, but that wouldn’t typecheck, and I don’t want the consumers to deal with interop.

Is my best bet to expose a make function that would be used like the following?

<Select components={CustomComponents.make(
  ~option: CustomOption,
  ~placeholder: CustomPlaceholder,
  ~loadingIndicator: CustomIndicator,
)} />

And, anyway, are nested props an acceptable idea? Or is the consensus to always keep them flat?