Fix: enable utilities on video component

apps/pattern-lab/src/_patterns/02-components/video/50-video-w-external-title.twig

@@ -18,7 +18,10 @@
       "accountId": "1900410236",
       "playerId": "r1CAdLzTW",
       "showMeta": true,
-      "showMetaTitle": false
+      "showMetaTitle": false,
+      "attributes": {
+        "class": "u-bolt-margin-bottom-small"
+      }
     } only %}
     <figcaption>
       {% include "@bolt/text.twig" with {

packages/components/bolt-video/src/video.twig

@@ -1,5 +1,5 @@
 {% if enable_json_schema_validation %}
-  {{ validate_data_schema(bolt.data.components['@bolt-components-video'].schema, _self) | raw }}
+  {{ validate_data_schema(bolt.data.components["@bolt-components-video"].schema, _self) | raw }}
 {% endif %}
 
 {% set videoUuid = videoUuid | default("js-bolt-video-uuid--" ~ random()) %}
@@ -12,23 +12,39 @@
 {% set collapsed = collapsed | default(true) %}
 {% set ratio = ratio ?? true %}
 
-{#@todo @salem Is this used anywhere?#}
 {% set classes = [
   baseClass,
   collapsed is not null and collapsed == false ? "is-expanded" : "is-collapsed"
 ] %}
 
-
-{% set videoTag %}
-  {% include "@bolt/_video-tag.twig" %}
+{% set utilClasses = [] %}
+{% set videoClasses = [] %}
+
+{% for class in attributes["class"] %}
+  {% if class starts with "u-" %}
+    {% set utilClasses = utilClasses|merge([class]) %}
+  {% else %}
+    {% set videoClasses = videoClasses|merge([class]) %}
+  {% endif %}
+{% endfor %}
+
+{% set innerVideo %}
+  {% include "@bolt/_video-tag.twig" with {
+    attributes: {
+      class: videoClasses
+    }
+  } %}
 {% endset %}
 
 {% if ratio == true %}
   {% include "@bolt/ratio.twig" with {
     aspectRatioHeight: aspectRatioHeight ?? 9,
     aspectRatioWidth: aspectRatioWidth ?? 16,
-    children: videoTag
+    children: innerVideo,
+    attributes: {
+      class: utilClasses
+    }
   } only %}
 {% else %}
-  {{ videoTag }}
+  {% include "@bolt/_video-tag.twig" %}
 {% endif %}