1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[60310],{46620:(e,t,n)=>{n.d(t,{A:()=>u});var a=n(95155),r=n(12115),s=n(79469),i=n(19966),l=n(35462);let o=["a","w","s","e","d","f","t","g","y","h","u","j","k"],d=["from-amber-400 via-orange-500 to-red-600","from-indigo-400 via-purple-500 to-pink-600","from-emerald-400 via-teal-500 to-cyan-600","from-rose-400 via-pink-500 to-fuchsia-600","from-sky-400 via-blue-500 to-indigo-600","from-lime-400 via-green-500 to-emerald-600"],c=e=>{let t="",n=e;e.includes("First Inversion")?(t="1st",n=e.replace("First Inversion","").trim()):e.includes("Second Inversion")?(t="2nd",n=e.replace("Second Inversion","").trim()):e.includes("Third Inversion")?(t="3rd",n=e.replace("Third Inversion","").trim()):e.includes("Fourth Inversion")?(t="4th",n=e.replace("Fourth Inversion","").trim()):(e.includes("Root Position")||e.includes("Root"))&&(t="",n=e.replace(/\s*\(Root Position\)\s*/gi,"").replace(/Root Position/gi,"").replace(/Root/gi,"").trim());let a={"Major 7th":"Maj7","Major 7":"Maj7",Maj7th:"Maj7","Minor 7th":"min7","Minor 7":"min7",min7th:"min7","Dominant 7th":"7","Dominant 7":"7",Dom7th:"7",Dom7:"7","Diminished 7th":"dim7","Diminished 7":"dim7",dim7th:"dim7","Half-Diminished 7th":"Half-dim 7th","Half-Diminished":"Half-dim","Half Diminished":"Half-dim",Augmented:"Augmented",Diminished:"Diminished",Major:"Major",Minor:"Minor",Maj:"Maj",Min:"min","Suspended 4":"sus4","Suspended 2":"sus2",Sus4:"sus4",Sus2:"sus2","Add 9":"add9","Add 11":"add11","Phrygian Dominant":"PhryDom","Lydian Dominant":"LydDom",Phrygian:"Phry",Lydian:"Lyd",Dorian:"Dor",Mixolydian:"Mixo",Locrian:"Loc",Aeolian:"Aeol",Ionian:"Ion","Maj7th Sus4":"M7sus4","Maj7 Sus4":"M7sus4","Maj7th Sus2":"M7sus2","Maj7 Sus2":"M7sus2","min7th Sus4":"m7sus4","min7 Sus4":"m7sus4","Dom7th Sus4":"7sus4","Dom7 Sus4":"7sus4","Dom7th Sus2":"7sus2","Dom7 Sus2":"7sus2","Augmented Maj7th":"AugM7","Aug Maj7th":"AugM7","Minor Maj7th":"mM7","min Maj7th":"mM7","Diminished Maj7th":"dimM7","dim Maj7th":"dimM7"};if(a[n=n.replace(/[()]/g,"").trim()])n=a[n];else{for(let[e,t]of Object.entries(a))n=n.replace(e,t);n=n.trim()}return n||(n="Maj"),{type:n=n.replace(/half[\s-]*diminished[\s-]*7th/i,"Half-dim 7th"),inversion:t}},u=e=>{let{chordOptions:t,handleAnswer:n,disabled:u=!1}=e,m=(0,r.useRef)(0),p=t.length,x=(0,r.useCallback)(e=>{var t;return 2===p?0===e?"A":"D":(null===(t=o[e])||void 0===t?void 0:t.toUpperCase())||""},[p]);(0,r.useEffect)(()=>{if(u)return;let e=e=>{var a;let r=e.target,s=null==r?void 0:null===(a=r.tagName)||void 0===a?void 0:a.toLowerCase();if("input"===s||"textarea"===s||"select"===s||(null==r?void 0:r.isContentEditable)||document.querySelector('[role="dialog"], .modal, [data-state="open"][data-dialog]'))return;let i=performance.now();if(i-m.current<160)return;let l=e.key.toLowerCase(),d=-1;2===p?"a"===l||"arrowleft"===l?d=0:("d"===l||"arrowright"===l)&&(d=1):d=o.indexOf(l),-1!==d&&d<p&&(m.current=i,e.preventDefault(),n(t[d]))};return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[u,p,t,n]);let h=e=>{let{option:t,index:r,size:o="md"}=e;return(0,a.jsxs)("button",{onClick:()=>n(t),onPointerDown:()=>(0,i.jR)(),disabled:u,"aria-label":(0,l.BK)(t),className:"group relative mx-auto ".concat({lg:"w-[120px] h-[120px] sm:w-[150px] sm:h-[150px]",md:"w-[95px] h-[95px] sm:w-[115px] sm:h-[115px]",sm:"w-[70px] h-[70px] sm:w-[85px] sm:h-[85px]",xs:"w-[58px] h-[58px] sm:w-[70px] sm:h-[70px]"}[o],"\n disabled:opacity-50 disabled:cursor-not-allowed\n transition-transform duration-300 hover:scale-105 active:scale-95"),children:[(0,a.jsxs)("div",{className:"absolute inset-0 rounded-full bg-[#0a0a0a] shadow-[0_4px_20px_rgba(0,0,0,0.4),inset_0_1px_3px_rgba(0,0,0,0.6)] group-hover:shadow-[0_6px_25px_rgba(0,0,0,0.5),inset_0_1px_3px_rgba(0,0,0,0.6)] transition-all duration-300 overflow-hidden",children:[(0,a.jsx)("div",{className:"absolute inset-0 rounded-full",style:{background:"radial-gradient(circle at 50% 50%,\n transparent 0%,\n transparent 92%,\n rgba(40,40,40,0.5) 94%,\n rgba(60,60,60,0.3) 96%,\n rgba(20,20,20,0.8) 98%,\n rgba(10,10,10,1) 100%)"}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full",style:{background:"\n repeating-radial-gradient(circle at 50% 50%,\n #050505 0px,\n #0d0d0d 0.6px,\n #1a1a1a 0.9px,\n #121212 1.2px,\n #080808 1.5px,\n #050505 2px\n )\n "}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-70",style:{background:"repeating-radial-gradient(circle at 48% 52%,\
1n rgba(0,0,0,0.8) 0px,\n rgba(0,0,0,0.6) 0.5px,\n transparent 1px,\n rgba(80,80,80,0.3) 2px,\n rgba(30,30,30,0.4) 2.5px,\n transparent 3px,\n transparent 5px)"}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-25",style:{background:"repeating-radial-gradient(circle at 52% 48%,\n transparent 0px,\n rgba(255,255,255,0.04) 0.8px,\n transparent 1.2px,\n transparent 2px)"}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-40",style:{background:"conic-gradient(from 30deg, transparent 0%, rgba(255,255,255,0.12) 12%, transparent 20%, rgba(255,255,255,0.06) 45%, transparent 55%)"}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-35 mix-blend-overlay pointer-events-none",style:{backgroundImage:"url(\"data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E\")",backgroundSize:"100% 100%"}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-20 pointer-events-none",style:{background:"\n linear-gradient(23deg, transparent 0%, transparent 48%, rgba(255,255,255,0.03) 48.5%, transparent 49%),\n linear-gradient(78deg, transparent 0%, transparent 72%, rgba(255,255,255,0.02) 72.5%, transparent 73%),\n linear-gradient(156deg, transparent 0%, transparent 31%, rgba(255,255,255,0.025) 31.5%, transparent 32%),\n linear-gradient(234deg, transparent 0%, transparent 65%, rgba(0,0,0,0.15) 65.5%, transparent 66%)\n "}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-15 pointer-events-none",style:{background:"\n radial-gradient(ellipse 25% 20% at 35% 40%, rgba(0,0,0,0.2) 0%, transparent 60%),\n radial-gradient(ellipse 20% 25% at 68% 55%, rgba(0,0,0,0.15) 0%, transparent 50%)\n "}}),(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-30 pointer-events-none",style:{backgroundImage:"radial-gradient(circle at 22% 18%, rgba(180,180,180,0.4) 0.3px, transparent 0.3px),\n radial-gradient(circle at 67% 34%, rgba(200,200,200,0.3) 0.4px, transparent 0.4px),\n radial-gradient(circle at 45% 78%, rgba(190,190,190,0.35) 0.35px, transparent 0.35px),\n radial-gradient(circle at 83% 62%, rgba(180,180,180,0.3) 0.3px, transparent 0.3px)",backgroundSize:"100% 100%"}})]}),(0,a.jsxs)("div",{className:"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2\n ".concat({lg:"w-[32%] h-[32%]",md:"w-[30%] h-[30%]",sm:"w-[35%] h-[35%]",xs:"w-[38%] h-[38%]"}[o]," rounded-full\n flex flex-col items-center justify-center\n shadow-[0_2px_6px_rgba(0,0,0,0.3)]\n bg-gradient-to-br ").concat(d[r%d.length]),children:[(0,a.jsx)("div",{className:"absolute inset-0 rounded-full opacity-25",style:{background:"radial-gradient(circle at 35% 35%, rgba(255,255,255,0.4) 0%, transparent 40%)"}}),(0,a.jsx)("div",{className:"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-1 h-1 sm:w-1.5 sm:h-1.5 rounded-full bg-[#111]"})]}),(()=>{let{type:e,inversion:n}=c(t),s=n?"".concat(e," ").concat(n," inv"):e,i={xs:{mobile:10,desktop:11},sm:{mobile:12,desktop:11},md:{mobile:10,desktop:12},lg:{mobile:12,desktop:14}},l=i[o].mobile,d=i[o].desktop,u="chord-".concat(r,"-").concat(e.replace(/\s/g,""));return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsxs)("svg",{className:"absolute inset-0 z-10 w-full h-full sm:hidden pointer-events-none",viewBox:"0 0 100 100",style:{transform:"rotate(-90deg)"},children:[(0,a.jsx)("defs",{children:(0,a.jsx)("path",{id:"".concat(u,"-vinyl-m"),d:"M 50,".concat(18," A ").concat(32,",").concat(32," 0 1,1 49.99,").concat(18),fill:"none"})}),(0,a.jsx)("text",{fill:"white",fontWeight:"bold",fontSize:l,style:{filter:"drop-shadow(0 1px 2px rgba(0,0,0,0.8))"},children:(0,a.jsx)("textPath",{href:"#".concat(u,"-vinyl-m"),startOffset:"25%",textAnchor:"middle",dy:"4",children:s})})]}),(0,a.jsxs)("svg",{className:"absolute inset-0 z-10 w-full h-full hidden sm:block pointer-events-none",viewBox:"0 0 100 100",style:{transform:"rotate(-90deg)"},children:[(0,a.jsx)("defs",{children:(0,a.jsx)("path",{id:"".concat(u,"-vinyl-d"),d:"M 50,".concat(18," A ").concat(32,",").concat(32," 0 1,1 49.99,").concat(18),fill:"none"})}),(0,a.jsx)("text",{fill:"white",fontWeight:"bold",fontSize:d,style:{filter:"drop-shadow(0 1px 2px rgba(0,0,0,0.8))"},children:(0,a.jsx)("textPath",{href:"#".concat(u,"-vinyl-d"),startOffset:"25%",textAnchor:"middle",dy:"4",children:s})})]})]})})(),"sm"!==o&&"xs"!==o&&(0,a.jsx)(s.u,{className:"absolute bottom-1 left-1/2 -translate-x-1/2 z-10 hidden sm:inline-flex bg-black/40 border-white/20 text-white/80 text-[8px]",children:2===p?0===r?"â":"â":x(r)})]})};if(2===p)return(0,a.jsx)("div",{className:"w-full max-w-md mx-auto px-3",children:(0,a.jsx)("div",{className:"grid grid-cols-2 gap-4 sm:gap-6",children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"lg"},e))})});if(3===p)return(0,a.jsx)("div",{className:"w-full max-w-xs sm:max-w-sm mx-auto px-3",children:(0,a.jsxs)("div",{className:"flex flex-col items-center gap-3 sm:gap-4",children:[(0,a.jsx)(h,{option:t[0],index:0,size:"md"}),(0,a.jsx)("div",{className:"flex gap-3 sm:gap-4",children:t.slice(1).map((e,t)=>(0,a.jsx)(h,{option:e,index:t+1,size:"md"},e))})]})});if(4===p)return(0,a.jsx)("div",{className:"w-full max-w-xs sm:max-w-sm mx-auto px-3",children:(0,a.jsx)("div",{className:"grid grid-cols-2 gap-3 sm:gap-4",children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"md"},e))})});if(p<=6)return(0,a.jsx)("div",{className:"w-full max-w-sm sm:max-w-md mx-auto px-2",children:(0,a.jsx)("div",{className:"grid grid-cols-3 gap-2 sm:gap-3",children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"sm"},e))})});if(p<=9)return(0,a.jsx)("div",{className:"w-full max-w-sm sm:max-w-md mx-auto px-2",children:(0,a.jsx)("div",{className:"grid grid-cols-4 sm:grid-cols-3 gap-2 sm:gap-3",children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"xs"},e))})});if(p<=12){let e=Math.ceil(p/4);
1return(0,a.jsx)("div",{className:"w-full max-w-md sm:max-w-lg mx-auto px-2",children:(0,a.jsx)("div",{className:"grid gap-1 sm:gap-2",style:{gridTemplateRows:"repeat(".concat(e,", 1fr)"),gridAutoFlow:"column",gridTemplateColumns:"repeat(4, 1fr)"},children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"sm"},e))})})}return(0,a.jsx)("div",{className:"w-full max-w-md sm:max-w-lg mx-auto px-1",children:(0,a.jsx)("div",{className:"grid grid-cols-5 sm:grid-cols-4 gap-1",children:t.map((e,t)=>(0,a.jsx)(h,{option:e,index:t,size:"xs"},e))})})}},60310:(e,t,n)=>{n.r(t),n.d(t,{default:()=>k});var a=n(95155),r=n(12115),s=n(43226),i=n(11536),l=n(35462),o=n(19507),d=n(89227),c=n(56114);let u=e=>{let{notes:t,showChord:n=!0,explicitNoteNames:s}=e,i=(0,r.useRef)(null),l=(0,r.useRef)(null),[o,d]=(0,r.useState)(400),u=(0,r.useCallback)(e=>{let t=Math.floor(e/12)-1;return"".concat(["c","c#","d","d#","e","f","f#","g","g#","a","a#","b"][e%12],"/").concat(t)},[]);return(0,r.useEffect)(()=>{let e=()=>{l.current&&d(Math.max(280,Math.min(l.current.clientWidth,500)))};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]),(0,r.useEffect)(()=>{let e;if(!i.current)return;let a=i.current;a.innerHTML="";let r=new c.Renderer(a,c.Renderer.Backends.SVG);r.resize(o,150);let l=r.getContext();l.setFillStyle("black"),l.setStrokeStyle("black");let d=t.filter(e=>void 0!==e);if(0===d.length){new c.Stave(10,40,o-20).addClef("treble").setContext(l).draw();return}let m=d.map(e=>({...e,midi:e.midi})),p=60>Math.min(...m.map(e=>e.midi))?"bass":"treble",x=new c.Stave(20,40,o-40);x.addClef(p).setContext(l).draw();let h=[],g=n?m.length:1;e=s&&s.length>=g?n?s:[s[0]]:(n?m:[m[0]]).map(e=>u(e.midi));let f=new c.StaveNote({clef:p,keys:e,duration:"w"});e.forEach((e,t)=>{let n=e.split("/")[0];n.includes("##")?f.addModifier(new c.Accidental("##"),t):n.length>2&&n.endsWith("bb")?f.addModifier(new c.Accidental("bb"),t):n.includes("#")?f.addModifier(new c.Accidental("#"),t):n.length>1&&n.endsWith("b")&&f.addModifier(new c.Accidental("b"),t)}),h=[f];let v=new c.Voice({num_beats:4,beat_value:4});v.addTickables(h),new c.Formatter().joinVoices([v]).format([v],o-80),v.draw(l,x)},[t,n,s,u,o]),(0,a.jsx)("div",{ref:l,className:"flex justify-center items-center h-[180px] w-full",children:(0,a.jsx)("div",{ref:i,className:"bg-white rounded-lg overflow-hidden",style:{width:"".concat(o,"px"),height:"150px",maxWidth:"100%"}})})};var m=n(46620),p=n(86877),x=n(89555),h=n(51569),g=n(75556),f=n(81798),v=n(85095),b=n(68174),w=n(13374),j=n(73616),y=n(21567),N=n(19966);let k=e=>{let{settings:t,onBackToSettings:n,hideBackButton:c=!1,hideKeyboardHints:k=!1,onAnswerResult:M,shouldAutoAdvance:S}=e,[C,A]=(0,r.useState)(null),[D,E]=(0,r.useState)(!1),[R,I]=(0,r.useState)(!1),[_,T]=(0,r.useState)(!1),[z,L]=(0,r.useState)(null),[F,P]=(0,r.useState)(null),[H,O]=(0,r.useState)(null),[B,J]=(0,r.useState)(!1),[W,q]=(0,r.useState)(!1),[U,V]=(0,r.useState)(!1),[$,G]=(0,r.useState)([]),[K,Q]=(0,r.useState)("harmonic"),X=(0,r.useRef)("harmonic");(0,r.useEffect)(()=>{X.current=K},[K]);let Y=(0,r.useRef)(null),Z=(0,r.useRef)(null),ee=(0,r.useRef)(!0),et=(0,r.useRef)(!1),en=(0,r.useRef)(null),ea=(0,r.useMemo)(()=>t.selectedChords?[...t.selectedChords].sort((e,t)=>Object.keys(x.a2).indexOf(e)-Object.keys(x.a2).indexOf(t)).flatMap(e=>{var n;let a=[{chordType:e,inversion:0,label:null!==(n=x.a2[e])&&void 0!==n?n:e}];return t.includeInversions&&(x.wl.has(e)?a.push({chordType:e,inversion:1,label:"".concat(x.a2[e]," (1st Inv)")},{chordType:e,inversion:2,label:"".concat(x.a2[e]," (2nd Inv)")}):x.zO.has(e)&&a.push({chordType:e,inversion:1,label:"".concat(x.a2[e]," (1st Inv)")},{chordType:e,inversion:2,label:"".concat(x.a2[e]," (2nd Inv)")},{chordType:e,inversion:3,label:"".concat(x.a2[e]," (3rd Inv)")})),a}):[],[t.selectedChords,t.includeInversions]),er=(0,r.useMemo)(()=>{let e=new Map;return ea.forEach(t=>e.set(t.label,t)),e},[ea]),es=(0,r.useMemo)(()=>ea.map(e=>e.label),[ea]),ei=(0,r.useCallback)(e=>{var t,n,a,r;if(!e||0===e.notes.length)return"";let s=e.notes.map(e=>e.split("/")[0]),i=s.length,l=null!==(n=e.inversion)&&void 0!==n?n:0,o=null!==(a=s[((i-l)%i+i)%i])&&void 0!==a?a:"",d=o.charAt(0).toUpperCase()+o.slice(1),c=(null===(t=e.typeName)||void 0===t?void 0:t.trim())?e.typeName:e.type,u=l>0?null!==(r=["Root position","1st inversion","2nd inversion","3rd inversion"][l])&&void 0!==r?r:"".concat(l,"th inversion"):"";return u?"".concat(d," ").concat(c," (").concat(u,")"):"".concat(d," ").concat(c)},[]),el=(0,r.useCallback)(e=>{var t,n,a;if(!e)return"";let r=(null===(t=e.typeName)||void 0===t?void 0:t.trim())?e.typeName:e.type,s=null!==(n=e.inversion)&&void 0!==n?n:0,i=s>0?null!==(a=["Root position","1st inversion","2nd inversion","3rd inversion"][s])&&void 0!==a?a:"".concat(s,"th inversion"):"";return i?"".concat(r," (").concat(i,")"):r},[]);(0,r.useEffect)(()=>()=>{ee.current=!1,en.current&&clearTimeout(en.current)},[]),(0,r.useEffect)(()=>{let e=!1;return(async()=>{try{if(await d.JD.waitForLoad(),e)return;
1Y.current=new g.Howl({src:["/sounds/correct.mp3"],volume:.2,html5:!1}),Z.current=new g.Howl({src:["/sounds/wrong.mp3"],volume:.2,html5:!1}),I(!0)}catch(e){}})(),()=>{e=!0,d.JD.stopAllSounds(),Y.current&&Y.current.unload(),Z.current&&Z.current.unload()}},[]);let eo=(0,r.useCallback)(async()=>{if(!t.selectedChords||0===t.selectedChords.length)return;if(en.current&&(clearTimeout(en.current),en.current=null),E(!1),L(null),P(null),O(null),q(!1),V(!1),et.current){try{d.JD.stopAllSounds()}catch(e){}et.current=!1,T(!1)}let e=(0,v.kE)(t.selectedChords,t.includeInversions);A(e),R&&(et.current=!0,T(!0),J(!1),setTimeout(()=>{if(!ee.current)return;let t=e.notes.map(e=>{let[t,n]=e.split("/");return t.charAt(0).toUpperCase()+t.slice(1)+n}),n=X.current;d.JD.playExerciseSequence(t,"harmonic"===n,200),setTimeout(()=>{ee.current&&(T(!1),et.current=!1)},"arpeggio"===n?1e3+200*t.length:1e3)},50))},[t.selectedChords,t.includeInversions,R]),ed=(0,r.useCallback)(()=>{ee.current&&(en.current&&(clearTimeout(en.current),en.current=null),q(!1),V(!1),d.JD.stopAllSounds(),et.current=!1,T(!1),eo())},[eo]),ec=(0,r.useRef)(S);ec.current=S;let eu=(0,r.useCallback)(e=>{en.current&&clearTimeout(en.current),en.current=setTimeout(()=>{(!ec.current||ec.current())&&ed()},e)},[ed]),em=(0,r.useCallback)(()=>{if(!R||et.current||!C)return;et.current=!0,T(!0);let e=C.notes.map(e=>{let[t,n]=e.split("/");return t.charAt(0).toUpperCase()+t.slice(1)+n}),t="harmonic"===K;d.JD.playExerciseSequence(e,t,200);let n=setTimeout(()=>{ee.current&&(T(!1),et.current=!1)},"arpeggio"===K?1e3+200*e.length:1e3);return()=>clearTimeout(n)},[C,R,K]);(0,h.B)({onSpacebar:em,disabled:!R||_});let ep=(0,r.useCallback)(e=>{var t,n;if(!C||!ee.current||B)return;J(!0);let a=e.chordType===C.type&&e.inversion===C.inversion;null==M||M({isCorrect:a,item:C.type,answer:e.chordType});let r=e.label,s=ei(C),i=el(C);L(a?"Correct!":"Not quite."),P(a?"correct":"wrong"),O(s),E(!0),q(!0),V(!a),G(e=>{let t=[...e,{id:"".concat(Date.now(),"-").concat(Math.random().toString(36).slice(2,8)),label:r,correctLabel:a?void 0:i,result:a?"correct":"wrong"}];return t.length>10?t.slice(-10):t}),a?((0,N.Ac)(),null===(t=Y.current)||void 0===t||t.play(),(0,j.ly)()?eu(1200):V(!0)):((0,N.Rm)(),null===(n=Z.current)||void 0===n||n.play())},[C,B,ei,el,eu,M]),ex=(0,r.useCallback)(()=>{var e;if(!C||!ee.current||B)return;J(!0),(0,N.Rm)(),null===(e=Z.current)||void 0===e||e.play();let t=ei(C),n=el(C);L("Revealed"),P("wrong"),O(t),E(!0),q(!0),V(!0),G(e=>{let t=[...e,{id:"".concat(Date.now(),"-").concat(Math.random().toString(36).slice(2,8)),label:"Revealed",correctLabel:n,result:"wrong"}];return t.length>10?t.slice(-10):t})},[C,B,ei,el]),eh=(0,r.useCallback)(e=>{let t=er.get(e);t&&ep(t)},[er,ep]);(0,r.useEffect)(()=>{if(!W)return;let e=e=>{"Enter"===e.key&&(e.preventDefault(),ed())};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[W,ed]),(0,r.useEffect)(()=>{R&&t.selectedChords.length>0&&!C&&eo()},[R,t.selectedChords.length]);let eg=(null==C?void 0:C.notes.map(e=>{let[t,n]=e.split("/");return{midi:f.L7.midi("".concat(t).concat(n))||60,duration:"w"}}))||[],ef=(null==C?void 0:C.notes)||[];return R?(0,a.jsxs)("div",{className:"relative w-full px-2 sm:px-6",children:[(0,a.jsxs)("div",{className:"mx-auto flex w-full max-w-xl flex-col gap-4 sm:gap-6",children:[(0,a.jsx)("div",{className:"h-[180px]",children:R&&C?(0,a.jsx)(u,{notes:eg,showChord:D,explicitNoteNames:ef}):(0,a.jsx)("div",{className:"flex h-full items-center justify-center text-sm text-muted-foreground",children:R?"Preparing the next chordâ¦":"Initializing audioâ¦"})}),(0,a.jsx)(p.A,{items:$,placeholder:"Answer history will appear here once you start guessing"}),(0,a.jsx)("div",{className:"flex min-h-[44px] sm:min-h-[60px] flex-col items-center justify-center text-center","aria-live":"polite",children:z?(0,a.jsxs)("div",{className:(0,y.cn)("flex flex-col items-center gap-0.5 sm:gap-1","correct"===F?"text-primary":"text-destructive"),children:[(0,a.jsx)("div",{className:"text-base sm:text-lg font-semibold",children:z}),H&&(0,a.jsxs)("div",{className:"text-sm text-muted-foreground",children:["wrong"===F?"Correct answer:":"Answer:"," ",H]})]}):(0,a.jsx)("div",{className:"text-center text-xs uppercase tracking-[0.3em] text-muted-foreground
1/70",children:"Trust your earsâyour answer summary shows up here"})}),(0,a.jsx)(m.A,{chordOptions:es,handleAnswer:eh,disabled:!R||B||0===es.length}),(0,a.jsxs)("div",{children:[(0,a.jsxs)("div",{className:"flex flex-wrap justify-center gap-2 sm:gap-4",children:[(0,a.jsxs)(s.$,{onClick:em,variant:"secondary",className:"flex items-center gap-1.5 sm:gap-2 h-9 sm:h-10 px-3 sm:px-4",disabled:!R||!C||_,"aria-label":(0,l.M6)().listenAgain,children:[(0,a.jsx)(i.Swo,{className:"text-xs sm:text-sm"})," Repeat"]}),(0,a.jsxs)(s.$,{onClick:ex,variant:"secondary",className:"flex items-center gap-1.5 sm:gap-2 h-9 sm:h-10 px-3 sm:px-4",disabled:!R||!C||B,"aria-label":(0,l.M6)().reveal,children:[(0,a.jsx)(i.Ny1,{className:"text-xs sm:text-sm"})," Reveal Answer"]}),(0,a.jsx)(s.$,{onClick:()=>Q("harmonic"===K?"arpeggio":"harmonic"),variant:"arpeggio"===K?"default":"secondary",className:"flex items-center gap-1.5 sm:gap-2 h-9 sm:h-10 px-3 sm:px-4",disabled:!R||_,title:"harmonic"===K?"Switch to arpeggio playback":"Switch to harmonic playback","aria-label":"harmonic"===K?(0,l.M6)().modeArpeggio:(0,l.M6)().modeHarmonic,children:"harmonic"===K?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(o.wyI,{className:"text-xs sm:text-sm"})," Harmonic"]}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(i.BHn,{className:"text-xs sm:text-sm"})," Arpeggio"]})}),!c&&(0,a.jsxs)(s.$,{onClick:n,variant:"secondary",className:"hidden sm:flex items-center gap-2",children:[(0,a.jsx)(i.QVr,{className:"text-sm"})," Back to Settings"]})]}),(0,a.jsx)("div",{className:"mt-3 flex justify-center",children:(0,a.jsx)(w.A,{})}),!k&&(0,a.jsxs)("div",{className:"hidden sm:block mt-4 text-center text-xs text-muted-foreground",children:["Press ",(0,a.jsx)("kbd",{className:"rounded bg-muted px-2 py-1",children:"Space"})," to repeat â¢",(0,a.jsx)("span",{className:"mx-1"}),"Press ",(0,a.jsx)("kbd",{className:"rounded bg-muted px-2 py-1",children:"Enter"})," for the next prompt"]})]})]}),(0,a.jsx)(b.A,{open:W&&U,title:"correct"===F?"Correct!":"Revealed"===z?"Answer: ".concat(null!=H?H:""):H?"Correct answer: ".concat(H):void 0,message:"correct"===F?"Take a moment to absorb. Tap Next when you're ready.":"Revealed"===z?"Listen again or move to the next chord.":"Listen again, or continue when you are ready.",variant:"correct"===F?"correct":"wrong"===F?"wrong":"neutral",onRepeat:em,onNext:ed,withinParent:!0})]}):(0,a.jsx)("div",{className:"flex items-center justify-center min-h-[400px]",children:(0,a.jsxs)("div",{className:"flex flex-col items-center space-y-4",children:[(0,a.jsx)("div",{className:"w-8 h-8 border-4 border-primary border-t-transparent rounded-full animate-spin"}),(0,a.jsx)("div",{className:"text-lg font-medium text-muted-foreground",children:"Initializing audio..."})]})})}}}]);
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.