Improve DX with render alias

Problem/Motivation

While writing an example, there are many annoying stuff inherited from the render API.

Of course, the core idea of this module is to build render array in the YML, but we may need shortcuts which are resolved by ui_examples before sent to the render API.

Examples

Issue: html_tag allows only strings in #value, so we need to create "fake" keys

"#type": html_tag
"#tag": div
html_tag_content_1:
  "#type": pattern
  "#id": button_group
html_tag_content_2:
  "#type": html_tag
  "#tag": small
  "#value": 9 mins

Proposal: a #element key with a #content key

"#element": div
"#content":
  - "#type": pattern
    "#id": button_group
  - "#element": small
    "#value": 9 mins

Issue: styles from ui_styles are not declared in #attributes which is the resolved form.

"#type": pattern
"#id": jumbotron
"#attributes":
  class:
    - text-center

Proposal: introduce a #style property:

"#type": pattern
"#id": jumbotron
"#styles":
   - text-center

Issue: component from ui_patterns needs to be written in the developed form (with #fields & #settings) instead of the compact form, to be understood by the render API

"#type": pattern
"#id": carousel
"#settings":
  with_indicators: true
  with_controls: true
"#fields":
  slides: {}
  captions: {}

Proposal: introduce a #pattern property which accept the compact form:

"#pattern": carousel
with_indicators: true
with_controls: true
slides: {}
captions: {}