Link

// src/components/elements/link/schema.yaml

$schema: http://json-schema.org/draft-07/schema#
$id: /elements/link
additionalProperties: false
required:
  - label
  - url
properties:
  label:
    type: string
  icon:
    type: string
  icon_left:
    type: boolean
  class:
    type: string
  target:
    type: string
    enum:
      - _blank
      - _self
  url:
    type: string
    format: uri-reference
  underline:
    type: boolean
  tenant:
    type: string

// src/components/elements/link/mocks.yaml

label: Label Link
url: url
$variants:
  - $name: Underlined Link
    label: Label Link
    url: url
    underline: true
  - $name: Link with Icon left
    label: Label Link
    icon: arrow-left
    icon_left: true
    url: url
  - $name: Link with Icon right
    label: Label Link
    icon: arrow
    url: url
  - $name: Kids Link
    tenant: kids

// src/components/elements/link/link.html.twig

<a href="{{ url }}" {% if target %} target="{{ target }}"{% endif %}
  class="Link
    {%- if class %} {{ class }}{% endif -%}
    {%- if icon_left %} Link--iconLeft{% endif -%}
    {%- if underline %} Link--underline{% endif -%}
    {%- if tenant %} Link--{{ tenant }}{% endif -%}
">
  {{ label }}
  {% if icon %}{% include "@elements/icon/icon.html.twig" with {name: icon, class: "Link-icon"} only %}{% endif %}
</a>