Inserting component through dialog of other component

Hi @nandheswara 

To insert a component through a dialog of another component in AEM, you can follow these general steps:

1. Define the dialog for the component that will contain the other component(s). This can be done in the component's cq:dialog node in the component's content path.

2. Within the dialog, define a field that will contain the other component(s). This can be done using the coral-multifield or granite/ui/components/coral/foundation/container widget.

3. Within the multifield or container widget, define the subfields for each instance of the component that will be inserted. For example, for a carousel component, you might define subfields for the carousel image and caption.

4. In the component's dialog.xml file, add the necessary properties to reference the other component(s) that will be inserted. For example, for a carousel component, you might add a sling:resourceType property referencing the core/wcm/components/carousel/v1/carousel component.

5. In the component's cq:editConfig node, add the insert property to define the insertion point for the other component(s). For example, for a tabs component, you might define the insert property to insert the tabs component into the granite/ui/components/coral/foundation/container widget.

6. Add the necessary clientlibs and component templates to render the inserted component(s).

Note that the exact steps will depend on the specific component(s) you are trying to insert and the structure of your project. It's also worth noting that some components may have special requirements or limitations for insertion. Therefore, it is recommended to refer to the documentation and/or sample code provided by Adobe to ensure proper implementation of component insertion.