Separate class for container

The default template for iframe looks like this:

{#
/**
* @file
* Default theme implementation to display an iframe field.
*
* Available variables:
* - src: Url being loaded into the iframe.
* - attributes: An array of HTML attributes, intended to be added to the iframe tag.
* - text: Title text.
* - style: style Block
* - headerlevel: header level
*/
#}
<div{% if attributes.class is not empty %} class="{{ attributes.class }}"{% endif %}>
  {% if text is not empty %}
    <h{{ headerlevel ?? 3 }} class="iframe_title">{{ text }}</h{{ headerlevel ?? 3 }}>
  {% endif %}
  <style type="text/css">{{ style|raw }}</style>
  <iframe {{ attributes }}>
    {{ 'Your browser does not support iframes, but you can visit <a href=":url">@text</a>'|t({ ':url': src, '@text': text }) }}
  </iframe>
</div>

The first thing I notice is that the class is by default blank.

This results in output like so:

<div class >...</div>

The next thing is the class for the container shares the same class as for the iframe. It's undesirable that two separate elements share the same class.

This can be adjusted by either:

1. hardcoded the class for the container in the template
2. adding an additional and distinct field for container_class

e.g.

<div class="iframe__container">...</div>

My feeling is that the class could be populated using a predefined list of classes, or overridden with a custom class.

e.g. say we wanted a class that sets the aspect ratio of the iframe aspect ratio to be 16:9

We could add the following css:

 .iframe__container--16to9 {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */

}
.iframe__container--4to3 {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 75%; /* 4:3 Aspect Ratio (divide 3 by 4 = 0.75) */

}

and something like

iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

It may also be useful to allow users to set the container class on the field widget as well as a default on the field.