Difference between Granite UI Components based on Coral UI 2 and Coral UI 3

We have two sets of Granite UI components based on Coral UI2 and Coral UI3, below are the differences mentioned per Adobe documentation.

Components Path

Coral UI2 Components Path
/libs/granite/ui/components/foundation/*
Coral UI3 Components Path
/libs/granite/ui/components/coral/foundation/*

Clientlibs

Coral UI2 Clientlibs
granite.ui.foundation, granite.ui.foundation.admin, coralui2
Coral UI3 Clientlibs
granite.ui.coral.foundation, coralui3

Note: Coral UI 3 based components will not have layout concept.

Replacement/alternative being  direct standard component for simplicity.


While creating touch UI dialog, we create a node named "layout" with resourceType being the layouts from the path "granite/ui/components/foundation/layouts/*"

Eg: Coral UI 2: if layout resourceType used is granite/ui/components/foundation/layouts/tabs, equivalent Coral UI 3, granite/ui/components/coral/foundation/tabs.

Section component(granite/ui/components/foundation/section)that we use to define for each of the tabs has been replaced with container component(granite/ui/components/coral/foundation/container)

$.validator which we were using for validation before is now been replaced with foundation-validation 

Common attributes (like class, title, id) are strictly implemented.(this is more to the implementation perspective - retrieving logic of these common attributes. 

The same can be evident by comparing any particular component of both sets, say textfield available in /libs/granite/ui/components/foundation/textfield/render.jsp and /libs/granite/ui/components/coral/foundation/textfield/render.jsp

Few similar set of components has been removed. List of components changed/removed has been men 

https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/granite-ui/api/jcr_root/libs/granite/ui/components/legacy/coral2/migration.html#removed-components

Reference 

• Coral UI 2
• Coral UI 3