@slidy/plugins/dist/index.mjs

Simple plugins functions for @slidy/core

function W(t){return console.log("log",t),({node:e,options:n,instance:r})=>(console.log("log",{node:e,options:n,instance:r}),e.addEventListener("destroy",function o(){e.removeEventListener("destroy",o)}),null)}function h(t,e,n){let r=n?new CustomEvent(e,n):new Event(e,{bubbles:!0});return t.dispatchEvent(r)}function A(t,e,n=0){let r,o=0,i=0,s=e;function a(){o===1&&(o=2,clearInterval(r),s=n||e-Math.abs(performance.now()-i))}function u(){o===2&&(o=3,setTimeout(L,s))}function c(){o=0,clearInterval(r)}function p(){o=1,i=performance.now(),r=setInterval(()=>{t(),i=performance.now()},e)}function L(){o===3&&(t(),p())}return{play:p,pause:a,resume:u,stop:c}}function U(t,e,n=0){(!t||!Object.keys(t).length)&&(t={duration:1500,delay:0});let{duration:r,delay:o}=t;return({node:i,options:s,instance:a})=>{e||=()=>{!s.loop&&s.index&&s.edged?(h(i,"stop"),u.stop(),n=0):(n=1,a.to(s.index+1))};let u=A(e,r,o);return i.addEventListener("mount",c),i.addEventListener("destroy",u.stop),u;function c(){document.onvisibilitychange=()=>{if(document.visibilityState==="hidden"){if(n!==1)return;h(i,"pause"),u.pause(),n=2}else{if(n!==2)return;h(i,"resume"),u.resume()}},i.onpointerenter=()=>{n===1&&(h(i,"pause"),u.pause(),n=2)},i.onpointerleave=()=>{n===2&&(h(i,"resume"),u.resume())}}}}function X(t={duration:700,delay:1}){let{duration:e,delay:n}=t;return({node:r,options:o,instance:i})=>{let s=A(()=>{i.to(o.index,e/16.667)},Math.abs(e/16.667),n);return r.addEventListener("mount",a),r.addEventListener("destroy",s.stop),s;function a(){o.loop=!0,o.snap=void 0,o.duration=Math.abs(e),s.play(),document.onvisibilitychange=()=>{document.visibilityState==="hidden"?s.pause():s.resume()},r.onpointerenter=()=>s.pause(),r.onpointerleave=()=>s.resume()}}}function Y(){return({node:t,instance:e})=>{t.addEventListener("destroy",function r(){t.removeEventListener("destroy",r),t.removeEventListener("index",n)}),t.addEventListener("index",n);function n({detail:{index:r}}){setTimeout(function(){e.update({axis:r%2?"x":"y"})})}}}var M={viewBox:"0 0 24 24",path:"M5.75,3A1.75,1.75,0,0,0,4,4.75v14.5A1.75,1.75,0,0,0,5.75,21h3.5A1.75,1.75,0,0,0,11,19.25V4.75A1.75,1.75,0,0,0,9.25,3ZM5.5,4.75a.25.25,0,0,1,.25-.25h3.5a.25.25,0,0,1,.25.25v14.5a.25.25,0,0,1-.25.25H5.75a.25.25,0,0,1-.25-.25ZM14.75,3A1.75,1.75,0,0,0,13,4.75v14.5A1.75,1.75,0,0,0,14.75,21h3.5A1.75,1.75,0,0,0,20,19.25V4.75A1.75,1.75,0,0,0,18.25,3ZM14.5,4.75a.25.25,0,0,1,.25-.25h3.5a.25.25,0,0,1,.25.25v14.5a.25.25,0,0,1-.25.25h-3.5a.25.25,0,0,1-.25-.25Z"},I={viewBox:"0 0 24 24",path:"M7.61,4.61a.75.75,0,0,0-1.11.66V18.73a.75.75,0,0,0,1.11.65L20,12.66a.75.75,0,0,0,0-1.32ZM5,5.27a2.25,2.25,0,0,1,3.33-2L20.69,10a2.26,2.26,0,0,1,0,4L8.33,20.7a2.25,2.25,0,0,1-3.33-2Z"},q={viewBox:"0 0 24 24",path:"M5.75,3h12.5A2.75,2.75,0,0,1,21,5.75v12.5A2.75,2.75,0,0,1,18.25,21H5.75A2.75,2.75,0,0,1,3,18.25V5.75A2.75,2.75,0,0,1,5.75,3Zm0,1.5A1.25,1.25,0,0,0,4.5,5.75v12.5A1.25,1.25,0,0,0,5.75,19.5h12.5a1.25,1.25,0,0,0,1.25-1.25V5.75A1.25,1.25,0,0,0,18.25,4.5Z"};var N=!!(typeof window<"u"&&window.document&&window.document.createElement);var T=(t,e)=>{if(!N)return class{};let n=e();return customElements.define(t,n),n};var l=15,b=2,z={play:I.path,pause:M.path,stop:q.path},ee=`0 0 ${2*l+b} ${2*l+b}`,$=`${b}px`,F=`M ${l+b/2}, ${l+b/2} m -${l}, 0 a ${l},${l} 0 1,0 ${2*l},0 a ${l},${l} 0 1,0 ${-2*l},0`,we=T("autoplay-button",()=>class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`<style>:host{grid-area:slides;--slidy-autoplay-stroke-length: ${2*Math.PI*l};width:var(--slidy-autoplay-control-size,2.25em);height:var(--slidy-autoplay-control-size,2.25em);grid-template:1fr/1fr;place-content:center;place-items:center;display:grid;position:absolute;bottom:1em;right:1em}:host>svg{width:var(--slidy-autoplay-control-size,2.25em);height:var(--slidy-autoplay-control-size,2.25em)}:host>*{grid-area:1/1}:host>button{pointer-events:all;fill:var(--slidy-arrow-icon-color,currentColor);background-color:var(--slidy-counter-bg,#4e4e4ebf);cursor:pointer;border:none;border-radius:1em;outline:none;justify-content:center;align-items:center;padding:.25em;font-family:inherit;display:flex}:host>button,:host>button svg{width:calc(.9*var(--slidy-autoplay-control-size,2.25em));height:calc(.9*var(--slidy-autoplay-control-size,2.25em))}:host>button:disabled{opacity:.75;cursor:not-allowed}:host>button:focus-visible{outline:2px dashed var(--slidy-focus-ring-color,#c9c9c9e6);outline-offset:calc(.25*var(--slidy-autoplay-control-size,2.25em));border-radius:50%}.slidy-autoplay-indicator{stroke-dasharray:var(--slidy-autoplay-stroke-length);stroke-dashoffset:var(--slidy-autoplay-stroke-length);animation:slidy-autoplay-indicator var(--slidy-autoplay-interval)linear forwards infinite}.slidy-autoplay-indicator.stop{animation:unset}.slidy-autoplay-indicator.pause{animation-play-state:paused}@keyframes slidy-autoplay-indicator{to{stroke-dashoffset:0}}</style><svg viewBox="${ee}"><path stroke="var(--slidy-counter-bg, #4e4e4ebf)" stroke-width="${$}" fill="none" d="${F}"></path><path class="slidy-autoplay-indicator stop" stroke="var(--slidy-autoplay-indicator-accent, lightpink)" stroke-width="${$}" fill="none" d="${F}"></path></svg><button type="button"><svg viewBox="0 0 24 24"><path d=""></path></svg></button>`}setDuration(e){this.style.setProperty("--slidy-autoplay-interval",e+"ms")}get path0(){return this.shadowRoot.firstElementChild.nextElementSibling.firstElementChild.nextElementSibling}get button(){return this.shadowRoot.firstElementChild.nextElementSibling.nextElementSibling}get path1(){return this.button.firstElementChild.firstElementChild}get animation(){let e=this.path0.classList;return{pause(){e.add("pause")},cancel(){e.add("stop")},play(){e.remove("stop","pause")}}}});function Z(t){let e=document.createElement("autoplay-button"),n=e.button;return n.onclick=t,[e,n,e.path1]}var S=(t,e)=>{let n=Object.entries(e),r=()=>{for(let[i,s]of n)t.addEventListener(i,s)},o=()=>{for(let[i,s]of n)t.removeEventListener(i,s)};return r(),o},B=(t,...e)=>e.includes(t);var v=performance.now.bind(performance),P=class{queue;timeoutId;index;off;time=v();constructor(e){this.queue=e,this.index=0,this.off=0}start(){this.time=v(),this.runNextTask()}pause(){clearTimeout(this.timeoutId),this.off+=v()-this.time}stop(){clearTimeout(this.timeoutId),this.off=0,this.index=0}runNextTask(){this.index===this.queue.length&&this.stop();let e=this.queue[this.index];if(typeof e=="function"){let n=v();e(),this.index++,this.off+=v()-n,this.runNextTask()}else this.timeoutId=setTimeout(()=>{this.index++,this.time=v(),this.off=0,this.runNextTask()},e.await-this.off)}};function V(t,e,n=0){let r=new P([()=>{e.animation.play()},{await:e.interval},()=>{t(),e.animation.cancel(),n=3},{await:e.delay},()=>{n=1,e.animation.cancel()}]);return{play(){n!==3&&e.animation.play(),n=1,e.state=0,r.start()},pause(){n!==3&&(n=2),e.state=2,e.animation.pause(),r.pause()},stop(){n=0,e.state=1,e.animation.cancel(),r.stop()}}}var te={play:"Start autoplay",stop:"Stop autoplay"};var ne={0:"pause",1:"play",2:"stop"},oe=({i18n:t=te,duration:e=2500,delay:n=0,autoplay:r=!1,target:o}={})=>{let i=1,s={0:t.stop,1:t.play,2:t.stop};return({node:a,options:u,instance:c})=>{let p=()=>a.childElementCount,L=()=>{let f=u.index+1;u.loop||f<p()?(i=0,y(),c.to(f)):d.stop()},[m,w,R]=Z(()=>{B(i,2,0)?d.stop():d.play(),y()}),d=V(L,{set state(f){i=f,y()},delay:n,interval:e,animation:m.animation});o?typeof o=="string"?document.querySelector(o).appendChild(m):o.appendChild(m):a.insertAdjacentElement("afterend",m),m.setDuration(e);let y=()=>{y.current!==i&&(w.setAttribute("title",s[i]),R.setAttribute("d",z[ne[i]]),y.current=i)};y();let Q=f=>{let K=f.detail.index+1;u.loop||K<p()?w.removeAttribute("disabled"):(w.setAttribute("disabled","disabled"),d.stop()),y()},C=()=>{i===0&&d.pause()},k=()=>{i===2&&d.play()},G=()=>{B(x,0,1)||k()},E=2,x=2;a.onpointerenter=()=>{x=1,E!==0&&C()},m.onpointerenter=()=>{x=0,C()},m.onpointerleave=()=>{E!==1&&k(),E=0},a.onpointerleave=()=>{E=1,x=2,queueMicrotask(G)};let _=S(document,{visibilitychange:()=>{document.visibilityState==="hidden"&&i===0?d.pause():i===2&&d.play()}}),J=S(a,{index:Q,mount:()=>{r&&d.play()},destroy:()=>{d.stop(),_(),J()}})}};var g={C4:261.63,E4:329.63,G4:392,Bell:1567.98,Beep:493.88},D={index:[{freq:g.C4,dur:.5},{freq:g.E4,dur:.5},{freq:g.G4,dur:.5},{freq:g.C4,dur:1}],keys:[{freq:g.Beep,dur:1},{freq:g.Bell,dur:.5}]};var H=(t,e,n)=>{let r=t.createOscillator();r.type="square";let o=t.createGain();r.connect(o),o.connect(t.destination),r.frequency.value=e,o.gain.setValueAtTime(1,t.currentTime),o.gain.exponentialRampToValueAtTime(.001,t.currentTime+n),r.start(t.currentTime),r.stop(t.currentTime+n)};var ie=(t=D)=>{let e,n=!1,r=Object.entries(t).reduce((o,[i,s])=>(o[i]=()=>{if(!e)try{e=new AudioContext}catch{return}n||s.forEach((a,u,c)=>{let p=u>0?c[u-1].dur*1e3:0;setTimeout(()=>{H(e,a.freq,a.dur),u===0&&(n=!0),u===c.length-1&&setTimeout(()=>{n=!1},a.dur)},p)})},o),{});return({node:o})=>{function i(){for(let[s,a]of Object.entries(r))o.removeEventListener(s,a);o.removeEventListener("destroy",i)}o.addEventListener("destroy",i);for(let[s,a]of Object.entries(r))o.addEventListener(s,a)}};var re="Share",j="slidy-share-button",Re=T(j,()=>class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`<style>:host{width:var(--slidy-share-control-size,2.25em);height:var(--slidy-share-control-size,2.25em);grid-area:slides;place-content:center;place-items:center;display:grid;position:absolute;bottom:1em;left:1em}:host>button{pointer-events:all;fill:var(--slidy-arrow-icon-color,currentColor);background-color:var(--slidy-counter-bg,#4e4e4ebf);cursor:pointer;width:var(--slidy-share-control-size,2.25em);height:var(--slidy-share-control-size,2.25em);border:none;border-radius:50%;outline:none;justify-content:center;align-items:center;padding:.25em;font-family:inherit;display:flex}:host>button svg{width:calc(.9*var(--slidy-share-control-size,2.25em));height:calc(.9*var(--slidy-share-control-size,2.25em))}</style><button type="button" aria-label="${re}"><svg viewBox="1 0 15 15" fill="none"><path fill="currentColor" fill-rule="evenodd" d="M5 7.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Zm.713 1.164a2.5 2.5 0 1 1 0-2.328l3.391-2.12A2.5 2.5 0 1 1 14 3.5a2.5 2.5 0 0 1-4.484 1.52l-3.53 2.207a2.526 2.526 0 0 1 0 .546l3.53 2.206a2.5 2.5 0 1 1-.411.804l-3.392-2.12ZM11.5 5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm1.5 6.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Z" clip-rule="evenodd"/></svg></button>`}}),O=t=>{let e=document.createElement(j);return e.onclick=t,e};var se=({target:t,type:e}={target:void 0,type:"url"})=>({node:n,options:r})=>{let o=O(()=>{let s=r.index;if(!s)return;let a=n.childNodes[s];if(!a)return;let u=a.querySelector("[src]")?.src||a.style.backgroundImage||void 0,c=a.querySelector("img")?.alt||void 0;if(u)try{e==="url"&&navigator.share({url:u,title:c})}finally{}});function i(){o.remove(),n.removeEventListener("destroy",i)}n.addEventListener("destroy",i),t?typeof t=="string"?document.querySelector(t).appendChild(o):t.appendChild(o):n.insertAdjacentElement("afterend",o)};export{ie as audio,oe as autoplay,Y as fool,W as log,X as marquee,U as play,se as share};