@waveform-playlist/browser 9.2.0 → 9.2.1

package/dist/index.js

@@ -632,7 +632,7 @@
   font-size: 0.75rem; /* Smaller font to prevent overflow */
   white-space: nowrap; /* Prevent text wrapping */
   color: ${e=>e.theme.timeColor}; /* Use theme color instead of inheriting */
-`,Hd=({renderTick:e})=>{const{samplesPerPixel:t,sampleRate:n,duration:r,timeScaleHeight:s}=p.useContext(zr),a=pv(),o=p.useMemo(()=>{const i=Gf(r/1e3,t,n);if(a){const{bpm:y,timeSignature:g,ticksPerBar:b,ticksPerBeat:w}=a,_=new Map,x=[],C=r/1e3,k=Math.ceil(C*y*Zn/60),I=mr(w,y,n)/t,E=mr(b,y,n)/t,T=10,R=30;let A;if(I>=T)A=w;else if(E>=T)A=b;else{const $=Math.ceil(T/E);A=b*$}let M;if(I>=R)M=w;else if(E>=R)M=b;else{const $=Math.ceil(R/E);M=b*$}for(let $=0;$<=k;$+=A){const F=mr($,y,n),L=Hf(F,t);if(L>=i)break;const z=$%b===0,q=$%M===0,Y=z?s:Math.floor(q?s/2:s/5);if(_.set(L,Y),q){const ne=Uf($,g),G=e?S.jsx(p.Fragment,{children:e(ne,L)},`bb-${$}`):S.jsx("div",{style:{position:"absolute",left:`${L+4}px`,fontSize:"0.75rem",whiteSpace:"nowrap"},children:ne},`bb-${$}`);x.push({pix:L,element:G})}}return{widthX:i,canvasInfo:_,timeMarkersWithPositions:x}}const l=Rv(t),{marker:c,bigStep:u,smallStep:f}=l,m=new Map,d=[],h=n/t;let v=0;for(let y=0;y<i;y+=h*f/1e3){const g=Math.floor(y);if(v%c===0){const b=Dv(v),w=e?S.jsx(p.Fragment,{children:e(b,g)},`timestamp-${v}`):S.jsx(Pv,{$left:g,children:b},b);d.push({pix:g,element:w}),m.set(g,s)}else v%u===0?m.set(g,Math.floor(s/2)):v%f===0&&m.set(g,Math.floor(s/5));v+=f}return{widthX:i,canvasInfo:m,timeMarkersWithPositions:d}},[a,r,t,n,s,e]);return S.jsx($v,{tickData:o})},Fv=P.div`
+`,Hd=({renderTick:e})=>{const{samplesPerPixel:t,sampleRate:n,duration:r,timeScaleHeight:s}=p.useContext(zr),a=pv(),o=p.useMemo(()=>{const i=Gf(r/1e3,t,n);if(a&&a.scaleMode==="beats"){const{bpm:y,timeSignature:g,ticksPerBar:b,ticksPerBeat:w}=a,_=new Map,x=[],C=r/1e3,k=Math.ceil(C*y*Zn/60),I=mr(w,y,n)/t,E=mr(b,y,n)/t,T=10,R=30;let A;if(I>=T)A=w;else if(E>=T)A=b;else{const $=Math.ceil(T/E);A=b*$}let M;if(I>=R)M=w;else if(E>=R)M=b;else{const $=Math.ceil(R/E);M=b*$}for(let $=0;$<=k;$+=A){const F=mr($,y,n),L=Hf(F,t);if(L>=i)break;const z=$%b===0,q=$%M===0,Y=z?s:Math.floor(q?s/2:s/5);if(_.set(L,Y),q){const ne=Uf($,g),G=e?S.jsx(p.Fragment,{children:e(ne,L)},`bb-${$}`):S.jsx("div",{style:{position:"absolute",left:`${L+4}px`,fontSize:"0.75rem",whiteSpace:"nowrap"},children:ne},`bb-${$}`);x.push({pix:L,element:G})}}return{widthX:i,canvasInfo:_,timeMarkersWithPositions:x}}const l=Rv(t),{marker:c,bigStep:u,smallStep:f}=l,m=new Map,d=[],h=n/t;let v=0;for(let y=0;y<i;y+=h*f/1e3){const g=Math.floor(y);if(v%c===0){const b=Dv(v),w=e?S.jsx(p.Fragment,{children:e(b,g)},`timestamp-${v}`):S.jsx(Pv,{$left:g,children:b},b);d.push({pix:g,element:w}),m.set(g,s)}else v%u===0?m.set(g,Math.floor(s/2)):v%f===0&&m.set(g,Math.floor(s/5));v+=f}return{widthX:i,canvasInfo:m,timeMarkersWithPositions:d}},[a,r,t,n,s,e]);return S.jsx($v,{tickData:o})},Fv=P.div`
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;