component question

[Vishal_S01]

The developer is presented with a component "Component A" which inherits from a component "Component B".
The dialog of Component A on path ../cq:dialog/../../items looks like:
+ align
- jcr:primaryType="nt:unstructured"
- sling:resourceType="granite/ui/components/coral/foundation/form/select"
- fieldLabel="Align Text"
- name="./align"
The dialog of Component B on path ../cq:dialog/../../items looks like:
+ title
- jcr:primaryType="nt:unstructured"
- sling:resourceType="granite/ui/components/coral/foundation/form/textarea"
- fieldLabel="Title"
- name="./title"
+ description

- jcr:primaryType="nt:unstructured"
- sling:resourceType="granite/ui/components/coral/foundation/form/textarea"
- fieldLabel="Description"
- name="./description"
The requirement for the dialog is that the *Align Text* field is shown after the *Title* field. What should the developer do without changing Component B?
A. Move the align node from Component A to Component B and order them according the requirements.
B. Move all the nodes under the item node from Component B to Component A and order them according the requirements.
C. Extend Component B with the functionality of Component A
D. Add the property sling:orderBefore="description" to the align node.

Which one option is correct?

[DEBAL_DAS]

Option: D. Check this https://afratechnologies.com/2021/07/13/sling-resource-merger-in-aem/

[Vishal_S01]

Thanks.

[milind_bachani · Accepted solution]

Option D.
FYI 
Syntax: sling:orderBefore=<#NODENAME#> (here nodeName = description)

Thanks,

Milind

[Vishal_S01]

Thanks, Milind.