[Architecture] Follow Atomic Design Pattern

## Feature Request

**Is your feature request related to a problem? Please describe.**
Many of our clients have been asking to follow Atomic Design Principles during component build (https://patternlab.io/ ) however when I looked at core components, I found that they are not broken that way. If we can move out atoms from components and wrap them in sly templates, it will be very easy to use them anywhere we want (composition sometimes gives more re-usability than inheritance). This will also improve manageability aspect of the application. This will also help FE developers to get more comfortable since they are familiar of atomic design pattern and will take separation of concerns to the next level.

**Describe the solution you'd like**

1. Move all the atoms out of components and wrap their markup in sly templates with a naming convention like -tmpl.html e.g. link-tmpl.html.
2. In case an atom is equal to a cq component, atom have one more html file as component name e.g. link.html. link.html will include link-tmpl.html using sly template tag.
3. atoms will have their corresponding css/js files.
4. these atoms are then leveraged in molecules and organisms using sly template tag.
5. for styles point of view, parent component should be able to pass a style/css class name to atom to style it the way it wants.
6. Once all the atoms are created, developing a new molecule/organism is then really easy since FE developer then just require to compose various atoms as per their requirements.

**Are there alternatives?**
Right now, I will have to copy the code written in a component. There are some core components which are broken down in smaller templates which I am able to leverage easily by using the sly template tag.

**Documentation**
For more details around the pattern, please have a look @ https://patternlab.io/.

Review the existing core components and the smaller templates that already use the sly template tag, then compare their structure with the Atomic Design guidance at Pattern Lab. Done would require an agreed scope and naming convention for atoms, templates, CSS, and JavaScript before moving components into the proposed composition model.

Written by the indexing model from the issue text.