action-block.twig

{# Sample Usage
  {% include "@bolt/action-block.twig" with {
    text: "Title",
    url: "http://google.com",
    icon: {
      name: "icon-name",
      size: "large",
      background: "circle"
    }
  } only %}
#}


{% set prefix = "c-bolt-" %}

{% set attributes = create_attribute(attributes|default({})) %}


{% set componentName = "action-block" %}
{% set baseClass = prefix ~ componentName %}


{% set classes = [
  baseClass
] %}


<bolt-{{ componentName }} bolt-component>
  <a href="{{ url }}" {{ attributes.addClass(classes | raw) }}>
    {% if icon %}
      <div class="{{ "#{baseClass}__item #{baseClass}__icon" }}">
        {% set icon = icon | merge({
          size: icon.size | default("xlarge")
        }) %}
        {% include "@bolt/icon.twig" with icon only %}
      </div>
    {% endif %}

    {% if text %}
      <div class="{{ "#{baseClass}__item #{baseClass}__text" }}">
        {{ text }}
      </div>
    {% endif %}
  </a>
</bolt-{{ componentName }}>