how to prevent cq:dialog inheritance - dialog

Question

I am migrating classic ui dialogs to touch ui dialogs, I migrated the parent component dialog, I observed AEM is showing the parent dialogs tabs and properties in the child component as well. In the existing classic ui dialogs it doesnt inherit the parent properties whereas in the touch ui it does.
How can we achieve the same classic ui behavior in touch ui as well by preventing the dialog inheritance.
Please share details if anyone has information about this issue.

Answer 1

You can use the sling:hideChildren property to hide inherited tabs and properties. For example, let's say you wanted to hide the inherited permissions and cloudservices tabs, and customize the basic and advanced tabs:
...
<items jcr:primaryType="nt:unstructured">
<tabs
...>
<layout
.../>
<items
jcr:primaryType="nt:unstructured"
sling:hideChildren="[permissions,cloudservices]">
<basic
.../>
<advanced
.../>
</items>
</tabs>
</items>
...

Answer 2

Sling Resource Merging with AEM docs can be found here. Specifically look through the docs for the resource merger properties and how you can manipulate different properties.
The resource merger provides the following properties:
sling:hideProperties (String or String[])
Specifies the property, or list of properties, to hide.
The wildcard * hides all.
sling:hideResource (Boolean)
Indicates whether the resources should be completely hidden, including its children.
sling:hideChildren (String or String[])
Contains the child node, or list of child nodes, to hide. The properties of the node will be maintained.
The wildcard * hides all.
sling:orderBefore (String)
Contains the name of the sibling node that the current node should be positioned in front of.
These properties affect how the corresponding/original resources/properties (from /libs) are used by the overlay/override (often in /apps).

Answer 3

Add the
sling:hideChildren property
to the child component's dialog.
You can add this property to the immediate parent of the particular fieldset/tab/field that you need to hide.
Syntax:
Property Name: sling:hideChildren
Property Type: String or String[]
Property Value: Name of the immediate children, * hides them all
Example:
To hide the all the fields under properties tab of the below dialog:
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<fixedcolums
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
<items jcr:primaryType="nt:unstructured">
<properties
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<startLevel
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/numberfield"
../>
<showHidden
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
../>
</items>
</properties>
</items>
</fixedcolums>
</items>
</content>
add the sling:hideChildren property to its immediate parent node, i.e., items (see below)
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<fixedcolums
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
<items jcr:primaryType="nt:unstructured"
sling:hideChildren="*">
<properties
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<startLevel
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/numberfield"
../>
<showHidden
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
../>
</items>
</properties>
</items>
</fixedcolums>
</items>
</content>
to hide only the startLevel field, add the sling:hideChildren property to its immediate parent node(see below)
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<fixedcolums
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
<items jcr:primaryType="nt:unstructured">
<properties
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured"
sling:hideChildren="startLevel">
<startLevel
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/numberfield"
../>
<showHidden
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/checkbox"
../>
</items>
</properties>
</items>
</fixedcolums>
</items>
</content>

Answer 4

See AEM 6.1 User Interface Customization slide 9 for the "new" granite edit dialog inheritance ...
The We.Retail (AEM 6.2) edit dialog examples shows "hiding" each parent edit dialog tabs in the child component edit dialog ...