@goldencomm/create-baseline 0.0.1 → 0.1.0

package/templates/wordpress/theme/assets/js/carousel.js

@@ -0,0 +1,2 @@
+/* Baseline carousel (src/carousel.js) bundled with embla-carousel 8.6.0 and embla-carousel-autoplay 8.6.0. Generated: do not edit. */
+(()=>{function Tt(t){return typeof t=="number"}function vt(t){return typeof t=="string"}function gt(t){return typeof t=="boolean"}function Vt(t){return Object.prototype.toString.call(t)==="[object Object]"}function F(t){return Math.abs(t)}function At(t){return Math.sign(t)}function at(t,n){return F(t-n)}function nn(t,n){if(t===0||n===0||F(t)<=F(n))return 0;let e=at(F(t),F(n));return F(e/t)}function en(t){return Math.round(t*100)/100}function lt(t){return ft(t).map(Number)}function Q(t){return t[pt(t)]}function pt(t){return Math.max(0,t.length-1)}function Dt(t,n){return n===pt(t)}function zt(t,n=0){return Array.from(Array(t),(e,r)=>n+r)}function ft(t){return Object.keys(t)}function Gt(t,n){return[t,n].reduce((e,r)=>(ft(r).forEach(u=>{let s=e[u],o=r[u],c=Vt(s)&&Vt(o);e[u]=c?Gt(s,o):o}),e),{})}function It(t,n){return typeof n.MouseEvent<"u"&&t instanceof n.MouseEvent}function on(t,n){let e={start:r,center:u,end:s};function r(){return 0}function u(i){return s(i)/2}function s(i){return n-i}function o(i,a){return vt(t)?e[t](i):t(n,i,a)}return{measure:o}}function dt(){let t=[];function n(u,s,o,c={passive:!0}){let i;if("addEventListener"in u)u.addEventListener(s,o,c),i=()=>u.removeEventListener(s,o,c);else{let a=u;a.addListener(o),i=()=>a.removeListener(o)}return t.push(i),r}function e(){t=t.filter(u=>u())}let r={add:n,clear:e};return r}function rn(t,n,e,r){let u=dt(),s=1e3/60,o=null,c=0,i=0;function a(){u.add(t,"visibilitychange",()=>{t.hidden&&l()})}function h(){y(),u.clear()}function p(g){if(!i)return;o||(o=g,e(),e());let f=g-o;for(o=g,c+=f;c>=s;)e(),c-=s;let S=c/s;r(S),i&&(i=n.requestAnimationFrame(p))}function m(){i||(i=n.requestAnimationFrame(p))}function y(){n.cancelAnimationFrame(i),o=null,c=0,i=0}function l(){o=null,c=0}return{init:a,destroy:h,start:m,stop:y,update:e,render:r}}function sn(t,n){let e=n==="rtl",r=t==="y",u=r?"y":"x",s=r?"x":"y",o=!r&&e?-1:1,c=h(),i=p();function a(l){let{height:d,width:g}=l;return r?d:g}function h(){return r?"top":e?"right":"left"}function p(){return r?"bottom":e?"left":"right"}function m(l){return l*o}return{scroll:u,cross:s,startEdge:c,endEdge:i,measureSize:a,direction:m}}function ot(t=0,n=0){let e=F(t-n);function r(a){return a<t}function u(a){return a>n}function s(a){return r(a)||u(a)}function o(a){return s(a)?r(a)?t:n:a}function c(a){return e?a-e*Math.ceil((a-n)/e):a}return{length:e,max:n,min:t,constrain:o,reachedAny:s,reachedMax:u,reachedMin:r,removeOffset:c}}function Ht(t,n,e){let{constrain:r}=ot(0,t),u=t+1,s=o(n);function o(m){return e?F((u+m)%u):r(m)}function c(){return s}function i(m){return s=o(m),p}function a(m){return h().set(c()+m)}function h(){return Ht(t,c(),e)}let p={get:c,set:i,add:a,clone:h};return p}function cn(t,n,e,r,u,s,o,c,i,a,h,p,m,y,l,d,g,f,S){let{cross:x,direction:v}=t,D=["INPUT","SELECT","TEXTAREA"],I={passive:!1},E=dt(),L=dt(),T=ot(50,225).constrain(y.measure(20)),P={mouse:300,touch:400},A={mouse:500,touch:600},C=l?43:25,R=!1,O=0,k=0,G=!1,H=!1,U=!1,$=!1;function K(b){if(!S)return;function w(V){(gt(S)||S(b,V))&&it(V)}let N=n;E.add(N,"dragstart",V=>V.preventDefault(),I).add(N,"touchmove",()=>{},I).add(N,"touchend",()=>{}).add(N,"touchstart",w).add(N,"mousedown",w).add(N,"touchcancel",B).add(N,"contextmenu",B).add(N,"click",Z,!0)}function j(){E.clear(),L.clear()}function _(){let b=$?e:n;L.add(b,"touchmove",z,I).add(b,"touchend",B).add(b,"mousemove",z,I).add(b,"mouseup",B)}function J(b){let w=b.nodeName||"";return D.includes(w)}function Y(){return(l?A:P)[$?"mouse":"touch"]}function st(b,w){let N=p.add(At(b)*-1),V=h.byDistance(b,!l).distance;return l||F(b)<T?V:g&&w?V*.5:h.byIndex(N.get(),0).distance}function it(b){let w=It(b,r);$=w,U=l&&w&&!b.buttons&&R,R=at(u.get(),o.get())>=2,!(w&&b.button!==0)&&(J(b.target)||(G=!0,s.pointerDown(b),a.useFriction(0).useDuration(0),u.set(o),_(),O=s.readPoint(b),k=s.readPoint(b,x),m.emit("pointerDown")))}function z(b){if(!It(b,r)&&b.touches.length>=2)return B(b);let N=s.readPoint(b),V=s.readPoint(b,x),X=at(N,O),W=at(V,k);if(!H&&!$&&(!b.cancelable||(H=X>W,!H)))return B(b);let nt=s.pointerMove(b);X>d&&(U=!0),a.useFriction(.3).useDuration(.75),c.start(),u.add(v(nt)),b.preventDefault()}function B(b){let N=h.byDistance(0,!1).index!==p.get(),V=s.pointerUp(b)*Y(),X=st(v(V),N),W=nn(V,X),nt=C-10*W,tt=f+W/50;H=!1,G=!1,L.clear(),a.useDuration(nt).useFriction(tt),i.distance(X,!l),$=!1,m.emit("pointerUp")}function Z(b){U&&(b.stopPropagation(),b.preventDefault(),U=!1)}function q(){return G}return{init:K,destroy:j,pointerDown:q}}function un(t,n){let r,u;function s(p){return p.timeStamp}function o(p,m){let l=`client${(m||t.scroll)==="x"?"X":"Y"}`;return(It(p,n)?p:p.touches[0])[l]}function c(p){return r=p,u=p,o(p)}function i(p){let m=o(p)-o(u),y=s(p)-s(r)>170;return u=p,y&&(r=p),m}function a(p){if(!r||!u)return 0;let m=o(u)-o(r),y=s(p)-s(r),l=s(p)-s(u)>170,d=m/y;return y&&!l&&F(d)>.1?d:0}return{pointerDown:c,pointerMove:i,pointerUp:a,readPoint:o}}function an(){function t(e){let{offsetTop:r,offsetLeft:u,offsetWidth:s,offsetHeight:o}=e;return{top:r,right:u+s,bottom:r+o,left:u,width:s,height:o}}return{measure:t}}function ln(t){function n(r){return t*(r/100)}return{measure:n}}function fn(t,n,e,r,u,s,o){let c=[t].concat(r),i,a,h=[],p=!1;function m(g){return u.measureSize(o.measure(g))}function y(g){if(!s)return;a=m(t),h=r.map(m);function f(S){for(let x of S){if(p)return;let v=x.target===t,D=r.indexOf(x.target),I=v?a:h[D],E=m(v?t:r[D]);if(F(E-I)>=.5){g.reInit(),n.emit("resize");break}}}i=new ResizeObserver(S=>{(gt(s)||s(g,S))&&f(S)}),e.requestAnimationFrame(()=>{c.forEach(S=>i.observe(S))})}function l(){p=!0,i&&i.disconnect()}return{init:y,destroy:l}}function dn(t,n,e,r,u,s){let o=0,c=0,i=u,a=s,h=t.get(),p=0;function m(){let I=r.get()-t.get(),E=!i,L=0;return E?(o=0,e.set(r),t.set(r),L=I):(e.set(t),o+=I/i,o*=a,h+=o,t.add(o),L=h-p),c=At(L),p=h,D}function y(){let I=r.get()-n.get();return F(I)<.001}function l(){return i}function d(){return c}function g(){return o}function f(){return x(u)}function S(){return v(s)}function x(I){return i=I,D}function v(I){return a=I,D}let D={direction:d,duration:l,velocity:g,seek:m,settled:y,useBaseFriction:S,useBaseDuration:f,useFriction:v,useDuration:x};return D}function pn(t,n,e,r,u){let s=u.measure(10),o=u.measure(50),c=ot(.1,.99),i=!1;function a(){return!(i||!t.reachedAny(e.get())||!t.reachedAny(n.get()))}function h(y){if(!a())return;let l=t.reachedMin(n.get())?"min":"max",d=F(t[l]-n.get()),g=e.get()-n.get(),f=c.constrain(d/o);e.subtract(g*f),!y&&F(g)<s&&(e.set(t.constrain(e.get())),r.useDuration(25).useBaseFriction())}function p(y){i=!y}return{shouldConstrain:a,constrain:h,toggleActive:p}}function mn(t,n,e,r,u){let s=ot(-n+t,0),o=p(),c=h(),i=m();function a(l,d){return at(l,d)<=1}function h(){let l=o[0],d=Q(o),g=o.lastIndexOf(l),f=o.indexOf(d)+1;return ot(g,f)}function p(){return e.map((l,d)=>{let{min:g,max:f}=s,S=s.constrain(l),x=!d,v=Dt(e,d);return x?f:v||a(g,S)?g:a(f,S)?f:S}).map(l=>parseFloat(l.toFixed(3)))}function m(){if(n<=t+u)return[s.max];if(r==="keepSnaps")return o;let{min:l,max:d}=c;return o.slice(l,d)}return{snapsContained:i,scrollContainLimit:c}}function gn(t,n,e){let r=n[0],u=e?r-t:Q(n);return{limit:ot(u,r)}}function hn(t,n,e,r){let s=n.min+.1,o=n.max+.1,{reachedMin:c,reachedMax:i}=ot(s,o);function a(m){return m===1?i(e.get()):m===-1?c(e.get()):!1}function h(m){if(!a(m))return;let y=t*(m*-1);r.forEach(l=>l.add(y))}return{loop:h}}function Sn(t){let{max:n,length:e}=t;function r(s){let o=s-n;return e?o/-e:0}return{get:r}}function yn(t,n,e,r,u){let{startEdge:s,endEdge:o}=t,{groupSlides:c}=u,i=p().map(n.measure),a=m(),h=y();function p(){return c(r).map(d=>Q(d)[o]-d[0][s]).map(F)}function m(){return r.map(d=>e[s]-d[s]).map(d=>-F(d))}function y(){return c(a).map(d=>d[0]).map((d,g)=>d+i[g])}return{snaps:a,snapsAligned:h}}function bn(t,n,e,r,u,s){let{groupSlides:o}=u,{min:c,max:i}=r,a=h();function h(){let m=o(s),y=!t||n==="keepSnaps";return e.length===1?[s]:y?m:m.slice(c,i).map((l,d,g)=>{let f=!d,S=Dt(g,d);if(f){let x=Q(g[0])+1;return zt(x)}if(S){let x=pt(s)-Q(g)[0]+1;return zt(x,Q(g)[0])}return l})}return{slideRegistry:a}}function xn(t,n,e,r,u){let{reachedAny:s,removeOffset:o,constrain:c}=r;function i(l){return l.concat().sort((d,g)=>F(d)-F(g))[0]}function a(l){let d=t?o(l):c(l),g=n.map((S,x)=>({diff:h(S-d,0),index:x})).sort((S,x)=>F(S.diff)-F(x.diff)),{index:f}=g[0];return{index:f,distance:d}}function h(l,d){let g=[l,l+e,l-e];if(!t)return l;if(!d)return i(g);let f=g.filter(S=>At(S)===d);return f.length?i(f):Q(g)-e}function p(l,d){let g=n[l]-u.get(),f=h(g,d);return{index:l,distance:f}}function m(l,d){let g=u.get()+l,{index:f,distance:S}=a(g),x=!t&&s(g);if(!d||x)return{index:f,distance:l};let v=n[f]-S,D=l+h(v,0);return{index:f,distance:D}}return{byDistance:m,byIndex:p,shortcut:h}}function En(t,n,e,r,u,s,o){function c(p){let m=p.distance,y=p.index!==n.get();s.add(m),m&&(r.duration()?t.start():(t.update(),t.render(1),t.update())),y&&(e.set(n.get()),n.set(p.index),o.emit("select"))}function i(p,m){let y=u.byDistance(p,m);c(y)}function a(p,m){let y=n.clone().set(p),l=u.byIndex(y.get(),m);c(l)}return{distance:i,index:a}}function Ln(t,n,e,r,u,s,o,c){let i={passive:!0,capture:!0},a=0;function h(y){if(!c)return;function l(d){if(new Date().getTime()-a>10)return;o.emit("slideFocusStart"),t.scrollLeft=0;let S=e.findIndex(x=>x.includes(d));Tt(S)&&(u.useDuration(0),r.index(S,0),o.emit("slideFocus"))}s.add(document,"keydown",p,!1),n.forEach((d,g)=>{s.add(d,"focus",f=>{(gt(c)||c(y,f))&&l(g)},i)})}function p(y){y.code==="Tab"&&(a=new Date().getTime())}return{init:h}}function ut(t){let n=t;function e(){return n}function r(i){n=o(i)}function u(i){n+=o(i)}function s(i){n-=o(i)}function o(i){return Tt(i)?i:i.get()}return{get:e,set:r,add:u,subtract:s}}function jt(t,n){let e=t.scroll==="x"?o:c,r=n.style,u=null,s=!1;function o(m){return`translate3d(${m}px,0px,0px)`}function c(m){return`translate3d(0px,${m}px,0px)`}function i(m){if(s)return;let y=en(t.direction(m));y!==u&&(r.transform=e(y),u=y)}function a(m){s=!m}function h(){s||(r.transform="",n.getAttribute("style")||n.removeAttribute("style"))}return{clear:h,to:i,toggleActive:a}}function vn(t,n,e,r,u,s,o,c,i){let h=lt(u),p=lt(u).reverse(),m=f().concat(S());function y(E,L){return E.reduce((T,P)=>T-u[P],L)}function l(E,L){return E.reduce((T,P)=>y(T,L)>0?T.concat([P]):T,[])}function d(E){return s.map((L,T)=>({start:L-r[T]+.5+E,end:L+n-.5+E}))}function g(E,L,T){let P=d(L);return E.map(A=>{let C=T?0:-e,R=T?e:0,O=T?"end":"start",k=P[A][O];return{index:A,loopPoint:k,slideLocation:ut(-1),translate:jt(t,i[A]),target:()=>c.get()>k?C:R}})}function f(){let E=o[0],L=l(p,E);return g(L,e,!1)}function S(){let E=n-o[0]-1,L=l(h,E);return g(L,-e,!0)}function x(){return m.every(({index:E})=>{let L=h.filter(T=>T!==E);return y(L,n)<=.1})}function v(){m.forEach(E=>{let{target:L,translate:T,slideLocation:P}=E,A=L();A!==P.get()&&(T.to(A),P.set(A))})}function D(){m.forEach(E=>E.translate.clear())}return{canLoop:x,clear:D,loop:v,loopPoints:m}}function In(t,n,e){let r,u=!1;function s(i){if(!e)return;function a(h){for(let p of h)if(p.type==="childList"){i.reInit(),n.emit("slidesChanged");break}}r=new MutationObserver(h=>{u||(gt(e)||e(i,h))&&a(h)}),r.observe(t,{childList:!0})}function o(){r&&r.disconnect(),u=!0}return{init:s,destroy:o}}function Tn(t,n,e,r){let u={},s=null,o=null,c,i=!1;function a(){c=new IntersectionObserver(l=>{i||(l.forEach(d=>{let g=n.indexOf(d.target);u[g]=d}),s=null,o=null,e.emit("slidesInView"))},{root:t.parentElement,threshold:r}),n.forEach(l=>c.observe(l))}function h(){c&&c.disconnect(),i=!0}function p(l){return ft(u).reduce((d,g)=>{let f=parseInt(g),{isIntersecting:S}=u[f];return(l&&S||!l&&!S)&&d.push(f),d},[])}function m(l=!0){if(l&&s)return s;if(!l&&o)return o;let d=p(l);return l&&(s=d),l||(o=d),d}return{init:a,destroy:h,get:m}}function An(t,n,e,r,u,s){let{measureSize:o,startEdge:c,endEdge:i}=t,a=e[0]&&u,h=l(),p=d(),m=e.map(o),y=g();function l(){if(!a)return 0;let S=e[0];return F(n[c]-S[c])}function d(){if(!a)return 0;let S=s.getComputedStyle(Q(r));return parseFloat(S.getPropertyValue(`margin-${i}`))}function g(){return e.map((S,x,v)=>{let D=!x,I=Dt(v,x);return D?m[x]+h:I?m[x]+p:v[x+1][c]-S[c]}).map(F)}return{slideSizes:m,slideSizesWithGaps:y,startGap:h,endGap:p}}function Dn(t,n,e,r,u,s,o,c,i){let{startEdge:a,endEdge:h,direction:p}=t,m=Tt(e);function y(f,S){return lt(f).filter(x=>x%S===0).map(x=>f.slice(x,x+S))}function l(f){return f.length?lt(f).reduce((S,x,v)=>{let D=Q(S)||0,I=D===0,E=x===pt(f),L=u[a]-s[D][a],T=u[a]-s[x][h],P=!r&&I?p(o):0,A=!r&&E?p(c):0,C=F(T-A-(L+P));return v&&C>n+i&&S.push(x),E&&S.push(f.length),S},[]).map((S,x,v)=>{let D=Math.max(v[x-1]||0);return f.slice(D,S)}):[]}function d(f){return m?y(f,e):l(f)}return{groupSlides:d}}function On(t,n,e,r,u,s,o){let{align:c,axis:i,direction:a,startIndex:h,loop:p,duration:m,dragFree:y,dragThreshold:l,inViewThreshold:d,slidesToScroll:g,skipSnaps:f,containScroll:S,watchResize:x,watchSlides:v,watchDrag:D,watchFocus:I}=s,E=2,L=an(),T=L.measure(n),P=e.map(L.measure),A=sn(i,a),C=A.measureSize(T),R=ln(C),O=on(c,C),k=!p&&!!S,G=p||!!S,{slideSizes:H,slideSizesWithGaps:U,startGap:$,endGap:K}=An(A,T,P,e,G,u),j=Dn(A,C,g,p,T,P,$,K,E),{snaps:_,snapsAligned:J}=yn(A,O,T,P,j),Y=-Q(_)+Q(U),{snapsContained:st,scrollContainLimit:it}=mn(C,Y,J,S,E),z=k?st:J,{limit:B}=gn(Y,z,p),Z=Ht(pt(z),h,p),q=Z.clone(),M=lt(e),b=({dragHandler:rt,scrollBody:Et,scrollBounds:Lt,options:{loop:mt}})=>{mt||Lt.constrain(rt.pointerDown()),Et.seek()},w=({scrollBody:rt,translate:Et,location:Lt,offsetLocation:mt,previousLocation:Kt,scrollLooper:Xt,slideLooper:_t,dragHandler:Jt,animation:Yt,eventHandler:Ft,scrollBounds:Zt,options:{loop:Pt}},Nt)=>{let Ct=rt.settled(),Wt=!Zt.shouldConstrain(),kt=Pt?Ct:Ct&&Wt,Bt=kt&&!Jt.pointerDown();Bt&&Yt.stop();let tn=Lt.get()*Nt+Kt.get()*(1-Nt);mt.set(tn),Pt&&(Xt.loop(rt.direction()),_t.loop()),Et.to(mt.get()),Bt&&Ft.emit("settle"),kt||Ft.emit("scroll")},N=rn(r,u,()=>b(xt),rt=>w(xt,rt)),V=.68,X=z[Z.get()],W=ut(X),nt=ut(X),tt=ut(X),et=ut(X),ct=dn(W,tt,nt,et,m,V),yt=xn(p,z,Y,B,et),bt=En(N,Z,q,ct,yt,et,o),Ot=Sn(B),wt=dt(),$t=Tn(n,e,o,d),{slideRegistry:Mt}=bn(k,S,z,it,j,M),Qt=Ln(t,e,Mt,bt,ct,wt,o,I),xt={ownerDocument:r,ownerWindow:u,eventHandler:o,containerRect:T,slideRects:P,animation:N,axis:A,dragHandler:cn(A,t,r,u,et,un(A,u),W,N,bt,ct,yt,Z,o,R,y,l,f,V,D),eventStore:wt,percentOfView:R,index:Z,indexPrevious:q,limit:B,location:W,offsetLocation:tt,previousLocation:nt,options:s,resizeHandler:fn(n,o,u,e,A,x,L),scrollBody:ct,scrollBounds:pn(B,tt,et,ct,R),scrollLooper:hn(Y,B,tt,[W,tt,nt,et]),scrollProgress:Ot,scrollSnapList:z.map(Ot.get),scrollSnaps:z,scrollTarget:yt,scrollTo:bt,slideLooper:vn(A,C,Y,H,U,_,z,tt,e),slideFocus:Qt,slidesHandler:In(n,o,v),slidesInView:$t,slideIndexes:M,slideRegistry:Mt,slidesToScroll:j,target:et,translate:jt(A,n)};return xt}function wn(){let t={},n;function e(a){n=a}function r(a){return t[a]||[]}function u(a){return r(a).forEach(h=>h(n,a)),i}function s(a,h){return t[a]=r(a).concat([h]),i}function o(a,h){return t[a]=r(a).filter(p=>p!==h),i}function c(){t={}}let i={init:e,emit:u,off:o,on:s,clear:c};return i}var Mn={align:"center",axis:"x",container:null,slides:null,containScroll:"trimSnaps",direction:"ltr",slidesToScroll:1,inViewThreshold:0,breakpoints:{},dragFree:!1,dragThreshold:10,loop:!1,skipSnaps:!1,duration:25,startIndex:0,active:!0,watchDrag:!0,watchResize:!0,watchSlides:!0,watchFocus:!0};function Fn(t){function n(s,o){return Gt(s,o||{})}function e(s){let o=s.breakpoints||{},c=ft(o).filter(i=>t.matchMedia(i).matches).map(i=>o[i]).reduce((i,a)=>n(i,a),{});return n(s,c)}function r(s){return s.map(o=>ft(o.breakpoints||{})).reduce((o,c)=>o.concat(c),[]).map(t.matchMedia)}return{mergeOptions:n,optionsAtMedia:e,optionsMediaQueries:r}}function Pn(t){let n=[];function e(s,o){return n=o.filter(({options:c})=>t.optionsAtMedia(c).active!==!1),n.forEach(c=>c.init(s,t)),o.reduce((c,i)=>Object.assign(c,{[i.name]:i}),{})}function r(){n=n.filter(s=>s.destroy())}return{init:e,destroy:r}}function ht(t,n,e){let r=t.ownerDocument,u=r.defaultView,s=Fn(u),o=Pn(s),c=dt(),i=wn(),{mergeOptions:a,optionsAtMedia:h,optionsMediaQueries:p}=s,{on:m,off:y,emit:l}=i,d=A,g=!1,f,S=a(Mn,ht.globalOptions),x=a(S),v=[],D,I,E;function L(){let{container:M,slides:b}=x;I=(vt(M)?t.querySelector(M):M)||t.children[0];let N=vt(b)?I.querySelectorAll(b):b;E=[].slice.call(N||I.children)}function T(M){let b=On(t,I,E,r,u,M,i);if(M.loop&&!b.slideLooper.canLoop()){let w=Object.assign({},M,{loop:!1});return T(w)}return b}function P(M,b){g||(S=a(S,M),x=h(S),v=b||v,L(),f=T(x),p([S,...v.map(({options:w})=>w)]).forEach(w=>c.add(w,"change",A)),x.active&&(f.translate.to(f.location.get()),f.animation.init(),f.slidesInView.init(),f.slideFocus.init(q),f.eventHandler.init(q),f.resizeHandler.init(q),f.slidesHandler.init(q),f.options.loop&&f.slideLooper.loop(),I.offsetParent&&E.length&&f.dragHandler.init(q),D=o.init(q,v)))}function A(M,b){let w=j();C(),P(a({startIndex:w},M),b),i.emit("reInit")}function C(){f.dragHandler.destroy(),f.eventStore.clear(),f.translate.clear(),f.slideLooper.clear(),f.resizeHandler.destroy(),f.slidesHandler.destroy(),f.slidesInView.destroy(),f.animation.destroy(),o.destroy(),c.clear()}function R(){g||(g=!0,c.clear(),C(),i.emit("destroy"),i.clear())}function O(M,b,w){!x.active||g||(f.scrollBody.useBaseFriction().useDuration(b===!0?0:x.duration),f.scrollTo.index(M,w||0))}function k(M){let b=f.index.add(1).get();O(b,M,-1)}function G(M){let b=f.index.add(-1).get();O(b,M,1)}function H(){return f.index.add(1).get()!==j()}function U(){return f.index.add(-1).get()!==j()}function $(){return f.scrollSnapList}function K(){return f.scrollProgress.get(f.offsetLocation.get())}function j(){return f.index.get()}function _(){return f.indexPrevious.get()}function J(){return f.slidesInView.get()}function Y(){return f.slidesInView.get(!1)}function st(){return D}function it(){return f}function z(){return t}function B(){return I}function Z(){return E}let q={canScrollNext:H,canScrollPrev:U,containerNode:B,internalEngine:it,destroy:R,off:y,on:m,emit:l,plugins:st,previousScrollSnap:_,reInit:d,rootNode:z,scrollNext:k,scrollPrev:G,scrollProgress:K,scrollSnapList:$,scrollTo:O,selectedScrollSnap:j,slideNodes:Z,slidesInView:J,slidesNotInView:Y};return P(n,e),setTimeout(()=>i.emit("init"),0),q}ht.globalOptions=void 0;var Nn={active:!0,breakpoints:{},delay:4e3,jump:!1,playOnInit:!0,stopOnFocusIn:!0,stopOnInteraction:!0,stopOnMouseEnter:!1,stopOnLastSnap:!1,rootNode:null};function Cn(t,n){let e=t.scrollSnapList();return typeof n=="number"?e.map(()=>n):n(e,t)}function kn(t,n){let e=t.rootNode();return n&&n(e)||e}function St(t={}){let n,e,r,u,s=null,o=0,c=!1,i=!1,a=!1,h=!1;function p(O,k){e=O;let{mergeOptions:G,optionsAtMedia:H}=k,U=G(Nn,St.globalOptions),$=G(U,t);if(n=H($),e.scrollSnapList().length<=1)return;h=n.jump,r=!1,u=Cn(e,n.delay);let{eventStore:K,ownerDocument:j}=e.internalEngine(),_=!!e.internalEngine().options.watchDrag,J=kn(e,n.rootNode);K.add(j,"visibilitychange",f),_&&e.on("pointerDown",x),_&&!n.stopOnInteraction&&e.on("pointerUp",v),n.stopOnMouseEnter&&K.add(J,"mouseenter",D),n.stopOnMouseEnter&&!n.stopOnInteraction&&K.add(J,"mouseleave",I),n.stopOnFocusIn&&e.on("slideFocusStart",g),n.stopOnFocusIn&&!n.stopOnInteraction&&K.add(e.containerNode(),"focusout",d),n.playOnInit&&d()}function m(){e.off("pointerDown",x).off("pointerUp",v).off("slideFocusStart",g),g(),r=!0,c=!1}function y(){let{ownerWindow:O}=e.internalEngine();O.clearTimeout(o),o=O.setTimeout(A,u[e.selectedScrollSnap()]),s=new Date().getTime(),e.emit("autoplay:timerset")}function l(){let{ownerWindow:O}=e.internalEngine();O.clearTimeout(o),o=0,s=null,e.emit("autoplay:timerstopped")}function d(){if(!r){if(S()){a=!0;return}c||e.emit("autoplay:play"),y(),c=!0}}function g(){r||(c&&e.emit("autoplay:stop"),l(),c=!1)}function f(){if(S())return a=c,g();a&&d()}function S(){let{ownerDocument:O}=e.internalEngine();return O.visibilityState==="hidden"}function x(){i||g()}function v(){i||d()}function D(){i=!0,g()}function I(){i=!1,d()}function E(O){typeof O<"u"&&(h=O),d()}function L(){c&&g()}function T(){c&&d()}function P(){return c}function A(){let{index:O}=e.internalEngine(),k=O.clone().add(1).get(),G=e.scrollSnapList().length-1,H=n.stopOnLastSnap&&k===G;if(e.canScrollNext()?e.scrollNext(h):e.scrollTo(0,h),e.emit("autoplay:select"),H)return g();d()}function C(){if(!s)return null;let O=u[e.selectedScrollSnap()],k=new Date().getTime()-s;return O-k}return{name:"autoplay",options:t,init:p,destroy:m,play:E,stop:L,reset:T,isPlaying:P,timeUntilNext:C}}St.globalOptions=void 0;var qt=new WeakSet;function Ut(t){if(qt.has(t))return;let n=t.querySelector("[data-slot=carousel-content]");if(!n)return;qt.add(t);let e={};try{e=JSON.parse(t.getAttribute("data-options")||"{}")}catch{}e.axis=t.getAttribute("data-orientation")==="vertical"?"y":"x";let r=n.getAttribute("data-track"),u=r&&n.querySelector(r);u&&(e.container=u);let s=[],o=Number(t.getAttribute("data-autoplay"));o>0&&s.push(St({delay:o,stopOnMouseEnter:!0,stopOnFocusIn:!0,stopOnInteraction:!0}));let c=ht(n,e,s),i=t.querySelector("[data-slot=carousel-previous], [data-carousel-previous]"),a=t.querySelector("[data-slot=carousel-next], [data-carousel-next]"),h=t.querySelector("[data-slot=carousel-dots]"),p=h&&h.getAttribute("data-dot-class");i?.addEventListener("click",()=>c.scrollPrev()),a?.addEventListener("click",()=>c.scrollNext());let m=()=>{h&&h.replaceChildren(...c.scrollSnapList().map((l,d)=>{let g=document.createElement("button");return g.type="button",g.setAttribute("data-slot","carousel-dot"),g.setAttribute("aria-label",`Go to slide ${d+1}`),p&&(g.className=p),g.addEventListener("click",()=>c.scrollTo(d)),g}))},y=()=>{i&&(i.disabled=!c.canScrollPrev()),a&&(a.disabled=!c.canScrollNext()),h&&[...h.children].forEach((l,d)=>{d===c.selectedScrollSnap()?l.setAttribute("aria-current","true"):l.removeAttribute("aria-current")})};c.on("init",()=>{m(),y()}),c.on("reInit",()=>{m(),y()}),c.on("select",y),m(),y(),t.addEventListener("keydown",l=>{l.key==="ArrowLeft"?(l.preventDefault(),c.scrollPrev()):l.key==="ArrowRight"&&(l.preventDefault(),c.scrollNext())},!0)}function Rt(t){t.querySelectorAll?.("[data-slot=carousel]").forEach(Ut)}if(!window.baselineCarousel){window.baselineCarousel=!0;let t=()=>{Rt(document),new MutationObserver(n=>{for(let e of n)for(let r of e.addedNodes)r instanceof Element&&(r.matches("[data-slot=carousel]")&&Ut(r),Rt(r))}).observe(document.documentElement,{childList:!0,subtree:!0})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",t):t()}})();

package/templates/wordpress/theme/assets/js/core-button-editor.js

@@ -0,0 +1,243 @@
+/**
+ * Baseline core/button editor integration (ADR-0018, icons ADR-0020). Plain JS on the WordPress globals; no bundler.
+ * Only what cannot be done in PHP or theme.json lives here:
+ * - the Size control, first item of the Dimensions panel (Styles tab), bound to `baselineSize`;
+ * - the Icon panel (Settings tab): a searchable grid of the registered `baseline` collection (inlined by PHP as
+ *   window.baselineIcons), icon position and icon-only toggles, bound to `baselineIcon*`;
+ * - the editor-side wrapper classes (is-size-*, has-icon, has-icon-end, is-icon-only) and a `--baseline-icon`
+ *   data-URI so editor CSS can paint the icon as a mask pseudo-element without touching RichText content.
+ * Block styles are registered in inc/core-button.php; token panels are switched off in theme.json `settings.blocks`.
+ */
+(function (wp) {
+  'use strict';
+  var __ = wp.i18n.__;
+  var el = wp.element.createElement;
+  var Fragment = wp.element.Fragment;
+  var RawHTML = wp.element.RawHTML;
+  var useState = wp.element.useState;
+  var addFilter = wp.hooks.addFilter;
+  var createHigherOrderComponent = wp.compose.createHigherOrderComponent;
+  var InspectorControls = wp.blockEditor.InspectorControls;
+  var c = wp.components;
+  var SelectControl = c.SelectControl;
+  var ToolsPanelItem = c.__experimentalToolsPanelItem;
+  var PanelBody = c.PanelBody;
+  var SearchControl = c.SearchControl;
+  var ToggleControl = c.ToggleControl;
+  var TextControl = c.TextControl;
+  var Button = c.Button;
+  var ToggleGroupControl = c.__experimentalToggleGroupControl;
+  var ToggleGroupControlOption = c.__experimentalToggleGroupControlOption;
+
+  var BUTTON = 'core/button';
+  var DEFAULT_SIZE = 'md';
+  var SIZES = [
+    { label: 'XS', value: 'xs' },
+    { label: 'SM', value: 'sm' },
+    { label: 'MD', value: 'md' },
+    { label: 'LG', value: 'lg' },
+  ];
+  var ICONS = Array.isArray(window.baselineIcons) ? window.baselineIcons : [];
+  function findIcon(name) {
+    for (var i = 0; i < ICONS.length; i++) {
+      if (ICONS[i].name === name) {
+        return ICONS[i];
+      }
+    }
+    return null;
+  }
+
+  /* ---- Size: an item of the Dimensions panel (mounted before BlockEdit so it is the first row) ---- */
+  function sizeItem(props) {
+    var size = props.attributes.baselineSize || DEFAULT_SIZE;
+    var reset = function () {
+      props.setAttributes({ baselineSize: DEFAULT_SIZE });
+    };
+    return el(
+      InspectorControls,
+      { group: 'dimensions' },
+      el(
+        ToolsPanelItem,
+        {
+          label: __('Size', 'baseline'),
+          panelId: props.clientId,
+          isShownByDefault: true,
+          hasValue: function () {
+            return size !== DEFAULT_SIZE;
+          },
+          onDeselect: reset,
+        },
+        el(SelectControl, {
+          label: __('Size', 'baseline'),
+          value: size,
+          options: SIZES,
+          onChange: function (value) {
+            props.setAttributes({ baselineSize: value });
+          },
+          __nextHasNoMarginBottom: true,
+          __next40pxDefaultSize: true,
+        })
+      )
+    );
+  }
+
+  /* ---- Icon: Settings tab panel with a searchable grid of the registered collection ---- */
+  function IconPanel(props) {
+    var attrs = props.attributes;
+    var current = findIcon(attrs.baselineIcon || '');
+    var search = useState('');
+    var query = search[0].toLowerCase();
+    var matches = ICONS.filter(function (i) {
+      return !query || i.name.indexOf(query) !== -1 || i.label.toLowerCase().indexOf(query) !== -1;
+    });
+    var positionControl = ToggleGroupControl
+      ? el(
+          ToggleGroupControl,
+          {
+            label: __('Position', 'baseline'),
+            value: attrs.baselineIconPosition || 'start',
+            isBlock: true,
+            onChange: function (v) {
+              props.setAttributes({ baselineIconPosition: v });
+            },
+            __nextHasNoMarginBottom: true,
+            __next40pxDefaultSize: true,
+          },
+          el(ToggleGroupControlOption, { value: 'start', label: __('Before text', 'baseline') }),
+          el(ToggleGroupControlOption, { value: 'end', label: __('After text', 'baseline') })
+        )
+      : el(SelectControl, {
+          label: __('Position', 'baseline'),
+          value: attrs.baselineIconPosition || 'start',
+          options: [
+            { value: 'start', label: __('Before text', 'baseline') },
+            { value: 'end', label: __('After text', 'baseline') },
+          ],
+          onChange: function (v) {
+            props.setAttributes({ baselineIconPosition: v });
+          },
+          __nextHasNoMarginBottom: true,
+        });
+
+    return el(
+      PanelBody,
+      { title: __('Icon', 'baseline'), initialOpen: !!current },
+      current
+        ? el(
+            'div',
+            { className: 'baseline-icon-current' },
+            el(RawHTML, { className: 'baseline-icon-current__glyph' }, current.svg),
+            el('span', { className: 'baseline-icon-current__label' }, current.label),
+            el(
+              Button,
+              {
+                variant: 'tertiary',
+                isDestructive: true,
+                size: 'compact',
+                onClick: function () {
+                  props.setAttributes({ baselineIcon: '', baselineIconOnly: false });
+                },
+              },
+              __('Remove', 'baseline')
+            )
+          )
+        : null,
+      el(SearchControl, {
+        label: __('Search icons', 'baseline'),
+        value: search[0],
+        onChange: search[1],
+        __nextHasNoMarginBottom: true,
+      }),
+      el(
+        'div',
+        { className: 'baseline-icon-grid', role: 'listbox', 'aria-label': __('Baseline icons', 'baseline') },
+        matches.map(function (i) {
+          var selected = current && current.name === i.name;
+          return el(
+            'button',
+            {
+              key: i.name,
+              type: 'button',
+              role: 'option',
+              'aria-selected': selected ? 'true' : 'false',
+              title: i.label,
+              className: 'baseline-icon-grid__item' + (selected ? ' is-selected' : ''),
+              onClick: function () {
+                props.setAttributes({ baselineIcon: i.name });
+              },
+            },
+            el(RawHTML, null, i.svg)
+          );
+        })
+      ),
+      current ? positionControl : null,
+      current
+        ? el(ToggleControl, {
+            label: __('Icon only (text becomes the accessible name)', 'baseline'),
+            checked: !!attrs.baselineIconOnly,
+            onChange: function (v) {
+              props.setAttributes({ baselineIconOnly: !!v });
+            },
+            __nextHasNoMarginBottom: true,
+          })
+        : null,
+      current && attrs.baselineIconOnly
+        ? el(TextControl, {
+            label: __('Accessible label', 'baseline'),
+            help: __('Read by screen readers; hidden visually.', 'baseline'),
+            value: attrs.text ? String(attrs.text).replace(/<[^>]+>/g, '') : '',
+            onChange: function (v) {
+              props.setAttributes({ text: v });
+            },
+            __nextHasNoMarginBottom: true,
+            __next40pxDefaultSize: true,
+          })
+        : null
+    );
+  }
+
+  addFilter(
+    'editor.BlockEdit',
+    'baseline/core-button-controls',
+    createHigherOrderComponent(function (BlockEdit) {
+      return function (props) {
+        if (props.name !== BUTTON) {
+          return el(BlockEdit, props);
+        }
+        return el(Fragment, null, sizeItem(props), el(BlockEdit, props), el(InspectorControls, null, el(IconPanel, props)));
+      };
+    }, 'withBaselineButtonControls')
+  );
+
+  /* ---- Canvas: mirror the render-time classes; expose the icon as a mask image for editor CSS ---- */
+  addFilter(
+    'editor.BlockListBlock',
+    'baseline/core-button-classes',
+    createHigherOrderComponent(function (BlockListBlock) {
+      return function (props) {
+        if (props.name !== BUTTON) {
+          return el(BlockListBlock, props);
+        }
+        var a = props.attributes;
+        var classes = ['is-size-' + (a.baselineSize || DEFAULT_SIZE)];
+        var style = {};
+        var icon = findIcon(a.baselineIcon || '');
+        if (icon) {
+          classes.push('has-icon');
+          if (a.baselineIconPosition === 'end') {
+            classes.push('has-icon-end');
+          }
+          if (a.baselineIconOnly) {
+            classes.push('is-icon-only');
+          }
+          style['--baseline-icon'] = 'url("data:image/svg+xml,' + encodeURIComponent(icon.svg) + '")';
+        }
+        var wrapperProps = Object.assign({}, props.wrapperProps, {
+          style: Object.assign({}, props.wrapperProps && props.wrapperProps.style, style),
+        });
+        var className = (props.className ? props.className + ' ' : '') + classes.join(' ');
+        return el(BlockListBlock, Object.assign({}, props, { className: className, wrapperProps: wrapperProps }));
+      };
+    }, 'withBaselineButtonClasses')
+  );
+})(window.wp);

package/templates/wordpress/theme/assets/js/core-layout-editor.js

@@ -0,0 +1,144 @@
+/**
+ * Baseline layout editor integration (B5; specs: components/section, columns). Plain JS on the WordPress globals; no
+ * bundler. Only what PHP and theme.json cannot do (inc/core-layout.php registers the attributes and renders them):
+ * - Scheme and Surface selects for core/group (the Section's colour scheme and Figma Surface mode), shown on the canvas
+ *   as data-scheme and has-surface-<mode>;
+ * - an "Invert order when stacked" toggle for core/columns, shown on the canvas as is-inverted-on-mobile;
+ * - the two Figma ratios core/columns has no variation for (40 / 60 and 60 / 40).
+ */
+(function (wp) {
+  'use strict';
+  var __ = wp.i18n.__;
+  var el = wp.element.createElement;
+  var Fragment = wp.element.Fragment;
+  var addFilter = wp.hooks.addFilter;
+  var createHigherOrderComponent = wp.compose.createHigherOrderComponent;
+  var InspectorControls = wp.blockEditor.InspectorControls;
+  var PanelBody = wp.components.PanelBody;
+  var SelectControl = wp.components.SelectControl;
+  var ToggleControl = wp.components.ToggleControl;
+
+  var SCHEMES = [
+    { label: __('Inherit', 'baseline'), value: '' },
+    { label: 'Scheme 1', value: 'scheme-1' },
+    { label: 'Scheme 2', value: 'scheme-2' },
+    { label: 'Error', value: 'error' },
+    { label: 'Success', value: 'success' },
+    { label: 'Warning', value: 'warning' },
+  ];
+
+  var SURFACES = [
+    { label: __('Background', 'baseline'), value: '' },
+    { label: __('Muted', 'baseline'), value: 'muted' },
+    { label: __('Card', 'baseline'), value: 'card' },
+    { label: __('Primary', 'baseline'), value: 'primary' },
+    { label: __('Secondary', 'baseline'), value: 'secondary' },
+    { label: __('Accent', 'baseline'), value: 'accent' },
+    { label: __('Inverse', 'baseline'), value: 'inverse' },
+  ];
+
+  var withControls = createHigherOrderComponent(function (BlockEdit) {
+    return function (props) {
+      if (props.name === 'core/group') {
+        return el(
+          Fragment,
+          null,
+          el(BlockEdit, props),
+          el(
+            InspectorControls,
+            null,
+            el(
+              PanelBody,
+              { title: __('Scheme', 'baseline'), initialOpen: true },
+              el(SelectControl, {
+                label: __('Colour scheme', 'baseline'),
+                help: __('Paints this group (a Section) and everything in it in the chosen scheme.', 'baseline'),
+                value: props.attributes.baselineScheme || '',
+                options: SCHEMES,
+                onChange: function (value) {
+                  props.setAttributes({ baselineScheme: value });
+                },
+                __nextHasNoMarginBottom: true,
+                __next40pxDefaultSize: true,
+              }),
+              el(SelectControl, {
+                label: __('Surface', 'baseline'),
+                help: __('The fill and text pair within the scheme, e.g. Muted for an announcement bar.', 'baseline'),
+                value: props.attributes.baselineSurface || '',
+                options: SURFACES,
+                onChange: function (value) {
+                  props.setAttributes({ baselineSurface: value });
+                },
+                __nextHasNoMarginBottom: true,
+                __next40pxDefaultSize: true,
+              })
+            )
+          )
+        );
+      }
+      if (props.name === 'core/columns') {
+        return el(
+          Fragment,
+          null,
+          el(BlockEdit, props),
+          el(
+            InspectorControls,
+            null,
+            el(
+              PanelBody,
+              { title: __('Stacking', 'baseline'), initialOpen: true },
+              el(ToggleControl, {
+                label: __('Invert order when stacked', 'baseline'),
+                help: __('On mobile the last column shows first, e.g. an image on the right sits above the text.', 'baseline'),
+                checked: !!props.attributes.baselineInvertOrder,
+                onChange: function (value) {
+                  props.setAttributes({ baselineInvertOrder: value });
+                },
+                __nextHasNoMarginBottom: true,
+              })
+            )
+          )
+        );
+      }
+      return el(BlockEdit, props);
+    };
+  }, 'withBaselineLayoutControls');
+  addFilter('editor.BlockEdit', 'baseline/layout-controls', withControls);
+
+  // The canvas mirrors the render filters, so the editor shows the scheme and the inverted stacking.
+  var withCanvasAttrs = createHigherOrderComponent(function (BlockListBlock) {
+    return function (props) {
+      var a = props.attributes || {};
+      if (props.name === 'core/group' && (a.baselineScheme || a.baselineSurface)) {
+        var wrapperProps = a.baselineScheme ? Object.assign({}, props.wrapperProps, { 'data-scheme': a.baselineScheme }) : props.wrapperProps;
+        var className = a.baselineSurface ? [props.className, 'has-surface-' + a.baselineSurface].filter(Boolean).join(' ') : props.className;
+        return el(BlockListBlock, Object.assign({}, props, { wrapperProps: wrapperProps, className: className }));
+      }
+      if (props.name === 'core/columns' && a.baselineInvertOrder) {
+        return el(BlockListBlock, Object.assign({}, props, { className: [props.className, 'is-inverted-on-mobile'].filter(Boolean).join(' ') }));
+      }
+      return el(BlockListBlock, props);
+    };
+  }, 'withBaselineLayoutCanvas');
+  addFilter('editor.BlockListBlock', 'baseline/layout-canvas', withCanvasAttrs);
+
+  wp.domReady(function () {
+    var col = function (width) {
+      return ['core/column', { width: width }];
+    };
+    wp.blocks.registerBlockVariation('core/columns', {
+      name: 'baseline-two-fifths-three-fifths',
+      title: __('40 / 60', 'baseline'),
+      description: __('Two columns; the second is wider (Figma 2:3).', 'baseline'),
+      innerBlocks: [col('40%'), col('60%')],
+      scope: ['block'],
+    });
+    wp.blocks.registerBlockVariation('core/columns', {
+      name: 'baseline-three-fifths-two-fifths',
+      title: __('60 / 40', 'baseline'),
+      description: __('Two columns; the first is wider (Figma 3:2).', 'baseline'),
+      innerBlocks: [col('60%'), col('40%')],
+      scope: ['block'],
+    });
+  });
+})(window.wp);

package/templates/wordpress/theme/assets/js/core-navigation.js

@@ -0,0 +1,11 @@
+// core/navigation's mobile menu as the Sidebar's Sheet (src/core-navigation.css; spec: components/sidebar/spec.md): a
+// click on the dimmed page beside the panel closes it, as a Sheet's does. That area is the overlay's own ::before, and
+// core gives the overlay tabindex="-1", so the click keeps focus inside and core's focusout never closes it. This
+// presses core's close button, so core's Interactivity store stays the owner of the state.
+document.addEventListener("click", (event) => {
+  const panel = event.target;
+  if (!(panel instanceof Element) || !panel.matches(".wp-block-navigation__responsive-container.is-menu-open")) return;
+  const box = panel.getBoundingClientRect();
+  if (event.clientX >= box.left && event.clientX <= box.right) return; // the panel's own padding
+  panel.querySelector(".wp-block-navigation__responsive-container-close")?.click();
+});

package/templates/wordpress/theme/assets/js/media-editor.js

@@ -0,0 +1,52 @@
+/**
+ * Baseline Media editor integration (spec: components/media/spec.md, ADR-0018). Plain JS on the WordPress globals; no
+ * bundler. One toggle in the Settings tab of core/video and core/embed, bound to the server-registered attribute
+ * `baselinePlayback` (inc/media.php): "Open in a dialog" plays the video in a Baseline Dialog instead of in place.
+ * Saved markup never changes; the facade and the dialog are rendered at request time.
+ */
+(function (wp) {
+  'use strict';
+  var __ = wp.i18n.__;
+  var el = wp.element.createElement;
+  var Fragment = wp.element.Fragment;
+  var InspectorControls = wp.blockEditor.InspectorControls;
+  var PanelBody = wp.components.PanelBody;
+  var ToggleControl = wp.components.ToggleControl;
+
+  var BLOCKS = ['core/video', 'core/embed'];
+
+  wp.hooks.addFilter(
+    'editor.BlockEdit',
+    'baseline/media-playback',
+    wp.compose.createHigherOrderComponent(function (BlockEdit) {
+      return function (props) {
+        if (BLOCKS.indexOf(props.name) < 0) {
+          return el(BlockEdit, props);
+        }
+        var dialog = props.attributes.baselinePlayback === 'dialog';
+        return el(
+          Fragment,
+          null,
+          el(BlockEdit, props),
+          el(
+            InspectorControls,
+            null,
+            el(
+              PanelBody,
+              { title: __('Playback', 'baseline'), initialOpen: true },
+              el(ToggleControl, {
+                label: __('Open in a dialog', 'baseline'),
+                help: __('The play button opens the video in a dialog; closing it stops the video. Needs a poster (core/video) or a YouTube or Vimeo link (embed).', 'baseline'),
+                checked: dialog,
+                onChange: function (on) {
+                  props.setAttributes({ baselinePlayback: on ? 'dialog' : 'inline' });
+                },
+                __nextHasNoMarginBottom: true,
+              })
+            )
+          )
+        );
+      };
+    }, 'withBaselineMediaPlayback')
+  );
+})(window.wp);

package/templates/wordpress/theme/assets/js/media.js

@@ -0,0 +1,38 @@
+/* Baseline Media facade (spec: components/media/spec.md; markup from inc/media.php). The play button is a link to the
+   video; with this script the click instead puts the frame's inert <template> player to work. Nothing of the video loads
+   before that. No dependencies; delegated, so facades added later work too.
+   - inline playback: the player replaces the play button over the poster and takes focus;
+   - dialog playback (the button carries data-bl-media-dialog): the lightbox <dialog> opens first, then the player goes in,
+     so showModal() leaves focus on the close button (focus inside a cross-origin iframe would keep Escape from closing
+     it). Closing the dialog removes the player, which stops every source the same way. */
+document.addEventListener("click", (event) => {
+  const button = event.target instanceof Element ? event.target.closest("[data-bl-media-play]") : null;
+  if (!button) return;
+  const frame = button.closest(".bl-media__frame");
+  const template = frame && frame.querySelector("template[data-bl-media-player]");
+  if (!template) return;
+  event.preventDefault();
+  const player = template.content.firstElementChild.cloneNode(true);
+  player.setAttribute("tabindex", "-1");
+
+  const dialogId = button.getAttribute("data-bl-media-dialog");
+  const dialog = dialogId ? document.getElementById(dialogId) : null;
+  if (dialog) {
+    const slot = dialog.querySelector("[data-slot=media-dialog-frame]");
+    dialog.showModal();
+    slot.replaceChildren(player);
+    if (!dialog.dataset.blMediaBound) {
+      dialog.dataset.blMediaBound = "1";
+      dialog.addEventListener("close", () => slot.replaceChildren());
+      // the lightbox fills the viewport, so a click outside the video is a click on the <dialog> itself
+      dialog.addEventListener("click", (e) => {
+        if (e.target === dialog) dialog.close();
+      });
+    }
+    return;
+  }
+
+  frame.querySelector(".bl-media__play").replaceWith(player);
+  template.remove();
+  player.focus();
+});