forms-reactive
Version:
Reactive Form Web Component
2 lines • 1.87 kB
JavaScript
import{r as t,c as i,h as s,H as e,e as n}from"./p-3e1171f6.js";import{a as r}from"./p-c1432a35.js";import{g as o}from"./p-9c83f640.js";const a=":host{display:block;object-fit:contain}img{display:block;width:100%;height:100%;object-fit:inherit;object-position:inherit}";const h=a;const d=class{constructor(s){t(this,s);this.ionImgWillLoad=i(this,"ionImgWillLoad",7);this.ionImgDidLoad=i(this,"ionImgDidLoad",7);this.ionError=i(this,"ionError",7);this.inheritedAttributes={};this.onLoad=()=>{this.ionImgDidLoad.emit()};this.onError=()=>{this.ionError.emit()};this.loadSrc=undefined;this.loadError=undefined;this.alt=undefined;this.src=undefined}srcChanged(){this.addIO()}componentWillLoad(){this.inheritedAttributes=r(this.el,["draggable"])}componentDidLoad(){this.addIO()}addIO(){if(this.src===undefined){return}if(typeof window!=="undefined"&&"IntersectionObserver"in window&&"IntersectionObserverEntry"in window&&"isIntersecting"in window.IntersectionObserverEntry.prototype){this.removeIO();this.io=new IntersectionObserver((t=>{if(t[t.length-1].isIntersecting){this.load();this.removeIO()}}));this.io.observe(this.el)}else{setTimeout((()=>this.load()),200)}}load(){this.loadError=this.onError;this.loadSrc=this.src;this.ionImgWillLoad.emit()}removeIO(){if(this.io){this.io.disconnect();this.io=undefined}}render(){const{loadSrc:t,alt:i,onLoad:n,loadError:r,inheritedAttributes:a}=this;const{draggable:h}=a;return s(e,{key:"da600442894427dee1974a28e545613afac69fca",class:o(this)},s("img",{key:"16df0c7069af86c0fa7ce5af598bc0f63b4eb71a",decoding:"async",src:t,alt:i,onLoad:n,onError:r,part:"image",draggable:c(h)}))}get el(){return n(this)}static get watchers(){return{src:["srcChanged"]}}};const c=t=>{switch(t){case"true":return true;case"false":return false;default:return undefined}};d.style=h;export{d as ion_img};
//# sourceMappingURL=p-2bf221b7.entry.js.map