[v2] Wrapping CSS Classes change from v1 to v2

[davidjgonzalez]

Understanding v2 is still under development, it appears the v2 components do not have cq:htmlTag definitions specifying the block (BEM) of .cmp-xxx, so instead the components have a wrapping css class of the component name.

For example, the v1 list component is wrapped with css classes: .cmp .cmp-list where as the v2 list component is wrapped the css classes: list.

Is the HTML API contract changing from v1 to v2? It appears the .cmp-list, in v2, is moved into the HTML of list.html and a normal class attribute. This changes the contract and expectation a bit now, as any overlay of list.html MUST remember to wrap all markup in it with a .cmp-list class, and we also lost the .cmp class. Is this intentional?

I image this could very easily break CSS going from v1 to v2 - for example many users will want to adjust margin/padding on the ul, which would've been targeted in v1 as .cmp-list ul but for v2 needs to update to .cmp-list.

• v1 list: https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/master/content/src/content/jcr_root/apps/core/wcm/components/list/v1/list/list.html

• v2 list: https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/development/content/src/content/jcr_root/apps/core/wcm/sandbox/components/list/v2/list/list.html#L20

[vladbailescu]

@davidjgonzalez For v2 we opted to include the wrapper element class in the rendering script. Examples:

• https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/development/content/src/content/jcr_root/apps/core/wcm/sandbox/components/list/v2/list/list.html#L20
• https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/development/content/src/content/jcr_root/apps/core/wcm/sandbox/components/title/v2/title/title.html#L16

This is intended and indeed, a breaking change, part of the reason for creating v2.