if as is default and size is set, update Component to represent the size

[circlecube]

No description provided.

[circlecube]

I'm seeing that many Title components are being set to h1, but I think when we pass a specific size this component should adjust automatically to a matching heading level.

This will help with accessibility for heading levels - I'm seeing some cypress a11y checks fail because all the headings are coming out as h1. We could update all uses of this component to specify the as prop, but I think a better dev experience is to know that by setting size we also get a heading level according to the size, and if we want to specify something different, we should then also set the as prop.