@dropi/ui 0.1.41 → 0.1.43

package/dist/cjs/dropi-youtube-lazy-video.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-C8kwDvpf.js');
+var index = require('./index-DydfpGMc.js');
 
 const dropiYoutubeLazyVideoCss = () => `:host{display:block;width:100%}.video-wrapper{position:relative;width:100%;padding-bottom:56.25%;background:var(--Neutral-Black);overflow:hidden;border-radius:12px}.video-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.thumbnail{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;overflow:hidden}.thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}.thumbnail:hover img{transform:scale(1.05)}.play-button{position:absolute;color:white;border:none;border-radius:50%;width:70px;height:70px;cursor:pointer;transition:background 0.3s ease;background:rgba(14, 17, 26, 0.6);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center}.play-button:hover{background:rgba(0, 0, 0, 0.8)}@media screen and (max-width: 768px){.play-button{width:40px;height:40px}}`;
 
@@ -25,7 +25,7 @@ const DropiYoutubeLazyVideo = class {
         return `https://www.youtube.com/embed/${this.videoId}?autoplay=1&rel=0&modestbranding=1`;
     }
     render() {
-        return (index.h("div", { key: '0732bc87e7be10e422e80751a17527132301eb99', class: `video-wrapper${this.isPlaying ? ' playing' : ''}` }, !this.isPlaying && (index.h("div", { key: '540c46b66da3f67ec45614e0891827b7cc0be4e5', class: "thumbnail", onClick: () => { this.isPlaying = true; } }, index.h("img", { key: '843241c72688ca88ccd5d9391b542501575ea476', src: this.thumbnail, alt: `Video thumbnail ${this.videoId}` }), index.h("button", { key: 'b068f79fb6b2140e1419e9d72a24f6e66eaab69d', class: "play-button", "aria-label": "Reproducir video" }, index.h("dropi-icon", { key: 'b3b6d8b99583fd0a3c2c0d766beeda2459b8b13a', name: "Play", iconWidth: "17px", iconHeight: "21px", color: "Neutral-White" })))), this.isPlaying && (index.h("iframe", { key: '42172a0c7bb386da9123b411af4ab5ebeb9e205c', src: this.videoUrl, title: this.videoTitle, frameborder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, loading: "lazy" }))));
+        return (index.h("div", { key: 'c3fadb91dcf1c32964ed0f0cb847ab3d874f2d7a', class: `video-wrapper${this.isPlaying ? ' playing' : ''}` }, !this.isPlaying && (index.h("div", { key: '7bc533e24d3221d8c4dd763e629ec836642d504f', class: "thumbnail", onClick: () => { this.isPlaying = true; } }, index.h("img", { key: '6e47aefd8e8fab4ecf8b6a7160bc5557ecace088', src: this.thumbnail, alt: `Video thumbnail ${this.videoId}` }), index.h("button", { key: '1acb93790a95117c78d5855807f24dac76b98008', class: "play-button", "aria-label": "Reproducir video" }, index.h("dropi-icon", { key: '09974fac159a0c88b160c8044f88e1c3dfab79c0', name: "Play", iconWidth: "17px", iconHeight: "21px", color: "Neutral-White" })))), this.isPlaying && (index.h("iframe", { key: '7650e6f8f8591cc1b24e0958e0924e5eff118ad9', src: this.videoUrl, title: this.videoTitle, frameborder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true, loading: "lazy" }))));
     }
 };
 DropiYoutubeLazyVideo.style = dropiYoutubeLazyVideoCss();