1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[28842],{68368:(e,t,r)=>{r.d(t,{g:()=>n});var s=r(12115);function n(e){let{bpm:t,beatsPerMeasure:r=4,enabled:n,onBeat:a,backbeatOnly:l=!1}=e,[i,o]=(0,s.useState)(!1),[d,c]=(0,s.useState)(0),u=(0,s.useRef)(null),h=(0,s.useRef)(0),m=(0,s.useRef)(null),x=(0,s.useRef)(0);(0,s.useEffect)(()=>(u.current=new(window.AudioContext||window.webkitAudioContext),()=>{u.current&&u.current.close()}),[]);let b=(0,s.useCallback)(function(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(!u.current)return;let r=u.current,s=r.createOscillator(),n=r.createGain();s.connect(n),n.connect(r.destination),s.frequency.value=t?1200:800,s.type="sine",n.gain.setValueAtTime(0,e),n.gain.linearRampToValueAtTime(t?.3:.15,e+.005),n.gain.exponentialRampToValueAtTime(.001,e+.08),s.start(e),s.stop(e+.1)},[]),p=(0,s.useCallback)(()=>{if(!u.current||!i)return;let e=u.current.currentTime;for(;h.current<e+.1;){let s=h.current,n=x.current,i=(n-1)%r+1,o=2===i||4===i,d=1===i;(!l||o)&&b(s,d&&!l),a&&setTimeout(()=>{a(n),c(n)},Math.max(0,(s-e-.02)*1e3));let u=60/t;h.current+=u,x.current+=1}},[t,r,i,b,a,l]),f=(0,s.useCallback)(()=>{u.current&&!i&&("suspended"===u.current.state&&u.current.resume(),x.current=1,h.current=u.current.currentTime,o(!0))},[i]),v=(0,s.useCallback)(()=>{o(!1),m.current&&(clearInterval(m.current),m.current=null),x.current=1,c(0)},[]);return(0,s.useEffect)(()=>(i&&n?(p(),m.current=window.setInterval(p,25)):m.current&&(clearInterval(m.current),m.current=null),()=>{m.current&&clearInterval(m.current)}),[i,n,p]),(0,s.useEffect)(()=>{!n&&i&&v()},[n,i,v]),{isPlaying:i,start:f,stop:v,currentBeat:d}}},51569:(e,t,r)=>{r.d(t,{B:()=>n});var s=r(12115);let n=e=>{let{onSpacebar:t,disabled:r=!1}=e,n=(0,s.useCallback)(e=>{r||"Space"!==e.code||(e.preventDefault(),t())},[t,r]);(0,s.useEffect)(()=>(window.addEventListener("keydown",n),()=>window.removeEventListener("keydown",n)),[n])}},3115:(e,t,r)=>{r.d(t,{Z:()=>n});var s=r(12115);let n=e=>{let[t,r]=(0,s.useState)(null),[n,a]=(0,s.useState)([]),[l,i]=(0,s.useState)(null),[o,d]=(0,s.useState)(null),c=(0,s.useCallback)(t=>{let r=t.data,s=r[0],n=r[1],a=r[2];e&&((240&s)==144&&a>0?e(n,!0):((240&s)==128||(240&s)==144&&0===a)&&e(n,!1))},[e]);return(0,s.useEffect)(()=>{if(!navigator.requestMIDIAccess){d("WebMIDI is not supported in this browser");return}let e=!0;return navigator.requestMIDIAccess().then(t=>{if(!e)return;r(t);let s=Array.from(t.inputs.values());a(s),s.length>0&&i(s[0]),t.onstatechange=()=>{let e=Array.from(t.inputs.values());a(e),i(t=>t&&e.find(e=>e.id===t.id)?t:e.length>0?e[0]:null)}}).catch(t=>{e&&d("Failed to access MIDI devices: ".concat(t.message))}),()=>{e=!1,t&&(t.onstatechange=null)}},[]),(0,s.useEffect)(()=>(n.forEach(e=>{e.onmidimessage=null}),l&&(l.onmidimessage=c),()=>{l&&(l.onmidimessage=null)}),[l,c]),{midiInputs:n,selectedInput:l,setSelectedInput:i,error:o}}},79469:(e,t,r)=>{r.d(t,{u:()=>a});var s=r(95155),n=r(21567);function a(e){let{className:t,...r}=e;return(0,s.jsx)("kbd",{"data-slot":"kbd",className:(0,n.cn)("bg-muted text-muted-foreground pointer-events-none inline-flex h-5 w-fit min-w-5 select-none items-center justify-center gap-1 rounded-sm px-1 font-sans text-xs font-medium","[&_svg:not([class*='size-'])]:size-3","[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10",t),...r})}},28842:(e,t,r)=>{r.r(t),r.d(t,{default:()=>L});var s=r(95155),n=r(12115),a=r(25683),l=r(2178),i=r(43226),o=r(11536),d=r(89227),c=r(46482);class u{async waitForLoad(){var e;await (null===(e=d.JD.waitForLoad)||void 0===e?void 0:e.call(d.JD)),this.isLoaded=!0}cleanup(){d.JD.stopAllSounds()}normalizeNote(e){let t={Cb:"B",Db:"C#",Eb:"D#",Fb:"E",Gb:"F#",Ab:"G#",Bb:"A#"},r=e.match(/([A-G])bb(\d+)/);if(r){let[e,t,s]=r,n={C:"A#",D:"C",E:"D",F:"D#",G:"F",A:"G",B:"A"};if(n[t]){let e="C"===t?parseInt(s)-1:parseInt(s);return"".concat(n[t]).concat(e)}}let s=e.match(/([A-G]b)(\d+)/);if(s){let[e,r,n]=s;if(t[r]){let e="Cb"===r?parseInt(n)-1:parseInt(n);return"".concat(t[r]).concat(e)}}let n=e.match(/([A-G])(##|x)(\d+)/);if(n){let[e,t,,r]=n,s={C:"D",D:"E",E:"F#",F:"G",G:"A",A:"B",B:"C#"};if(s[t]){let e="B"===t?parseInt(r)+1:parseInt(r);return"".concat(s[t]).concat(e)}}return e}playNote(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:.5,r=arguments.length>2&&void 0!==arguments[2]&&arguments[2],s=arguments.length>3&&void 0!==arguments[3]&&arguments[3],n=this.normalizeNote(e),a=t*(s?c.o.getUserVolume():c.o.getExerciseVolume());r&&(a=Math.min(a,.5)),d.JD.playNote(n,a)}playChord(e,t){this.playNote(e,.45,!0),this.playNote(t,.55,!0)}stopAllSounds(){d.JD.stopAllSounds()}fadeOutNote(e,t){}fadeOutAll(e){}scheduleChordFadeOut(e,t,r,s){return()=>{}}constructor(){this.isLoaded=!1}}let h=new u;var m=r(79469);let x={C:0,"C#":1,D:2,"D#":3,E:4,F:5,"F#":6,G:7,"G#":8,A:9,"A#":10,B:11}
1,b=Object.fromEntries(Object.entries(x).map(e=>{let[t,r]=e;return[r,t]})),p=e=>{let t=Math.floor(e/12)-1,r=b[e%12]||"";return"".concat(r).concat(t)},f={0:"A",2:"S",4:"D",5:"F",7:"G",9:"H",11:"J",12:"K",14:"L"},v={1:"W",3:"E",6:"T",8:"Y",10:"U"},g=e=>{let{firstNote:t="C3",lastNote:r="C5",onPlayNote:a,disabled:l=!1,highlightedNotes:i=[],showKeyboardShortcuts:o=!1,keyboardOctave:d=4}=e,[c,u]=(0,n.useState)(new Set),h=(0,n.useCallback)(e=>{let t=e.match(/^([A-G]#?)(\d)$/);if(!t)throw Error("Invalid note format: ".concat(e));return{noteName:t[1],octave:parseInt(t[2])}},[]),b=h(t),g=h(r),y=(b.octave+1)*12+x[b.noteName],j=(g.octave+1)*12+x[g.noteName],w=(d+1)*12,N=n.useRef(!1),C=(0,n.useCallback)(function(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];(t||!N.current)&&!l&&a&&(u(t=>new Set(t).add(e)),a(e),setTimeout(()=>{u(t=>{let r=new Set(t);return r.delete(e),r})},200))},[l,a]),k=(0,n.useCallback)((e,t)=>{t.preventDefault(),N.current=!0,C(e,!0),setTimeout(()=>{N.current=!1},300)},[C]),S=e=>[1,3,6,8,10].includes(e%12),E=e=>({1:.7,3:1.7,6:3.75,8:4.75,10:5.75})[e%12]||0,A=(e,t)=>{if(!o)return null;let r=e-w;return r<0||r>14?null:t?v[r]||null:f[r]||null},M=[],G=[];for(let e=y;e<=j;e++)S(e)?G.push(e):M.push(e);let F=e=>i.includes(e);return(0,s.jsx)("div",{className:"relative w-full h-40 sm:h-48 md:h-56",role:"group","aria-label":"Piano keyboard",children:(0,s.jsxs)("div",{className:"relative w-full h-full flex rounded-xl overflow-hidden",children:[M.map(e=>{let t=Math.floor(e/12)-1,r=e%12,n=c.has(e),a=F(e),i=A(e,!1);return(0,s.jsxs)("button",{onMouseDown:()=>C(e),onTouchStart:t=>k(e,t),onTouchEnd:e=>e.stopPropagation(),onClick:e=>e.stopPropagation(),disabled:l,"aria-label":"".concat(p(e)).concat(a?", highlighted":""),"aria-pressed":n,className:"\n relative flex-1 mx-[1px] rounded-b-xl\n transition-all duration-100 ease-out\n border-r border-l border-b-4\n ".concat(a?"bg-gradient-to-b from-blue-100 via-blue-200 to-blue-300 dark:from-blue-200 dark:via-blue-300 dark:to-blue-400 border-action":"bg-gradient-to-b from-white via-gray-50 to-gray-100 dark:from-slate-50 dark:via-slate-100 dark:to-slate-200 border-gray-300 dark:border-slate-400","\n shadow-[0_4px_0_rgba(0,0,0,0.1)]\n ").concat(l?"cursor-not-allowed opacity-90":n?"brightness-90 shadow-[inset_0_4px_8px_rgba(0,0,0,0.2)] translate-y-[2px] border-b-2":"hover:brightness-95 active:brightness-90 active:shadow-[inset_0_4px_8px_rgba(0,0,0,0.2)] active:translate-y-[2px] active:border-b-2","\n "),children:[i&&(0,s.jsx)("div",{className:"absolute bottom-[32px] left-1/2 -translate-x-1/2",children:(0,s.jsx)(m.u,{className:"text-[10px] h-4 min-w-4 px-1 bg-slate-200/80 dark:bg-slate-300/80 text-slate-600 dark:text-slate-700",children:i})}),0===r&&(0,s.jsx)("div",{className:"absolute bottom-1 sm:bottom-2 left-1/2 -translate-x-1/2",children:(0,s.jsxs)("span",{className:"text-[8px] sm:text-[10px] font-mono text-slate-400 dark:text-slate-500 font-bold",children:["C",t]})})]},e)}),(0,s.jsx)("div",{className:"absolute inset-0 flex pointer-events-none px-[1px]",children:G.map(e=>{let t=c.has(e),r=F(e),n=Math.floor(e/12)-b.octave-1,a=E(e),i=100/M.length,o=A(e,!0);return(0,s.jsx)("button",{onMouseDown:()=>C(e),onTouchStart:t=>k(e,t),onTouchEnd:e=>e.stopPropagation(),onClick:e=>e.stopPropagation(),disabled:l,"aria-label":"".concat(p(e)).concat(r?", highlighted":""),"aria-pressed":t,className:"\n absolute top-0 h-[62%] rounded-b-xl\n pointer-events-auto transition-all duration-100\n border border-b-4\n ".concat(r?"bg-gradient-to-b from-blue-500 via-blue-600 to-blue-800 border-blue-900":"bg-gradient-to-b from-slate-700 via-slate-800 to-black dark:from-slate-800 dark:via-slate-900 dark:to-black border-black","\n shadow-[0_4px_0_rgba(0,0,0,0.5),0_6px_12px_rgba(0,0,0,0.3)]\n ").concat(l?"cursor-not-allowed opacity-90":t?"brightness-125 shadow-[inset_0_4px_8px_rgba(0,0,0,0.7)] translate-y-[2px] border-b-2":"hover:brightness-110 active:brightness-125 active:shadow-[inset_0_4px_8px_rgba(0,0,0,0.7)] active:translate-y-[2px] active:border-b-2","\n "),style:{left:"".concat((7*n+a)*i,"%"),width:"".concat(.6*i,"%"),zIndex:10},children:o&&(0,s.jsx)("div",{className:"absolute bottom-[5px] left-1/2 -translate-x-1/2",children:(0,s.jsx)(m.u,{className:"text-[9px] h-3.5 min-w-3.5 px-0.5 bg-slate-500/80 text-slate-200",children:o})})},e)})})]})})};var y=r(3115),j=r(51569),w=r(81798);let N={C:{maj7:{third:"E",seventh:"B"},min7:{third:"Eb",seventh:"Bb"},7:{third:"E",seventh:"Bb"},m7b5:{third:"Eb",seventh:"Bb"},dim7:{third:"Eb",seventh:"A"},minMaj7:{third:"Eb",seventh:"B"},augMaj7:{third:"E",seventh:"B"},"7sus4":{third:"F",seventh:"Bb"},sus4:{third:"F",seventh:"C"},5:{third:"E",seventh:"C"},maj:{third:"E",seventh:"C"},min:{third:"Eb",seventh:"C"}},D:{maj7:{third:"F#",seventh:"C#"},min7:{third:"F",seventh:"C"},7:{third:"F#",seventh:"C"},m7b5:{third:"F",seventh:"C"},dim7:{third:"F",seventh:"B"},minMaj7:{third:"F",seventh:"C#"},augMaj7:{third:"F#",seventh:"C#"},"7sus4":{third:"G",seventh:"C"},sus4:{third:"G",seventh:"D"},5:{third:"F#",seventh:"D"},maj:{third:"F#",seventh:"D"},min:{third:"F",seventh:"D"}},E:{maj7:{third:"G#",seventh:"D#"},min7:{third:"G",seventh:"D"},7:{third:"G#",seventh:"D"},m7b5:{third:"G",seventh:"D"},dim7:{third:"G",seventh:"C#"},minMaj7:{third:"G",seventh:"D#"},augMaj7:{third:"G#",seventh:"D#"},"7sus4":{third:"A",seventh:"D"},sus4:{third:"A",seventh:"E"},5:{third:"G#",seventh:"E"},maj:{third:"G#",seventh:"E"},min:{third:"G",seventh:"E"}},F:{maj7:{third:"A",seventh:"E"},min7:{third:"Ab",seventh:"Eb"},7:{third:"A",seventh:"Eb"},m7b5:{third:"Ab",seventh:"Eb"},dim7:{third:"Ab",seventh:"D"},minMaj7:{third:"Ab",seventh:"E"},augMaj7:{third:"A",seventh:"E"},"7sus4":{third:"Bb",seventh:"Eb"},sus4:{third:"Bb",seventh:"F"},5:{third:"A",seventh:"F"},maj:{third:"A",seventh:"F"},min:{third:"Ab",seventh:"F"}},G:{maj7:{third:"B",seventh:"F#"},min7:{third:"Bb",seventh:"F"},7:{third:"B",seventh:"F"},m7b5:{third:"Bb",seventh:"F"},dim7:{third:"Bb",seventh:"E"},minMaj7:{third:"Bb",seventh:"F#"},augMaj7:{third:"B",seventh:"F#"},"7sus4":{third:"C",seventh:"F"},sus4:{third:"C",seventh:"G"},5:{third:"B",seventh:"G"},maj:{third:"B",seventh:"G"},min:{third:"Bb",seventh:"G"}},A:{maj7:{third:"C#",seventh:"G#"},min7:{third:"C",seventh:"G"},7:{third:"C#",seventh:"G"},m7b5:{third:"C",seventh:"G"},dim7:{third:"C",seventh:"Gb"},minMaj7:{third:"C",seventh:"G#"},augMaj7:{third:"C#",seventh:"G#"},"7sus4":{third:"D",seventh:"G"},sus4:{third:"D",seventh:"A"},5:{third:"C#",seventh:"A"},maj:{third:"C#",seventh:"A"},min:{third:"C",seventh:"A"}},B:{maj7:{third:"D#",seventh:"A#"},min7:{third:"D",seventh:"A"},7:{third:"D#",seventh:"A"},m7b5:{third:"D",seventh:"A"},dim7:{third:"D",seventh:"Ab"},minMaj7:{third:"D",seventh:"A#"},augMaj7:{third:"D#",seventh:"A#"},"7sus4":{third:"E",seventh:"A"},sus4:{third:"E",seventh:"B"},5:{third:"D#",seventh:"B"},maj:{third:"D#",seventh:"B"},min:{third:"D",seventh:"B"}},"C#":{maj7:{third:"E#",seventh:"B#"},min7:{third:"E",seventh:"B"},7:{third:"E#",seventh:"B"},m7b5:{third:"E",seventh:"B"},dim7:{third:"E",seventh:"A#"},minMaj7:{third:"E",seventh:"B#"},augMaj7:{third:"E#",seventh:"B#"},"7sus4":{third:"F#",seventh:"B"},sus4:{third:"F#",seventh:"C#"},5:{third:"E#",seventh:"C#"},maj:{third:"E#",seventh:"C#"},min:{third:"E",seventh:"C#"}},"D#":{maj7:{third:"F##",seventh:"C##"},min7:{third:"F#",seventh:"C#"},7:{third:"F##",seventh:"C#"},m7b5:{third:"F#",seventh:"C#"},dim7:{third:"F#",seventh:"B#"},minMaj7:{third:"F#",seventh:"C##"},augMaj7:{third:"F##",seventh:"C##"},"7sus4":{third:"G#",seventh:"C#"},sus4:{third:"G#",seventh:"D#"},5:{third:"F##",seventh:"D#"},maj:{third:"F##",seventh:"D#"},min:{third:"F#",seventh:"D#"}},"F#":{maj7:{third:"A#",seventh:"E#"},min7:{third:"A",seventh:"E"},7:{third:"A#",seventh:"E"},m7b5:{third:"A",seventh:"E"},dim7:{third:"A",seventh:"D#"},minMaj7:{third:"A",seventh:"E#"},augMaj7:{third:"A#",seventh:"E#"},"7sus4":{third:"B",seventh:"E"},sus4:{third:"B",seventh:"F#"},5:{third:"A#",seventh:"F#"},maj:{third:"A#",seventh:"F#"},min:{third:"A",seventh:"F#"}},"G#":{maj7:{third:"B#",seventh:"F##"},min7:{third:"B",seventh:"F#"},7:{third:"B#",seventh:"F#"},m7b5:{third:"B",seventh:"F#"},dim7:{third:"B",seventh:"E#"},minMaj7:{third:"B",seventh:"F##"},augMaj7:{third:"B#",seventh:"F##"},"7sus4":{third:"C#",seventh:"F#"},sus4:{third:"C#",seventh:"G#"},5:{third:"B#",seventh:"G#"},maj:{third:"B#",seventh:"G#"},min:{third:"B",seventh:"G#"}},"A#":{maj7:{third:"C##",seventh:"G##"},min7:{third:"C#",seventh:"G#"},7:{third:"C##",seventh:"G#"},m7b5:{third:"C#",seventh:"G#"},dim7:{third:"C#",seventh:"F##"},minMaj7:{third:"C#",seventh:"G##"},augMaj7:{third:"C##",seventh:"G##"},"7sus4":{third:"D#",seventh:"G#"},sus4:{third:"D#",seventh:"A#"},5:{third:"C##",seventh:"A#"},maj:{third:"C##",seventh:"A#"},min:{third:"C#",seventh:"A#"}},Db:{maj7:{third:"F",seventh:"C"},min7:{third:"Fb",seventh:"Cb"},7:{third:"F",seventh:"Cb"},m7b5:{third:"Fb",seventh:"Cb"},dim7:{third:"Fb",seventh:"Bbb"},minMaj7:{third:"Fb",seventh:"C"},augMaj7:{third:"F",seventh:"C"},"7sus4":{third:"Gb",seventh:"Cb"},sus4:{third:"Gb",seventh:"Db"},5:{third:"F",seventh:"Db"},maj:{third:"F",seventh:"Db"},min:{third:"Fb",seventh:"Db"}},Eb:{maj7:{third:"G",seventh:"D"},min7:{third:"Gb",seventh:"Db"},7:{third:"G",seventh:"Db"},m7b5:{third:"Gb",seventh:"Db"},dim7:{third:"Gb",seventh:"C"},minMaj7:{third:"Gb",seventh:"D"},augMaj7:{third:"G",seventh:"D"},"7sus4":{third:"Ab",seventh:"Db"},sus4:{third:"Ab",seventh:"Eb"},5:{third:"G",seventh:"Eb"},maj:{third:"G",seventh:"Eb"},min:{third:"Gb",seventh:"Eb"}}
1,Gb:{maj7:{third:"Bb",seventh:"F"},min7:{third:"Bbb",seventh:"Fb"},7:{third:"Bb",seventh:"Fb"},m7b5:{third:"Bbb",seventh:"Fb"},dim7:{third:"Bbb",seventh:"Ebb"},minMaj7:{third:"Bbb",seventh:"F"},augMaj7:{third:"Bb",seventh:"F"},"7sus4":{third:"Cb",seventh:"Fb"},sus4:{third:"Cb",seventh:"Gb"},5:{third:"Bb",seventh:"Gb"},maj:{third:"Bb",seventh:"Gb"},min:{third:"Bbb",seventh:"Gb"}},Ab:{maj7:{third:"C",seventh:"G"},min7:{third:"Cb",seventh:"Gb"},7:{third:"C",seventh:"Gb"},m7b5:{third:"Cb",seventh:"Gb"},dim7:{third:"Cb",seventh:"F"},minMaj7:{third:"Cb",seventh:"G"},augMaj7:{third:"C",seventh:"G"},"7sus4":{third:"Db",seventh:"Gb"},sus4:{third:"Db",seventh:"Ab"},5:{third:"C",seventh:"Ab"},maj:{third:"C",seventh:"Ab"},min:{third:"Cb",seventh:"Ab"}},Bb:{maj7:{third:"D",seventh:"A"},min7:{third:"Db",seventh:"Ab"},7:{third:"D",seventh:"Ab"},m7b5:{third:"Db",seventh:"Ab"},dim7:{third:"Db",seventh:"G"},minMaj7:{third:"Db",seventh:"A"},augMaj7:{third:"D",seventh:"A"},"7sus4":{third:"Eb",seventh:"Ab"},sus4:{third:"Eb",seventh:"Bb"},5:{third:"D",seventh:"Bb"},maj:{third:"D",seventh:"Bb"},min:{third:"Db",seventh:"Bb"}}},C={"E#":"F","B#":"C","F##":"G","C##":"D","G##":"A","D##":"E","A##":"B",Bbb:"A",Ebb:"D",Abb:"G",Dbb:"C",Gbb:"F"},k=[2,3,4,5],S={direction:"closest",maxInterval:7,startingOctave:4,preferCommonTone:!0};function E(e){if(!e)return"";let t=parseInt(e,10);return 1===t?"#":-1===t?"b":2===t?"##":-2===t?"bb":""}function A(){return{steps:[{id:"step-1",chordSymbol:"Cmaj7",root:"C",chordType:"maj7",third:"E4",seventh:"B4",bass:"C2",displayedNote:"E4",displayedRole:"third",expectedNote:"B4",expectedRole:"seventh",duration:"whole",durationMs:4e3,measureNumber:1,beatPosition:1},{id:"step-2",chordSymbol:"Dm7",root:"D",chordType:"min7",third:"F4",seventh:"C5",bass:"D2",displayedNote:"C5",displayedRole:"seventh",expectedNote:"F4",expectedRole:"third",duration:"whole",durationMs:4e3,measureNumber:2,beatPosition:1},{id:"step-3",chordSymbol:"G7",root:"G",chordType:"7",third:"B4",seventh:"F5",bass:"G2",displayedNote:"B4",displayedRole:"third",expectedNote:"F5",expectedRole:"seventh",duration:"whole",durationMs:4e3,measureNumber:3,beatPosition:1},{id:"step-4",chordSymbol:"Cmaj7",root:"C",chordType:"maj7",third:"E4",seventh:"B4",bass:"C2",displayedNote:"E4",displayedRole:"third",expectedNote:"B4",expectedRole:"seventh",duration:"whole",durationMs:4e3,measureNumber:4,beatPosition:1}],timeSignature:{beats:4,beatType:4},keySignature:"C",title:"Guide Tones Exercise",tempo:60}}var M=r(19966),G=r(83668),F=r(56114);function D(e,t){let r=e.match(/^([A-G])(#{1,2}|b{1,2})?(\d)$/);if(!r)return console.error("Invalid note format:",e),{key:"c/4",accidental:null};let[,s,n,a]=r,l=n||null,i=null;if(t){let e=t.get(s);l!==e?(null===l&&null!=e?i="n":null!==l&&(i=l),t.set(s,l)):null!==l&&void 0===e&&(i=l,t.set(s,l))}else i=l;return{key:"".concat(s.toLowerCase(),"/").concat(a),accidental:i}}function B(e){let t=e.match(/^([A-G])(#{1,2}|b{1,2})?(\d)$/);if(!t)return 60;let[,r,s,n]=t,a={C:0,D:2,E:4,F:5,G:7,A:9,B:11}[r]+(parseInt(n)+1)*12;return s&&(s.includes("#")&&(a+=s.length),s.includes("b")&&(a-=s.length)),a}let _=e=>{let{steps:t,currentStepIndex:r,completedMeasures:a,measuresPerLine:l=4,isPerformancePlaying:i=!1,currentBeat:o=0,tempo:d=60,beatsPerMeasure:c=4}=e,u=(0,n.useRef)(null),h=(0,n.useRef)(null),m=(0,n.useRef)([]),x=(0,n.useRef)(-1),b=(0,n.useCallback)(e=>{let t=u.current,r=null==t?void 0:t.parentElement;if(!t||!r||r.scrollHeight<=r.clientHeight)return;let s=window.getComputedStyle(t),n=parseFloat(s.paddingTop||"0"),a=parseFloat(s.paddingBottom||"0"),l=Math.max(8,Math.min(16,.15*r.clientHeight)),i=n+e.topY-6,o=n+e.bottomY+a+12,d=r.scrollTop,c=d+r.clientHeight;i<d+l?r.scrollTo({top:Math.max(0,i-l),behavior:"smooth"}):o>c-l&&r.scrollTo({top:Math.max(0,o-r.clientHeight+l),behavior:"smooth"})},[]),p=(0,n.useMemo)(()=>{let e=new Map;return t.forEach((t,r)=>{let s=t.measureNumber;e.has(s)||e.set(s,{measureNumber:s,steps:[]}),e.get(s).steps.push({step:t,stepIndex:r})}),Array.from(e.values()).sort((e,t)=>e.measureNumber-t.measureNumber)},[t]);return(0,n.useEffect)(()=>{var e;if(!u.current||0===t.length||0===p.length)return;let s=u.current,n=s.parentElement,i=null!==(e=null==n?void 0:n.scrollTop)&&void 0!==e?e:0;s.innerHTML="",m.current=[];let o=Math.min(800,window.innerWidth-40),d=Math.floor((o-60)/l),h=d+50,x=p.length,b=Math.ceil(x/l),f=[];for(let e=0;e<b;e++){let t=e*l,r=Math.min(t+l,x),s=[];for(let e=t;e<r;
1e++)p[e].steps.forEach(e=>{let{step:t,stepIndex:r}=e;s.push(t.displayedNote);let n=a.find(e=>e.measureIndex===r);n&&s.push(n.playedNote)});f.push(function(e){if(0===e.length)return"treble";let t=0,r=0;return(e.forEach(e=>{let s=B(e);s>0&&(t+=s,r++)}),0===r)?"treble":t/r<60?"bass":"treble"}(s))}let v=new F.default.Renderer(s,F.default.Renderer.Backends.SVG);v.resize(o,140*b+60);let g=v.getContext();for(let e=0;e<b;e++){let t=e*l,s=Math.min(t+l,x),n=10,i=40+140*e,o=f[e];for(let l=t;l<s;l++){let u;let b=l===t,f=l===s-1,v=p[l].steps,y=v.length;v.some(e=>e.stepIndex===r);let j=b?h:d,w=new F.default.Stave(n,i,j);b&&(w.addClef(o),0===e&&0===l&&w.addTimeSignature("".concat(c,"/4"))),l===x-1&&w.setEndBarType(F.default.Barline.type.END),w.setContext(g).draw();let N=w.getYForLine(0),C=w.getYForLine(4);if(m.current[l]={x:n,width:j,y:i,lineIndex:e,topY:N,bottomY:C},f&&l!==x-1){let e=n+j,t=w.getYForLine(0),r=w.getYForLine(4);g.beginPath(),g.moveTo(e,t),g.lineTo(e,r),g.setStrokeStyle("#000000"),g.setLineWidth(1),g.stroke()}u=3===c?1===y?"hd":"q":1===y?"w":2===y?"h":"q";let k=new Map,S=[];if(v.forEach(e=>{let{step:t,stepIndex:s}=e,n=a.find(e=>e.measureIndex===s),l=s===r;if(n&&n){let e,r,s;let a=D(t.displayedNote,k),l=D(n.playedNote,k),i=B(t.displayedNote),d=B(n.playedNote);i<=d?(e=[a.key,l.key],r=[a.accidental,l.accidental],s={displayed:0,played:1}):(e=[l.key,a.key],r=[l.accidental,a.accidental],s={displayed:1,played:0}),i===d&&(e=[a.key],r=[a.accidental],s={displayed:0,played:0});let c=new F.default.StaveNote({clef:o,keys:e,duration:u});r.forEach((e,t)=>{e&&c.addModifier(new F.default.Accidental(e),t)}),n.isCorrect?c.setStyle({fillStyle:"#22c55e",strokeStyle:"#22c55e"}):e.length>1?(c.setKeyStyle(s.displayed,{fillStyle:"#6b7280",strokeStyle:"#6b7280"}),c.setKeyStyle(s.played,{fillStyle:"#ef4444",strokeStyle:"#ef4444"})):c.setStyle({fillStyle:"#ef4444",strokeStyle:"#ef4444"}),S.push(c)}else if(l){let e=D(t.displayedNote,k),r=new F.default.StaveNote({clef:o,keys:[e.key],duration:u});e.accidental&&r.addModifier(new F.default.Accidental(e.accidental)),r.setStyle({fillStyle:"#3b82f6",strokeStyle:"#3b82f6"}),S.push(r)}else{let e=new F.default.StaveNote({clef:o,keys:["bass"===o?"d/3":"b/4"],duration:u+"r"});e.setStyle({fillStyle:"#d1d5db",strokeStyle:"#d1d5db"}),S.push(e)}}),S.length>0){let e=new F.default.Voice({num_beats:c,beat_value:4}).setStrict(!1);e.addTickables(S),new F.default.Formatter().joinVoices([e]).format([e],j-(b?80:30)),e.draw(g,w)}n+=j}}let y=s.querySelector("svg");if(y)for(let e=0;e<b;e++){let t=e*l,s=Math.min(t+l,x),n=10,a=40+140*e;for(let e=t;e<s;e++){let s=e===t,l=p[e].steps,i=l.length,o=s?h:d,c=n+(s?60:10),u=o-(s?70:20);l.forEach((e,t)=>{let{step:s,stepIndex:n}=e,l=n===r,o=c+t/i*u+10,d=a+15,h=document.createElementNS("http://www.w3.org/2000/svg","text");h.setAttribute("x",String(o)),h.setAttribute("y",String(d)),h.setAttribute("font-size",l?"22":"18"),h.setAttribute("font-weight","normal"),h.setAttribute("font-family","'Petaluma Script', 'Times New Roman', serif"),h.setAttribute("fill","#1f2937"),h.textContent=s.chordSymbol,y.appendChild(h)}),n+=o}}n&&(n.scrollTop=i)},[t,r,a,l,p]),(0,n.useEffect)(()=>{if(u.current){if(i&&!h.current){let e=document.createElement("div");e.style.position="absolute",e.style.width="3px",e.style.backgroundColor="#3b82f6",e.style.borderRadius="2px",e.style.zIndex="10",e.style.pointerEvents="none",e.style.opacity="1",u.current.style.position="relative",u.current.appendChild(e),h.current=e,x.current=-1}else!i&&h.current&&(h.current.remove(),h.current=null,x.current=-1)}},[i]),(0,n.useEffect)(()=>{if(!h.current||!u.current||!i)return;let e=h.current;u.current;let t=2*c;if(0===o){e.style.opacity="0";return}if(e.style.opacity="1",o<=t){let t=m.current[0];if(t){let r=t.x+60;e.style.left="".concat(r,"px"),e.style.top="".concat(t.y+10,"px"),e.style.height="40px"}}else{let r=Math.floor((o-t-1)/c),s=(o-t-1)%c,n=m.current[r];if(n){let t=r%l==0,a=n.x+(t?60:10)+s/c*(n.width-(t?70:20));e.style.left="".concat(a,"px"),e.style.top="".concat(n.y+10,"px"),e.style.height="40px";let i=n.lineIndex;i!==x.current&&(x.current=i,b(n))}}},[o,i,l,c,b]),(0,n.useEffect)(()=>
1{if(!u.current||i)return;let e=-1;for(let t=0;t<p.length;t++)if(p[t].steps.some(e=>e.stepIndex===r)){e=t;break}if(-1===e)return;let t=m.current[e];t&&b(t)},[r,i,p,b]),(0,s.jsx)("div",{ref:u,className:"w-full bg-white rounded-xl p-4",style:{backgroundColor:"white"}})};var T=r(68368);let I=e=>{let{isMobile:t,currentStepIndex:r,steps:n,completedMeasures:a,isPerformancePlaying:l,metronomeCurrentBeat:i,performanceTempo:o,beatsPerMeasure:d}=e;return(0,s.jsx)("div",{className:"bg-white rounded-xl sm:rounded-2xl border border-black/10 overflow-x-hidden overflow-y-auto mx-2 sm:mx-0 scrollbar-thin",style:{maxHeight:t?"150px":"320px"},children:(0,s.jsx)(_,{steps:n,currentStepIndex:r,completedMeasures:a,measuresPerLine:t?2:4,isPerformancePlaying:l,currentBeat:i,tempo:o,beatsPerMeasure:d})})},L=e=>{let{xmlInput:t,exerciseId:r,tempo:d=60,onStepChange:c,onValidation:u,onComplete:m,initialStep:x=0,allowMouseInput:b=!0,previewMode:p=!1,embedded:f=!1}=e,[v,F]=(0,n.useState)(!1),[D,B]=(0,n.useState)("visual"),[_,L]=(0,n.useState)("step"),[P,R]=(0,n.useState)(d),[q,z]=(0,n.useState)(String(d)),[O,$]=(0,n.useState)(!1),H=(0,n.useRef)(!1),[V,J]=(0,n.use
1State)(!0),[W,X]=(0,n.useState)(!1),[Y,Z]=(0,n.useState)(!0),[K,U]=(0,n.useState)(0),[Q,ee]=(0,n.useState)([]),[et,er]=(0,n.useState)(4);(0,n.useEffect)(()=>{let e=()=>{F(window.innerWidth<768||"ontouchstart"in window)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]),(0,n.useEffect)(()=>{if(!f)return window.innerWidth<640&&(document.body.style.overflow="hidden",document.documentElement.style.overflow="hidden"),()=>{document.body.style.overflow="",document.documentElement.style.overflow=""}},[f]);let[es,en]=(0,n.useState)([]),[ea,el]=(0,n.useState)(x),[ei]=(0,n.useState)(d),[eo,ed]=(0,n.useState)(!1),[ec,eu]=(0,n.useState)(4),[eh,em]=(0,n.useState)(!1),[ex,eb]=(0,n.useState)(!1),[ep,ef]=(0,n.useState)(null),ev=(0,n.useRef)(new Set),eg=(0,n.useRef)(null),ey=(0,n.useRef)(0),[ej,ew]=(0,n.useState)(0),[eN,eC]=(0,n.useState)(0),[ek,eS]=(0,n.useState)(!1),[eE,eA]=(0,n.useState)(!1);(0,n.useEffect)(()=>((async()=>{try{await h.waitForLoad(),ed(!0)}catch(e){console.error("Error initializing audio:",e)}})(),()=>{h.cleanup(),eg.current&&clearTimeout(eg.current)}),[]),(0,n.useEffect)(()=>{if(t)try{let e=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:60;if("undefined"==typeof DOMParser)return console.warn("DOMParser not available, returning empty result"),A();if(!e||"string"!=typeof e)return console.error("Invalid XML content"),A();try{let r=new DOMParser().parseFromString(e,"text/xml"),s=r.querySelector("parsererror");if(s)return console.error("XML parse error:",s.textContent),A();let n=function(e){let t=e.querySelector("attributes > time");if(t){var r,s;let e=null===(r=t.querySelector("beats"))||void 0===r?void 0:r.textContent,n=null===(s=t.querySelector("beat-type"))||void 0===s?void 0:s.textContent;if(e&&n)return{beats:parseInt(e,10),beatType:parseInt(n,10)}}return{beats:4,beatType:4}}(r),a=function(e){let t=e.querySelector("attributes > key");if(t){var r,s;let e;let n=parseInt((null===(r=t.querySelector("fifths"))||void 0===r?void 0:r.textContent)||"0",10),a=(null===(s=t.querySelector("mode"))||void 0===s?void 0:s.textContent)||"major";return e=n>=0?"minor"===a?["A","E","B","F#","C#","G#","D#","A#"][n]:["C","G","D","A","E","B","F#","C#"][n]:"minor"===a?["A","D","G","C","F","Bb","Eb","Ab"][-n]:["C","F","Bb","Eb","Ab","Db","Gb","Cb"][-n],"minor"===a?"".concat(e,"m"):e}return"C"}(r),l=function(e){var t,r,s;let n=null===(t=e.querySelector("work > work-title"))||void 0===t?void 0:t.textContent;return n?n:(null===(r=e.querySelector("movement-title"))||void 0===r?void 0:r.textContent)||(null===(s=e.querySelector("credit > credit-words"))||void 0===s?void 0:s.textContent)||void 0}(r),i=function(e){var t;let r=null===(t=e.querySelector("attributes > divisions"))||void 0===t?void 0:t.textContent;return r?parseInt(r,10):1}(r),o=function(e,t){let r=[];return e.querySelectorAll("measure").forEach((e,s)=>{let n=parseInt(e.getAttribute("number")||"".concat(s+1),10);e.querySelectorAll("harmony").forEach((e,s)=>{let a=function(e){var t,r,s,n;let a;let l=e.querySelector("root");
1if(!l)return null;let i=null===(t=l.querySelector("root-step"))||void 0===t?void 0:t.textContent;if(!i)return null;let o=E(null===(r=l.querySelector("root-alter"))||void 0===r?void 0:r.textContent),d="".concat(i).concat(o),c=e.querySelector("kind"),u=(null==c?void 0:c.textContent)||"major",h=(null==c?void 0:c.getAttribute("text"))||"",m=e.querySelectorAll("degree"),x=[];m.forEach(e=>{var t,r,s;let n=parseInt((null===(t=e.querySelector("degree-value"))||void 0===t?void 0:t.textContent)||"0",10),a=parseInt((null===(r=e.querySelector("degree-alter"))||void 0===r?void 0:r.textContent)||"0",10),l=(null===(s=e.querySelector("degree-type"))||void 0===s?void 0:s.textContent)||"alter";n>0&&x.push({value:n,alter:a,type:l})});let b=e.querySelector("bass");if(b){let e=null===(s=b.querySelector("bass-step"))||void 0===s?void 0:s.textContent,t=null===(n=b.querySelector("bass-alter"))||void 0===n?void 0:n.textContent;e&&(a="".concat(e).concat(E(t)))}return{chordSymbol:function(e,t,r,s,n){let a=s.some(e=>5===e.value&&-1===e.alter);if("minor-seventh"===t&&a){let t="".concat(e,"m7b5");return n&&n!==e&&(t+="/".concat(n)),t}let l=r||({major:"",minor:"m",augmented:"+",diminished:"dim",dominant:"7","major-seventh":"maj7","minor-seventh":"m7","diminished-seventh":"dim7","augmented-seventh":"+7","half-diminished":"m7b5","major-minor":"mMaj7","major-sixth":"6","minor-sixth":"m6","dominant-ninth":"9","major-ninth":"maj9","minor-ninth":"m9","dominant-11th":"11","major-11th":"maj11","minor-11th":"m11","dominant-13th":"13","major-13th":"maj13","minor-13th":"m13","suspended-second":"sus2","suspended-fourth":"sus4",power:"5"})[t]||"";s.forEach(e=>{if("add"===e.type||"alter"===e.type){let t=-1===e.alter?"b":1===e.alter?"#":"";t&&5!==e.value&&(l+="(".concat(t).concat(e.value,")"))}});let i="".concat(e).concat(l);return n&&n!==e&&(i+="/".concat(n)),i}(d,u,h,x,a),root:d,kind:u,bass:a}}(e);if(a){var l;let i=null===(l=e.querySelector("offset"))||void 0===l?void 0:l.textContent,o=i?Math.floor(parseInt(i,10)/t)+1:s+1;r.push({...a,measureNumber:n,beat:o})}})}),r}(r,i);if(0===o.length)return console.warn("No chord symbols found in MusicXML"),A();let d=o.map(e=>({chordSymbol:e.chordSymbol,parsed:function(e){let t=e.trim(),r=t.match(/^([A-G][#b]?)/);if(!r)return null;let s=r[1],n=t.slice(s.length),a=function(e){let t=e.replace(/\s/g,"");return t.match(/^(m7b5|min7b5|-7b5|ø7|ø|Ã7|Ã|m7\(b5\))/i)?"m7b5":t.match(/^(m7|min7|-7|mi7)/i)?"min7":t.match(/^(m|min|-|mi)$/i)?"min":t.match(/^(m|min|-)(maj7|ma7|â³7|Î7)/i)?"minMaj7":t.match(/^(maj7|ma7|â³7|Î7)/i)||t.match(/^M7/)?"maj7":t.match(/^(maj|ma|â³|Î)$/i)||t.match(/^M$/)?"maj":t.match(/^(dim7|°7|o7)/i)?"dim7":t.match(/^(\+maj7|aug.*maj7|augM7)/i)?"augMaj7":t.match(/^(7sus4?|9sus4?|11sus4?|13sus4?)/i)?"7sus4":t.match(/^(sus4|sus)($|\/)/i)?"sus4":t.match(/^(7|9|11|13|7alt|7#9|7b9|7#11|7b13)/i)?"7":t.match(/^5$/)?"5":""===t||t.match(/^(add|6|69)/i)?"maj":t.match(/^\d/)?"7":"maj7"}(n),l=n.match(/\/([A-G][#b]?)$/);return{root:s,chordType:a,bass:l?l[1]:void 0}}(e.chordSymbol)||{root:"C",chordType:"maj7"},measureNumber:e.measureNumber,beatPosition:e.beat,duration:function(e){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1],1===e)?"whole":2===e?"half":"quarter"}(o.filter(t=>t.measureNumber===e.measureNumber).length,n),durationMs:0}));return d.forEach(e=>{e.durationMs=function(e,t){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{beats:4,beatType:4},s=60/t*1e3,n=r.beatType;switch(e){case"whole":return s*n;case"half":return n/2*s;case"quarter":return n/4*s;default:return s}}(e.duration,t,n)}),{steps:function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:60;return function(e){arguments.length>1&&void 0!==arguments[1]&&arguments[1],arguments.length>2&&void 0!==arguments[2]&&arguments[2];let t=[],r=.5>Math.random(),s=r?51:58,n=r?58:51;for(let r=0;r<e.length;r++){let a=e[r],{root:l,chordType:i,bass:o}=a.parsed,d="sus4"===i||"7sus4"===i,{third:c,seventh:u}=function(e,t,r){let s=N[e];if(!s){console.warn("[Guido] Unknown root: ".concat(e,", falling back to C"));let r=N.C[t];return{third:"".concat(r.third).concat(4),seventh:"".concat(r.seventh).concat(4)}}let n=s[t];if(!n)return console.warn("[Guido] Unknown chord type: ".concat(t," for root ").concat(e)),{third:"E".concat(4),seventh:"B".concat(r)};let a=n.third,l=n.seventh;C[a]&&(a=C[a]),C[l]&&(l=C[l]);let i="".concat(a).concat(r),o="".concat(l).concat(r),d=w.L7.midi(i),c=w.L7.midi(o);if(d&&c&&c<=d){let e=w.L7.get(o);void 0!==e.oct&&(o="".concat(l).concat(e.oct+1))}return{third:i,seventh:o}}(l,i,4),h=c.replace(/\d+$/,""),m=u.replace(/\d+$/,"");if(!h||!m){console.warn("[Guido] Could not get pitch class for ".concat(l," ").concat(i));continue}let x=function(e,t,r,s,n){let a=arguments.length>5&&void 0!==arguments[5]&&arguments[5],l=a?"fourth":"third",i=[],o=[];for(let r of k){let s="".concat(e).concat(r),n=w.L7.midi(s);null!==n&&i.push({note:s,midi:n});let a="".concat(t).concat(r),l=w.L7.midi(a);null!==l&&o.push({note:a,midi:l})}let d=null,c=e=>e<48?(48-e)*3:e>72?(e-72)*3:0;for(let e of i)for(let t of o){let n=Math.abs(e.midi-r),a=Math.abs(t.midi-s),i=n+a+(c(e.midi)+c(t.midi));
1(!d||i<d.cost)&&(d={displayedNote:e.note,displayedMidi:e.midi,displayedRole:l,expectedNote:t.note,expectedMidi:t.midi,expectedRole:"seventh",thirdNote:e.note,seventhNote:t.note,cost:i})}for(let e of o)for(let t of i){let n=Math.abs(e.midi-r),a=Math.abs(t.midi-s),i=n+a+(c(e.midi)+c(t.midi));(!d||i<d.cost)&&(d={displayedNote:e.note,displayedMidi:e.midi,displayedRole:"seventh",expectedNote:t.note,expectedMidi:t.midi,expectedRole:l,thirdNote:t.note,seventhNote:e.note,cost:i})}let{cost:u,...h}=d;return h}(h,m,s,n,a.chordSymbol,d);s=x.displayedMidi,n=x.expectedMidi;let b=function(e,t,r){let s=t||e,n="".concat(s,"2"),a=w.L7.midi(n);return null!==a&&a>=r&&(n="".concat(s,"1"),a=w.L7.midi(n)),(null===a||a>=r)&&(n="".concat(s,"1")),n}(l,o,Math.min(x.displayedMidi,x.expectedMidi)),p={id:"step-".concat(r+1),chordSymbol:a.chordSymbol,root:l,chordType:i,third:x.thirdNote,seventh:x.seventhNote,bass:b,displayedNote:x.displayedNote,displayedRole:x.displayedRole,expectedNote:x.expectedNote,expectedRole:x.expectedRole,duration:a.duration,durationMs:a.durationMs,measureNumber:a.measureNumber,beatPosition:a.beatPosition};t.push(p)}return t}(e,S,t)}(d,t),timeSignature:n,keySignature:a,title:l,tempo:t}}catch(e){return console.error("Error parsing Guido MusicXML:",e),A()}}(t,ei);en(e.steps),eu(e.timeSignature.beats)}catch(e){console.error("Error parsing Guido MusicXML:",e)}},[t,ei]);let eM=es[ea];(0,n.useEffect)(()=>{if(!eM||!eo||"performance"===_||ek||eE)return;let e=setTimeout(()=>{h.playNote(eM.bass,.4,!0),h.playNote(eM.displayedNote,.7,!0),ey.current=Date.now()},100);return()=>clearTimeout(e)},[ea,eo,_,ek,eE]),(0,n.useEffect)(()=>{H.current=O},[O]);let eG=(0,n.useMemo)(()=>{let e=new Map;return es.forEach((t,r)=>{let s=t.measureNumber;e.has(s)||e.set(s,{measureNumber:s,steps:[]}),e.get(s).steps.push({step:t,stepIndex:r})}),Array.from(e.values()).sort((e,t)=>e.measureNumber-t.measureNumber)},[es]),eF=(0,n.useMemo)(()=>eM?w.L7.midi(eM.expectedNote):null,[eM]),eD=(0,n.useCallback)(()=>{if(ea<es.length-1)el(e=>e+1),em(!1),eb(!1),ef(null),ev.current.clear(),null==c||c(ea+1);else{let e=es.length>0?ej/es.length*100:0;eS(!0),eA(!0),null==m||m(e)}},[ea,es.length,ej,c,m]),eB=(0,n.useCallback)(()=>{ea>0&&(el(e=>e-1),em(!1),eb(!1),ef(null),ev.current.clear(),null==c||c(ea-1))},[ea,c]),e_=(0,n.useCallback)(()=>{el(0),em(!1),eb(!1),ef(null),ew(0),eC(0),eS(!1),ee([]),ev.current.clear(),null==c||c(0)},[c]),eT=(0,n.useCallback)(()=>{em(!1),eb(!1),ef(null),ev.current.clear()},[]);(0,n.useCallback)(()=>{eM&&eo&&(console.log("[Guido] Playing bass note:",eM.bass),h.playNote(eM.bass,.7))},[eM,eo]);let eI=(0,n.useCallback)(()=>{eM&&eo&&(console.log("[Guido] Playing displayed note:",eM.displayedNote,"with bass:",eM.bass),h.playNote(eM.bass,.5,!0),h.playNote(eM.displayedNote,.8,!0))},[eM,eo]),eL=(0,n.useCallback)(()=>{eM&&eo&&(console.log("[Guido] Playing both guide tones:",eM.third,eM.seventh,"with bass:",eM.bass),h.playNote(eM.bass,.4,!0),h.playNote(eM.third,.6,!0),h.playNote(eM.seventh,.6,!0))},[eM,eo]),eP=(0,n.useCallback)(e=>{if(!eM||null===eF||!eo)return;eg.current&&(clearTimeout(eg.current),eg.current=null);let t=function(e,t){let r=w.L7.get(t),s=r.pc,n=r.chroma,a=e%12,l=Math.floor(e/12)-1;return a===n&&s?("Cb"===s&&(l+=1),"B#"===s&&(l-=1),"".concat(s).concat(l)):"".concat(["C","Db","D","Eb","E","F","Gb","G","Ab","A","Bb","B"][a]).concat(l)}(e,eM.expectedNote);Y&&h.playNote(t,.8,!1,!0);let r=eF%12,s=e%12,n=Date.now()-ey.current;if(s===r){eh||ex||(ew(e=>e+1),null==u||u("correct")),eh||ee(e=>[...e.filter(e=>e.measureIndex!==ea),{measureIndex:ea,step:eM,playedNote:t,isCorrect:!0}]),em(!0),ef(t),(0,M.Ac)();let e=ea>=es.length-1;n<2500||e||(h.playNote(eM.bass,.4,!0),h.playNote(eM.displayedNote,.6,!0)),setTimeout(()=>{eD()},800)}else ex||eh||(eC(e=>e+1),null==u||u("incorrect"),ee(e=>[...e.filter(e=>e.measureIndex!==ea),{measureIndex:ea,step:eM,playedNote:t,isCorrect:!1}])),eb(!0),ev.current.add(e),(0,M.Rm)(),"performance"!==_&&(eg.current=setTimeout(()=>{eT()},2e3))},[eM,ea,es.length,eF,eo,eh,ex,u,eD,eT,_,Y]),eR=(0,n.useRef)([]);(0,n.useMemo)(()=>{let e=[];eG.forEach(t=>{let r=Math.floor(ec/t.steps.length);t.steps.forEach((t,s)=>{e.push({stepIndex:t.stepIndex,beatInMeasure:s*r+1})})}),eR.current=e},[eG,ec]);let eq=(0,n.useCallback)(e=>{if(!H.current)return;let t=2*ec;
1if(e<=t){e<=ec?U(e):U(e-ec);return}U(0);let r=Math.floor((e-t-1)/ec),s=(e-t-1)%ec+1,n=eG[r];if(!n||r>=eG.length){H.current=!1,$(!1),eS(!0);let e=ej+eN,t=e>0?ej/e*100:0;null==m||m(t);return}let a=n.steps.length,l=Math.floor(ec/a),i=Math.floor((s-1)/l);if((s-1)%l==0&&i<a){let e=n.steps[i];if(e){em(!1),eb(!1),ef(null),ev.current.clear(),el(e.stepIndex);let t=e.step;t&&(h.playChord(t.bass,t.displayedNote),ey.current=Date.now())}}},[eG,ej,eN,m,P,ec]),ez=(0,T.g)({bpm:P,beatsPerMeasure:ec,enabled:"performance"===_&&V&&O,onBeat:eq,backbeatOnly:W}),eO=(0,n.useCallback)(()=>{el(0),ew(0),eC(0),ee([]),em(!1),eb(!1),ef(null),ev.current.clear(),eS(!1),U(0),H.current=!0,$(!0),ez.start()},[ez]),e$=(0,n.useCallback)(()=>{H.current=!1,$(!1),ez.stop(),U(0)},[ez]),eH=(0,n.useCallback)((e,t)=>{t&&eP(e)},[eP]);(0,y.Z)(eH),(0,j.B)({onSpacebar:"performance"!==_||O?eI:eO,disabled:p||f}),(0,n.useEffect)(()=>{let e=e=>{!(e.target instanceof HTMLInputElement||e.target instanceof HTMLTextAreaElement)&&!p&&!f&&("ArrowRight"===e.key?(e.preventDefault(),"step"===_&&ea<es.length-1&&eD()):"ArrowLeft"===e.key?(e.preventDefault(),"step"===_&&ea>0&&eB()):"Enter"===e.key?(e.preventDefault(),O||e_()):"Escape"===e.key&&O&&e$())};return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[_,ea,es.length,eD,eB,e_,O,e$,p,f]);let eV=(0,n.useCallback)(e=>{b&&eP(e)},[b,eP]);return((0,n.useEffect)(()=>{if(f)return;let e={a:0,s:2,d:4,f:5,g:7,h:9,j:11,k:12,l:14,w:1,e:3,t:6,y:8,u:10},t=new Set,r=r=>{if(r.target instanceof HTMLInputElement||r.target instanceof HTMLTextAreaElement)return;let s=r.key.toLowerCase();if("z"===s){er(e=>Math.max(1,e-1));return}if("x"===s){er(e=>Math.min(7,e+1));return}void 0===e[s]||t.has(s)||(t.add(s),eV((et+1)*12+e[s]))},s=e=>{let r=e.key.toLowerCase();t.delete(r)};return window.addEventListener("keydown",r),window.addEventListener("keyup",s),()=>{window.removeEventListener("keydown",r),window.removeEventListener("keyup",s)}},[et,eV,f]),t&&0!==es.length)?(0,s.jsxs)("div",{className:"flex flex-col gap-1.5 sm:gap-6 w-full max-w-4xl mx-auto pt-3 sm:pt-0 pb-[calc(96px+env(safe-area-inset-bottom))] sm:pb-48",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between px-3 sm:px-4 py-1 sm:py-0",children:[(0,s.jsxs)("div",{className:"text-[10px] sm:text-sm text-muted-foreground",children:[ea+1,"/",es.length]}),(0,s.jsxs)("div",{className:"flex items-center gap-2 sm:gap-4",children:[(0,s.jsxs)("div",{className:"flex items-center gap-0.5 bg-surface2 rounded-md sm:rounded-lg p-0.5 sm:p-1",children:[(0,s.jsx)("button",{onClick:()=>B("visual"),className:"px-1.5 sm:px-2 py-0.5 sm:py-1 text-[10px] sm:text-xs rounded-sm sm:rounded-md transition-all ".concat("visual"===D?"bg-background text-foreground shadow-sm font-medium":"text-muted-foreground hover:text-foreground"),children:"Visual"}),(0,s.jsx)("button",{onClick:()=>B("sheet"),className:"px-1.5 sm:px-2 py-0.5 sm:py-1 text-[10px] sm:text-xs rounded-sm sm:rounded-md transition-all ".concat("sheet"===D?"bg-background text-foreground shadow-sm font-medium":"text-muted-foreground hover:text-foreground"),children:"Sheet"})]}),(0,s.jsxs)("div",{className:"flex items-center gap-1 sm:gap-2 text-xs sm:text-base font-mono",children:[(0,s.jsx)("span",{className:"text-success font-medium",children:ej}),(0,s.jsx)("span",{className:"text-muted-foreground",children:"/"}),(0,s.jsx)("span",{className:"text-danger font-medium",children:eN})]})]})]}),(0,s.jsx)(a.N,{children:O&&K>0&&(0,s.jsx)(l.P.div,{initial:{opacity:0}
1,animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 z-50 flex items-center justify-center bg-black/30 backdrop-blur-sm pointer-events-none",children:(0,s.jsx)(l.P.div,{initial:{opacity:0,scale:.5},animate:{opacity:1,scale:1},exit:{opacity:0,scale:1.2},transition:{duration:.15},className:"text-[12rem] font-bold font-display text-foreground drop-shadow-2xl",style:{textShadow:"0 0 40px rgb(var(--hue-guido-rgb) / 0.5)"},children:K},K)})}),eM&&!(v&&"sheet"===D)&&(0,s.jsxs)("div",{className:"flex items-center justify-center gap-2 sm:gap-4 px-2 sm:px-4",children:[ea>0&&(0,s.jsx)("div",{className:"hidden sm:block text-2xl font-medium text-muted-foreground/40",children:es[ea-1].chordSymbol}),(0,s.jsx)(l.P.div,{initial:{opacity:0,scale:.9},animate:{opacity:1,scale:1},className:"text-center",children:(0,s.jsx)("div",{className:"text-2xl sm:text-5xl font-bold font-display tracking-tight text-foreground",children:eM.chordSymbol})},ea),ea<es.length-1&&(0,s.jsxs)("div",{className:"hidden sm:block text-lg sm:text-2xl font-medium text-muted-foreground/40",children:["â ",es[ea+1].chordSymbol]})]}),eM&&!(v&&"sheet"===D)&&(0,s.jsxs)("div",{className:"text-center px-2",children:[(0,s.jsxs)("div",{className:"text-sm sm:text-lg text-muted-foreground",children:["Play the ",(0,s.jsx)("span",{className:"font-semibold text-action",children:eM.expectedRole})]}),(0,s.jsxs)("div",{className:"text-[10px] sm:text-sm text-muted-foreground mt-0.5 sm:mt-1",children:["Given: ",(0,s.jsx)("span",{className:"font-mono bg-surface2 px-1 sm:px-2 py-0.5 rounded text-[10px] sm:text-sm",children:eM.displayedNote})," (",eM.displayedRole,")"]})]}),"visual"===D&&(0,s.jsx)("div",{className:"ear-card p-2 sm:p-6 mx-2 sm:mx-0",style:{"--hue":"var(--hue-guido-rgb)"},children:(0,s.jsxs)("div",{className:"flex items-center justify-center gap-3 sm:gap-8",children:[(0,s.jsxs)("div",{className:"text-center",children:[(0,s.jsx)("div",{className:"w-12 h-12 sm:w-20 sm:h-20 rounded-full bg-[rgb(var(--hue-guido-rgb)_/_0.15)] border-2 border-[rgb(var(--hue-guido-rgb)_/_0.8)] flex items-center justify-center mb-0.5 sm:mb-2",children:(0,s.jsx)("span",{className:"text-lg sm:text-2xl font-bold text-info",children:null==eM?void 0:eM.displayedNote.replace(/\d/,"")})}),(0,s.jsx)("div",{className:"ear-label",children:null==eM?void 0:eM.displayedRole}),(0,s.jsx)("div",{className:"text-[10px] sm:text-sm font-mono text-muted-foreground",children:null==eM?void 0:eM.displayedNote})]}),(0,s.jsx)("div",{className:"text-lg sm:text-3xl text-muted-foreground",children:"â"}),(0,s.jsxs)("div",{className:"text-center",children:[(0,s.jsx)("div",{className:"w-12 h-12 sm:w-20 sm:h-20 rounded-full flex items-center justify-center mb-0.5 sm:mb-2 transition-all duration-300 ".concat(eh?"bg-[rgb(var(--ear-success-rgb)_/_0.25)] border-2 border-success":ex?"bg-[rgb(var(--ear-danger-rgb)_/_0.25)] border-2 border-danger":"bg-[rgb(var(--ear-accent-rgb)_/_0.15)] border-2 border-ear-accent border-dashed"),children:(0,s.jsx)("span",{className:"text-lg sm:text-2xl font-bold ".concat(eh?"text-success":ex?"text-danger":"text-ear-accent"),children:eh?null==eM?void 0:eM.expectedNote.replace(/\d/,""):"?"})}),(0,s.jsx)("div",{className:"ear-label",children:null==eM?void 0:eM.expectedRole}),(0,s.jsx)("div",{className:"text-[10px] sm:text-sm font-mono text-muted-foreground",children:eh?null==eM?void 0:eM.expectedNote:"â"})]})]})}),"notation"===D&&eM&&(0,s.jsx)("div",{className:"bg-white rounded-xl sm:rounded-2xl border border-black/10 p-2 sm:p-4 mx-2 sm:mx-0",children:(0,s.jsx)(G.J,{currentStep:eM,nextStep:ea<es.length-1?es[ea+1]:void 0,playedCorrectNote:eh,playedWrongNote:ex,actualPlayedNote:ep})}),"sheet"===D&&es.length>0&&(0,s.jsx)(I,{isMobile:v,currentStepIndex:ea,steps:es,completedMeasures:Q,isPerformancePlaying:O,metronomeCurrentBeat:ez.currentBeat,performanceTempo:P,beatsPerMeasure:ec}),(0,s.jsx)("div",{className:"hidden sm:flex h-8 items-center justify-center",children:(0,s.jsxs)(a.N,{mode:"wait",children:[eh&&(0,s.jsx)(l.P.div,{initial:{opacity:0,scale:.9},animate:{opacity:1,scale:1},exit:{opacity:0,scale:.9},className:"text-center text-success font-semibold text-xl",children:"â Correct!"}),ex&&!eh&&(0,s.jsx)(l.P.div,{initial:{opacity:0,scale:.9}
1,animate:{opacity:1,scale:1},exit:{opacity:0,scale:.9},className:"text-center text-danger font-semibold text-xl",children:"â Try again"})]})}),(0,s.jsx)("div",{className:"w-full px-2 sm:px-0 mt-auto",children:(0,s.jsxs)("div",{className:"ear-card rounded-xl sm:rounded-2xl overflow-hidden",style:{"--hue":"var(--hue-guido-rgb)"},children:[!v&&(0,s.jsx)("div",{className:"px-4 pt-3 flex items-center justify-end text-xs text-muted-foreground",children:(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)("button",{onClick:()=>er(e=>Math.max(1,e-1)),className:"px-2 py-0.5 bg-surface2 rounded text-[10px] font-bold hover:bg-border transition-colors",title:"Z key",children:"Z â"}),(0,s.jsxs)("span",{className:"font-mono font-bold text-action",children:["Oct ",et]}),(0,s.jsx)("button",{onClick:()=>er(e=>Math.min(7,e+1)),className:"px-2 py-0.5 bg-surface2 rounded text-[10px] font-bold hover:bg-border transition-colors",title:"X key",children:"X â"})]})}),(0,s.jsx)("div",{className:"p-1.5 sm:p-4 md:p-6",children:(0,s.jsx)(g,{firstNote:"C3",lastNote:"C5",onPlayNote:eV,disabled:!b,showKeyboardShortcuts:!v,keyboardOctave:et})})]})}),(0,s.jsxs)("div",{className:"fixed left-1/2 -translate-x-1/2 sm:translate-x-0 sm:left-1 lg:left-2 z-50 pointer-events-auto flex flex-row sm:flex-col items-center flex-nowrap gap-1 sm:gap-2 w-auto max-w-[calc(100%-1rem)] bottom-[calc(56px+env(safe-area-inset-bottom)+62px)] sm:bottom-auto sm:top-[40%] sm:-translate-y-1/2",children:[(0,s.jsxs)("div",{className:"ear-glass rounded-lg sm:rounded-xl shadow-xl border border-border/60 p-0.5 sm:p-1 lg:p-1.5 flex flex-row sm:flex-col items-center gap-0.5 lg:gap-1 w-auto",children:[(0,s.jsx)("button",{onClick:()=>{L("step"),e$()},className:"h-8 min-w-[44px] px-2 sm:px-0 sm:h-auto sm:min-w-0 py-1.5 sm:py-3 lg:py-4 rounded-md sm:rounded-lg flex items-center justify-center transition-all duration-300 ".concat("step"===_?"bg-action text-white shadow-lg":"text-muted-foreground hover:text-foreground hover:bg-white/5"),title:"Step Mode",children:(0,s.jsx)("span",{className:"text-[8px] sm:text-[10px] lg:text-[12px] font-mono font-bold uppercase tracking-wider sm:[writing-mode:vertical-rl] sm:rotate-180",children:"Step"})}),(0,s.jsx)("button",{onClick:()=>{L("performance"),B("sheet")},className:"h-8 min-w-[44px] px-2 sm:px-0 sm:h-auto sm:min-w-0 py-1.5 sm:py-3 lg:py-4 rounded-md sm:rounded-lg flex items-center justify-center transition-all duration-300 ".concat("performance"===_?"bg-ear-accent text-white shadow-lg":"text-muted-foreground hover:text-foreground hover:bg-white/5"),title:"Performance Mode",children:(0,s.jsx)("span",{className:"text-[8px] sm:text-[10px] lg:text-[12px] font-mono font-bold uppercase tracking-wider sm:[writing-mode:vertical-rl] sm:rotate-180",children:"Perf"})}),(0,s.jsx)("div",{className:"h-4 w-px sm:w-4 lg:w-5 sm:h-px bg-border/60 my-0 sm:my-0.5 mx-0.5 sm:mx-0"}),(0,s.jsx)("button",{onClick:()=>Z(!Y),className:"h-8 w-8 sm:h-auto sm:w-full px-1.5 sm:px-0 py-1.5 sm:py-2 lg:py-2.5 rounded-md sm:rounded-lg flex items-center justify-center transition-all border ".concat(Y?"bg-[rgb(var(--ear-action-rgb)_/_0.1)] text-action border-[rgb(var(--ear-action-rgb)_/_0.3)]":"bg-white/5 text-muted-foreground border-border/60"),title:Y?"Sound ON":"Sound OFF",children:Y?(0,s.jsx)(o.pPd,{className:"w-2.5 h-2.5 sm:w-3 sm:h-3 lg:w-3.5 lg:h-3.5"}):(0,s.jsx)(o.FZ2,{className:"w-2.5 h-2.5 sm:w-3 sm:h-3 lg:w-3.5 lg:h-3.5"})})]}),(0,s.jsx)(a.N,{mode:"wait",children:"performance"===_&&(0,s.jsx)(l.P.div,{initial:{opacity:0,x:-6},animate:{opacity:1,x:0},exit:{opacity:0,x:-6},transition:{duration:.15},className:"w-auto",children:(0,s.jsxs)("div",{className:"ear-glass rounded-lg sm:rounded-xl shadow-xl border border-border/60 p-0.5 sm:p-1 lg:p-1.5 flex flex-row sm:flex-col items-center gap-0.5 sm:gap-0.5 w-auto sm:w-full",children:[(0,s.jsxs)("div",{className:"flex flex-row sm:flex-col items-center gap-0.5 w-auto sm:w-full",children:[(0,s.jsx)("span",{className:"hidden sm:block text-[6px] sm:text-[7px] lg:text-[9px] text-muted-foreground font-mono font-bold",children:"BPM"}),(0,s.jsx)("button",{onClick:()=>{let e=Math.min(400,P+1);R(e),z(String(e))},disabled:O,className:"order-3 sm:order-none w-7 h-7 sm:w-full sm:h-5 lg:h-6 rounded bg-white/10 hover:bg-white/20 text-muted-foreground hover:text-foreground flex items-center justify-center text-[10px] sm:text-xs lg:text-sm font-bold disabled:opacity-50 transition-all",children:"+"}),(0,s.jsx)("input",{type:"text",inputMode:"numeric",pattern:"[0-9]*",value:q,onChange:e=>{let t=e.target.value;z(t);let r=parseInt(t);!isNaN(r)&&r>=20&&r<=400&&R(r)},onBlur:()=>{let e=parseInt(q);isNaN(e)||e<20?z(String(P)):e>400&&(R(400),z("400"))},disabled:O,className:"order-2 sm:order-none w-12 h-7 sm:w-full sm:h-5 lg:h-6 bg-white/10 rounded text-foreground text-[10px] sm:text-[10px] lg:text-[12px] font-mono font-bold text-center focus:outline-none focus:ring-1 focus:ring-ring/60 disabled:opacity-50"}),(0,s.jsx)("button",{onClick:()=>{let e=Math.max(20,P-1);R(e),z(String(e))}
1,disabled:O,className:"order-1 sm:order-none w-7 h-7 sm:w-full sm:h-5 lg:h-6 rounded bg-white/10 hover:bg-white/20 text-muted-foreground hover:text-foreground flex items-center justify-center text-[10px] sm:text-xs lg:text-sm font-bold disabled:opacity-50 transition-all",children:"â"})]}),(0,s.jsx)("div",{className:"h-4 w-px sm:w-4 lg:w-5 sm:h-px bg-border/60 my-0 sm:my-0.5 mx-0.5 sm:mx-0"}),(0,s.jsx)("button",{onClick:()=>J(!V),disabled:O,className:"h-7 px-2 sm:w-full sm:h-auto sm:py-1.5 lg:py-2 rounded-md sm:rounded-lg flex items-center justify-center transition-all border text-[9px] sm:text-[7px] lg:text-[10px] ".concat(V?"bg-[rgb(var(--ear-success-rgb)_/_0.1)] text-success border-[rgb(var(--ear-success-rgb)_/_0.3)]":"bg-white/5 text-muted-foreground border-border/60"," disabled:opacity-50"),title:"Click ".concat(V?"ON":"OFF"),children:(0,s.jsx)("span",{className:"font-bold sm:[writing-mode:vertical-rl] sm:rotate-180",children:"Click"})}),V&&(0,s.jsx)("button",{onClick:()=>X(!W),disabled:O,className:"h-7 px-2 sm:w-full sm:h-auto sm:py-1.5 lg:py-2 rounded-md sm:rounded-lg flex items-center justify-center transition-all border text-[9px] sm:text-[7px] lg:text-[10px] ".concat(W?"bg-[rgb(var(--ear-accent-rgb)_/_0.1)] text-ear-accent border-[rgb(var(--ear-accent-rgb)_/_0.3)]":"bg-white/5 text-muted-foreground border-border/60"," disabled:opacity-50"),title:"Click on beats 2 and 4 only",children:(0,s.jsx)("span",{className:"font-bold sm:[writing-mode:vertical-rl] sm:rotate-180",children:"2&4"})})]})},"tempo-side-panel")})]}),(0,s.jsxs)("div",{className:"fixed bottom-[calc(66px+env(safe-area-inset-bottom))] sm:bottom-3 left-1/2 -translate-x-1/2 z-40 pointer-events-none flex flex-col items-center",children:[(0,s.jsxs)("div",{className:"pointer-events-auto flex items-center gap-1 sm:gap-2 ear-glass rounded-full shadow-2xl border border-border/60 p-1 sm:p-1.5 px-2 sm:px-4",children:[(0,s.jsx)(i.$,{onClick:e_,variant:"ghost",size:"icon",className:"h-7 w-7 sm:h-8 sm:w-8 rounded-full transition-all hover:bg-white/10 ".concat("step"===_?"text-action":"text-danger"),disabled:O,title:"Restart",children:(0,s.jsx)(o.Swo,{className:"text-xs sm:text-sm"})}),"step"===_&&(0,s.jsx)(i.$,{onClick:eB,variant:"ghost",size:"icon",className:"h-7 w-7 sm:h-8 sm:w-8 rounded-full hover:bg-white/10 text-muted-foreground hover:text-foreground transition-all",disabled:0===ea,children:(0,s.jsx)(o.QVr,{className:"text-xs sm:text-sm"})}),(0,s.jsx)(i.$,{onClick:()=>{"step"===_?eI():O?e$():eO()},size:"icon",className:"h-10 w-10 sm:h-12 sm:w-12 rounded-full shadow-lg hover:shadow-xl transition-all scale-100 hover:scale-105 active:scale-95 ".concat("step"===_?"bg-primary text-primary-foreground hover:bg-primary/90":O?"bg-destructive text-white hover:bg-destructive/90":"bg-primary text-primary-foreground hover:bg-primary/90"),disabled:"step"===_&&!eo,children:"step"===_?(0,s.jsx)(o.gSK,{className:"text-base sm:text-lg ml-0.5"}):O?(0,s.jsx)(o.wFo,{className:"text-sm sm:text-base"}):(0,s.jsx)(o.gSK,{className:"text-base sm:text-lg ml-0.5"})}),"step"===_&&(0,s.jsx)(i.$,{onClick:eL,variant:"ghost",size:"icon",className:"h-7 w-7 sm:h-8 sm:w-8 rounded-full bg-white/5 hover:bg-white/10 text-ear-accent transition-all border border-[rgb(var(--ear-accent-rgb)_/_0.3)]",disabled:!eo,title:"Play Both Guide Tones",children:(0,s.jsx)(o.BHn,{className:"text-[10px] sm:text-xs"})}),"step"===_&&(0,s.jsx)(i.$,{onClick:eD,variant:"ghost",size:"icon",className:"h-7 w-7 sm:h-8 sm:w-8 rounded-full hover:bg-white/10 text-muted-foreground hover:text-foreground transition-all",disabled:ea===es.length-1,children:(0,s.jsx)(o.Z0P,{className:"text-xs sm:text-sm"})}),"performance"===_&&O&&!K&&(0,s.jsxs)("div",{className:"flex items-center gap-2 ml-2 px-2 py-1 rounded-full bg-white/5 border border-border/60",children:[(0,s.jsx)("div",{className:"w-1.5 h-1.5 bg-danger rounded-full animate-pulse"}),(0,s.jsxs)("span",{className:"text-xs font-mono text-muted-foreground",children:[ea+1,"/",es.length]})]})]}),!v&&!f&&(0,s.jsxs)("div",{className:"mt-2 flex items-center justify-center gap-3 text-[10px] lg:text-xs text-muted-foreground",children:[(0,s.jsxs)("span",{className:"flex items-center gap-1",children:[(0,s.jsx)("kbd",{className:"px-1.5 py-0.5 bg-surface2 rounded text-muted-foreground font-mono",children:"Space"}),(0,s.jsx)("span",{children:"Play"})]}),(0,s.jsx)("span",{className:"text-border","aria-hidden":"true",children:"|"}),(0,s.jsxs)("span",{className:"flex items-center gap-1",children:[(0,s.jsx)("kbd",{className:"px-1.5 py-0.5 bg-surface2 rounded text-muted-foreground font-mono",children:"ââ"}),(0,s.jsx)("span",{children:"Navigate"})]}),(0,s.jsx)("span",{className:"text-border","aria-hidden":"true",children:"|"}),(0,s.jsxs)("span",{className:"flex items-center gap-1",children:[(0,s.jsx)("kbd",{className:"px-1.5 py-0.5 bg-surface2 rounded text-muted-foreground font-mono",children:"Enter"}),(0,s.jsx)("span",{children:"Restart"})]}),(0,s.jsx)("span",{className:"text-border","aria-hidden":"true",children:"|"}),(0,s.jsxs)("span",{className:"flex items-center gap-1",children:[(0,s.jsx)("kbd",{className:"px-1.5 py-0.5 bg-surface2 rounded text-muted-foreground font-mono",children:"A-L"}),(0,s.jsx)("span",{children:"Notes"})]}),(0,s.jsx)("span",{className:"text-border","aria-hidden":"true",children:"|"}),(0,s.jsxs)("span",{className:"flex items-center gap-1",children:[(0,s.jsx)("kbd",{className:"px-1.5 py-0.5 bg-surface2 rounded text-muted-foreground font-mono",children:"Z/X"}),(0,s.jsx)("span",{children:"Octave"})]})]})]}),(0,s.jsx)(a.N,{children:ek&&(0,s.jsx)(l.P.div,{initial:{opacity:0}
1,animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center z-50 p-4",onClick:()=>eS(!1),children:(0,s.jsxs)(l.P.div,{initial:{scale:.9,opacity:0},animate:{scale:1,opacity:1},exit:{scale:.9,opacity:0},className:"ear-glass rounded-xl sm:rounded-2xl p-4 sm:p-8 max-w-md w-full shadow-2xl border border-border",onClick:e=>e.stopPropagation(),children:[(0,s.jsx)("h2",{className:"text-xl sm:text-2xl font-bold font-display tracking-tight text-center mb-4 sm:mb-6",children:"Exercise Complete!"}),(0,s.jsxs)("div",{className:"text-center mb-4 sm:mb-6",children:[(0,s.jsxs)("div",{className:"text-5xl sm:text-6xl font-bold text-primary mb-1 sm:mb-2",children:[es.length>0?Math.round(ej/es.length*100):0,"%"]}),(0,s.jsx)("div",{className:"text-sm sm:text-base text-muted-foreground",children:"Accuracy"})]}),(0,s.jsxs)("div",{className:"flex justify-center gap-8 sm:gap-12 mb-6 sm:mb-8",children:[(0,s.jsxs)("div",{className:"text-center",children:[(0,s.jsx)("div",{className:"text-2xl sm:text-3xl font-bold text-success",children:ej}),(0,s.jsx)("div",{className:"text-xs sm:text-sm text-muted-foreground",children:"Correct"})]}),(0,s.jsxs)("div",{className:"text-center",children:[(0,s.jsx)("div",{className:"text-2xl sm:text-3xl font-bold text-danger",children:eN}),(0,s.jsx)("div",{className:"text-xs sm:text-sm text-muted-foreground",children:"Incorrect"})]})]}),(0,s.jsxs)("div",{className:"flex gap-2 sm:gap-3",children:[(0,s.jsxs)(i.$,{variant:"outline",className:"flex-1 text-sm sm:text-base",onClick:()=>{eS(!1),eA(!1),el(0),ew(0),eC(0),em(!1),eb(!1),ee([])},children:[(0,s.jsx)(o.Swo,{className:"mr-1 sm:mr-2 text-xs sm:text-sm"}),"Try Again"]}),(0,s.jsx)(i.$,{className:"flex-1 text-sm sm:text-base",onClick:()=>eS(!1),children:"Done"})]})]})})})]}):(0,s.jsx)("div",{className:"flex items-center justify-center h-64 text-muted-foreground",children:(0,s.jsx)("div",{className:"animate-pulse",children:"Loading exercise..."})})}},83668:(e,t,r)=>{r.d(t,{J:()=>l});var s=r(95155),n=r(12115),a=r(56114);let l=e=>{let{currentStep:t,nextStep:r,playedCorrectNote:l,actualPlayedNote:i}=e,o=(0,n.useRef)(null),d=e=>{let t=e.match(/([A-G])(#|b)?(\d+)/i);if(!t)return 60;let[,r,s,n]=t,a=(parseInt(n)+1)*12+({C:0,D:2,E:4,F:5,G:7,A:9,B:11})[r.toUpperCase()];return"#"===s&&a++,"b"===s&&a--,a},c=e=>{if(!e||"string"!=typeof e)return console.error("[GuidoNotation] Invalid note input:",e),{key:"c/4",accidental:null};let t=e.match(/([A-G])(#|b)?(\d+)/i);if(!t)return console.error("[GuidoNotation] Failed to parse note:",e),{key:"c/4",accidental:null};let[,r,s,n]=t;return{key:"".concat(r.toLowerCase(),"/").concat(n),accidental:s||null}};return(0,n.useEffect)(()=>{let e;if(!o.current||!t)return;let s=o.current;s.innerHTML="";let n=i||t.expectedNote,u=d(t.displayedNote),h=d(n),m=65>Math.min(u,h),x=new a.Renderer(s,a.Renderer.Backends.SVG),b=Math.min(280,window.innerWidth-40);x.resize(b,180);let p=x.getContext(),f=new a.Stave(10,50,b-20);f.addClef(m?"bass":"treble"),f.setContext(p).draw();let v=c(t.displayedNote),g=c(n);if(l&&i){let t,r;u<=h?(t=[v.key,g.key],r=[v.accidental,g.accidental]):(t=[g.key,v.key],r=[g.accidental,v.accidental]),e=new a.StaveNote({clef:m?"bass":"treble",keys:t,duration:"w"}),r.forEach((t,r)=>{t&&e.addModifier(new a.Accidental(t),r)}),e.setStyle({fillStyle:"#22c55e",strokeStyle:"#22c55e"})}else e=new a.StaveNote({clef:m?"bass":"treble",keys:[v.key],duration:"w"}),v.accidental&&e.addModifier(new a.Accidental(v.accidental)),e.setStyle({fillStyle:"#3b82f6",strokeStyle:"#3b82f6"});let y=new a.Voice({num_beats:4,beat_value:4}).setStrict(!1);y.addTickables([e]),new a.Formatter().joinVoices([y]).format([y],b-80),y.draw(p,f);let j="http://www.w3.org/2000/svg",w=s.querySelector("svg");if(w){let e=document.createElementNS(j,"text");if(e.setAttribute("x","85"),e.setAttribute("y","45"),e.setAttribute("font-size","26"),e.setAttribute("font-weight","normal"),e.setAttribute("font-family","'Petaluma Script', 'Times New Roman', serif"),e.setAttribute("fill","#1f2937"),e.textContent=t.chordSymbol,w.appendChild(e),r){let e=document.createElementNS(j,"text");e.setAttribute("x","180"),e.setAttribute("y","45"),e.setAttribute("font-size","18"),e.setAttribute("font-family","'Petaluma Script', 'Times New Roman', serif"),e.setAttribute("fill","#9ca3af"),e.textContent="â".concat(r.chordSymbol),w.appendChild(e)}}},[t,r,l,i]),(0,s.jsx)("div",{ref:o,className:"w-full flex justify-center items-center min-h-[180px] bg-white rounded-xl",style:{backgroundColor:"white"}})}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.