Maybe this question will be difficult to explain and perhaps it does not matter, but I've been wondering about this, so please bear with me.
I am slowly turning most elements in my app into components. Now, one of the elements in my app is a form with about a dozen input/select fields. Some of the select fields' options in this form consist of long lists (e.g. timezones). So for these I use a popover and clicking on one of the listed options selects that option.
Now, my question is whether I should create the form component with the select field component (such as Timezones) as a component pre-built into the form component? Or should I just create the Timezone component separately and add it below the Form component in the element tree (on my page)?
Just to clarify, with pre-built I mean that the timezone component will always be a part of the form component and with separately I mean that I can just add it to my page separately and add it in the form component on the page.
I hope that makes sense.
I am looking for best practice for this use case and I'd like to know why this would be best practice in my use case.
I suppose this also determines whether I'll use attributes or context to get data into my timezone component (and other sub-components like this).