@if ((editable && (placeholder$ | async))) {
  <div class="ngm-story-widget__placeholder absolute top-0 left-0 w-full h-full flex flex-col justify-center items-center">
    <pac-placeholder-add></pac-placeholder-add>
    <span class="ngm-story-widget__placeholder-title">{{ 'Story.Widgets.IFrame.Title' | translate: {Default: 'iframe'} }}</span>
  </div>
}

@if (options?.src) {
  <iframe [id]="key"
    [title]="title"
    width="100%"
    height="100%"
    allowfullscreen
    [src]="src$ | async | safe:'resourceUrl'"
    frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    >
  </iframe>
}