VideoLightbox

import '@blukavantui/web/theme.css'

import {createVideoLightbox} from '@blukavantui/web/video-lightbox';
import '@blukavantui/web/video-lightbox.css';
export function mount(host:HTMLElement) {
 const owned:{destroy():void}[]=[];
 const keep=<T extends {destroy():void}>(c:T)=>{owned.push(c);return c;};
 const status=document.createElement("p");status.setAttribute("role","status");
 keep(createVideoLightbox(host,{
  "SourceUrl": "https://blukavantui.blutekmedia.com/bluui/rich/flower.mp4",
  "PosterUrl": "https://blukavantui.blutekmedia.com/bluui/rich/coast.jpg",
  "CaptionsUrl": "https://blukavantui.blutekmedia.com/bluui/rich/flower.vtt",
  "CaptionLanguage": "en",
  "Title": "A moment in nature \u2014 silent sample video",
  "AspectRatio": "16 / 9",
  "PlayLabel": "Watch the film",
  "ShowPoster": true
},{OpenChanged: (isOpen) => {status.textContent="OpenChanged: "+String(isOpen);},Error: (message) => {status.textContent="Error: "+String(message);}}));host.append(status);
 return {destroy(){owned.reverse().forEach(c=>c.destroy());status.remove();}};
}

const instance = mount(document.getElementById('example')!)

// When this page or framework component is removed:
// instance.destroy()