title: AEM: Trying to reuse existing image dialog in other dialog. Tabs within tab not working when including the image dialog using cqinclude
body: <p>I've a component with a dialog that has multiple tabs. Some of the tabs are widget of xtype="html5smartimage" to accept image and other tabs are meant to accept different image parameter.</p>
  
  <p>I've split the dialog in two parts to make tab system available for reuse by other component. Here it goes:</p>
  
  <h1><strong><em>imageComponent</em></strong></h1>
  
  <h2><strong>tab_image_information.xml</strong></h2>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:TabPanel"
      activeTab="0"
      xtype="tabpanel"&gt;
      &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
          &lt;imageTab1 jcr:primaryType="cq:Widget"
              itemId="imageTab1"
              cropParameter="./image1/imageCrop"
              ddGroups="[media]"
              fileNameParameter="./image1/fileName"
              fileReferenceParameter="./image1/fileReference"
              blankText="An image is required"
              name="./image1/file"
              requestSuffix="/image1.img.png"
              rotateParameter="./image1/imageRotate"
              sizeLimit="100"
              height="250"
              title="Desktop Image"
              uploadUrl="/tmp/upload/*"
              xtype="html5smartimage" /&gt;
          &lt;imageTab2 jcr:primaryType="cq:Widget"
              itemId="imageTab2"
              cropParameter="./image2/imageCrop"
              ddGroups="[media]"
              fileNameParameter="./image2/fileName"
              fileReferenceParameter="./image2/fileReference"
              blankText="An image is required"
              name="./image2/file"
              requestSuffix="/image2.img.png"
              rotateParameter="./image2/imageRotate"
              sizeLimit="100"
              height="250"
              title="Tablet Image"
              uploadUrl="/tmp/upload/*"
              xtype="html5smartimage" /&gt;        
          &lt;imageDetails jcr:primaryType="cq:Widget"
              title="Image Details"
              height="250"
              xtype="panel"&gt;
              &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
                  &lt;displayWidth jcr:primaryType="cq:Widget"
                      fieldDescription="Set display width for the image."
                      fieldLabel="Display Width"
                      name="./displayWidth"
                      xtype="textfield"/&gt;
                  &lt;displayHeight jcr:primaryType="cq:Widget"
                      fieldDescription="Set display height for the image."
                      fieldLabel="Display Height"
                      name="./displayHeight"
                      xtype="textfield"/&gt;
                  &lt;image1ResType jcr:primaryType="cq:Widget"
                      ignoreData="{Boolean}true"
                      name="./image1/sling:resourceType"
                      value="foundation/components/image"
                      xtype="hidden" /&gt;
                  &lt;image2ResType jcr:primaryType="cq:Widget"
                      ignoreData="{Boolean}true"
                      name="./image2/sling:resourceType"
                      value="foundation/components/image"
                      xtype="hidden" /&gt;
              &lt;/items&gt;
          &lt;/imageDetails&gt;
      &lt;/items&gt;
  &lt;/jcr:root&gt;
  </code></pre>
  
  <h2>and in <strong>dialog.xml</strong> I did:</h2>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:Dialog"
      title="Image Selection"
      xtype="dialog"&gt;
      &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
          &lt;imageSelection jcr:primaryType="cq:Widget"
              path="/apps/myproject/components/content/imageComponent/tab_image_information.infinity.json"
              xtype="cqinclude"/&gt;
      &lt;/items&gt;
  &lt;/jcr:root&gt;
  </code></pre>
  
  <p>This component itself is working great.</p>
  
  <p>Now I need to write another component (myComponent) whose dialog will have two tabs - one for basic information and the other tab will 
  have functionality of the imageCompnent. So I'm trying to include tab_image_information using infinity.json. Here goes myComponent:</p>
  
  <h1><strong><em>myComponent</em></strong></h1>
  
  <h2><strong>tab_basic_information.xml</strong></h2>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:Panel"
      title="Component Information"
      width="500"&gt;
      &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
          &lt;text1 jcr:primaryType="cq:Widget"
              fieldLabel="Headline"
              name="./text1"
              xtype="textfield"
              maxlength="42"/&gt;
          &lt;text2 jcr:primaryType="cq:Widget"
              fieldLabel="Sub head"
              name="./text2"
              xtype="textfield"
              maxlength="42"/&gt;
      &lt;/items&gt;
  &lt;/jcr:root&gt;
  </code></pre>
  
  <h2>and the <strong>dialog.xml</strong> is like:</h2>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
      jcr:primaryType="cq:Dialog"
      title="My Component"
      xtype="dialog"&gt;
      &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
          &lt;tabs jcr:primaryType="cq:TabPanel"&gt;
              &lt;items jcr:primaryType="cq:WidgetCollection"&gt;
                  &lt;componentInformation
                      jcr:primaryType="cq:Widget"
                      path="/apps/myproject/components/content/myComponent/tab_basic_information.infinity.json"
                      xtype="cqinclude"/&gt;
                  &lt;componentImageSelection
                      jcr:primaryType="cq:Widget"
                      title="Component Image Selection"
                      xtype="panel"
                      width="500"&gt;
                      &lt;items jcr:primaryType="cq:WidgetCollection"&gt;                        
                          &lt;imageSelection
                              jcr:primaryType="cq:Widget"
                              path="/apps/myproject/components/content/imageComponent/tab_image_information.infinity.json"
                              xtype="cqinclude"/&gt;
                      &lt;/items&gt;
                  &lt;/componentImageSelection&gt;
              &lt;/items&gt;
          &lt;/tabs&gt;
      &lt;/items&gt;
  &lt;/jcr:root&gt;
  </code></pre>
  
  <p>Inclusion of tab_image_information within myComponent dialog is happening, but it not laying out properly, neither it is saving the information of that tab(componentImageSelection).</p>
  
  <p>Any suggestion is highly appreciated.</p>