ISTWCMS-4704: updating contact to allow for hook for js

source/_patterns/04-components/contact/contact.twig

-{%  embed "@components/details/details.twig" %}
+<div class="uw-contact">
+  {%  embed "@components/details/details.twig" %}
 
-  {% block details_summary %}
-      {% if contact.title %}
-         <h2 class="uw-contact__h2">
-          {{ contact.title }}
-        </h2>
-      {% endif %}
-      {% if contact.position %}
-        <div class="uw-contact__position">
-          {{ contact.position }}
-        </div>
-      {% endif %}
-  {% endblock %}
+    {% block details_summary %}
+        {% if contact.title %}
+          <h2 class="uw-contact__h2">
+            {{ contact.title }}
+          </h2>
+        {% endif %}
+        {% if contact.position %}
+          <div class="uw-contact__position">
+            {{ contact.position }}
+          </div>
+        {% endif %}
+    {% endblock %}
 
-  {% block details_content %}
-    <div class="uw-contact__info">
-      {%  if contact.image %}
-        <div class="uw-contact__image">
-          <img src="{{ contact.image }} alt="{{ contact.title }}" />
-        </div>
-      {%  endif %}
-      {% if contact.email or contact.phone %}
-        <div class="uw-contact__phone-email">
-          {% if contact.email %}
-            <div class="uw-contact__email">
-              <a href="mailto:{{ contact.email }}">{{ contact.email }}</a>
-            </div>
-          {% endif %}
-          {% if contact.phone %}
-            <div class="uw-contact__phone">
-              {{ contact.phone }}
-            </div>
-          {% endif %}
-        </div>
-      {% endif %}
-      {% if contact.additional_info %}
-        <div class="uw-contact__additional-info">
-          {{ contact.additional_info }}
-        </div>
-      {% endif %}
-      {% if contact.contact_for %}
-        <div class="uw-contact__contact-for">
-          {{ contact.contact_for }}
-        </div>
-      {% endif %}
-      {% if contact.groups %}
-        <div class="uw-contact__groups">
-          {% for group in contact.groups %}
-            {% if loop.index0 > 0 %}
-              , {{ group.title }}
-            {% else %}
-              {{ group.title }}
+    {% block details_content %}
+      <div class="uw-contact__info">
+        {%  if contact.image %}
+          <div class="uw-contact__image">
+            <img src="{{ contact.image }} alt="{{ contact.title }}" />
+          </div>
+        {%  endif %}
+        {% if contact.email or contact.phone %}
+          <div class="uw-contact__phone-email">
+            {% if contact.email %}
+              <div class="uw-contact__email">
+                <a href="mailto:{{ contact.email }}">{{ contact.email }}</a>
+              </div>
             {% endif %}
-          {% endfor %}
-        </div>
-      {% endif %}
-      {% if contact.location %}
-        <div class="uw-contact__location">
-          <strong>Location:</strong><br />
-          {{ contact.location }}
-        </div>
-      {% endif %}
-      {% if contact.link_profile %}
-        <div class="uw-contact__profile">
-          <strong>Link to profile:</strong><br />
-          <a href="{{ contact.link_profile.uri }}">
-            {% if contact.link_profile.title %}
-              {{ contact.link_profile.title }}
-            {% else %}
-              {{ contact.title }}
+            {% if contact.phone %}
+              <div class="uw-contact__phone">
+                {{ contact.phone }}
+              </div>
             {% endif %}
-          </a>
-        </div>
-      {% endif %}
-      {% if contact.personal_website %}
-        <div class="uw-contact__personal-website">
-          <strong>Link to personal website:</strong><br />
-          <a href="{{ contact.personal_website.uri }}">
-            {% if contact.personal_website.title %}
-              {{ contact.personal_website.title }}
-            {% else %}
-              {{ contact.title }}
-            {% endif %}
-          </a>
-        </div>
-      {% endif %}
-    </div>
-  {% endblock %}
-{%  endembed %}
+          </div>
+        {% endif %}
+        {% if contact.additional_info %}
+          <div class="uw-contact__additional-info">
+            {{ contact.additional_info }}
+          </div>
+        {% endif %}
+        {% if contact.contact_for %}
+          <div class="uw-contact__contact-for">
+            {{ contact.contact_for }}
+          </div>
+        {% endif %}
+        {% if contact.groups %}
+          <div class="uw-contact__groups">
+            {% for group in contact.groups %}
+              {% if loop.index0 > 0 %}
+                , {{ group.title }}
+              {% else %}
+                {{ group.title }}
+              {% endif %}
+            {% endfor %}
+          </div>
+        {% endif %}
+        {% if contact.location %}
+          <div class="uw-contact__location">
+            <strong>Location:</strong><br />
+            {{ contact.location }}
+          </div>
+        {% endif %}
+        {% if contact.link_profile %}
+          <div class="uw-contact__profile">
+            <strong>Link to profile:</strong><br />
+            <a href="{{ contact.link_profile.uri }}">
+              {% if contact.link_profile.title %}
+                {{ contact.link_profile.title }}
+              {% else %}
+                {{ contact.title }}
+              {% endif %}
+            </a>
+          </div>
+        {% endif %}
+        {% if contact.personal_website %}
+          <div class="uw-contact__personal-website">
+            <strong>Link to personal website:</strong><br />
+            <a href="{{ contact.personal_website.uri }}">
+              {% if contact.personal_website.title %}
+                {{ contact.personal_website.title }}
+              {% else %}
+                {{ contact.title }}
+              {% endif %}
+            </a>
+          </div>
+        {% endif %}
+      </div>
+    {% endblock %}
+  {%  endembed %}
+</div>