@vime/core
Version:
Customizable, extensible, accessible and framework agnostic media player.
1 lines • 1.28 kB
JavaScript
import{r as e,h as n}from"./p-aa8acb66.js";import{c as t}from"./p-b018976f.js";import{w as s}from"./p-cbbce638.js";import"./p-152748b8.js";const i=class{constructor(n){e(this,n),this.hidden=!1,this.effect="sheen",this.ready=!1,t(this),s(this,["ready"])}onReadyChange(){this.ready?setTimeout((()=>{this.hidden=!0}),500):this.hidden=!1}render(){return n("div",{class:{skeleton:!0,hidden:this.hidden,sheen:"sheen"===this.effect}},n("div",{class:"indicator"}))}static get watchers(){return{ready:["onReadyChange"]}}};i.style=":host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:var(--vm-skeleton-z-index)}@keyframes sheen{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton{width:100%;height:100%;display:flex;min-height:1rem;pointer-events:auto}.sheen.hidden{opacity:0;visibility:hidden;transition:var(--vm-fade-transition);pointer-events:none}.indicator{flex:1 1 auto;background:var(--vm-skeleton-color)}.skeleton.sheen .indicator{background:linear-gradient(\n 270deg,\n var(--vm-skeleton-sheen-color),\n var(--vm-skeleton-color),\n var(--vm-skeleton-color),\n var(--vm-skeleton-sheen-color)\n );background-size:400% 100%;background-size:400% 100%;animation:sheen 8s ease-in-out infinite}";export{i as vm_skeleton}