Vue - how to properly organize the structure of components?

Question

Vue.js

Good afternoon!
There is a page with a form:

<custom-form>
  <section title="Contacts">
    <custom-input :type="text" />
    <custom-input :type="text" />
    <custom-input type="select" />
  </section>
  <section title="Info">
    <custom-input type="select" />
  </section>
</custom-form>

Each element will have a "Configure" button, by pressing it you need to show a modal window with settings for a particular element (Change label, name, etc.)
Tell me where is it correct in the structure above to place the component?
Would it be correct to screw inside each component like a child?

Answer 1

Use slot, slot-scope write components that do not depend on each other (modal window)
https://ru.vuejs.org/v2/guide/components-slots.html