https://smartmaths.ai/assets/MiaLabScreen-soHhDFtK.js

1import{C as _,W as H,H as W,T as q,p as oe,q as D,t as B,j as e,M as h,r as n,E as ie,G as le,w as re,h as ce}from"./main-Dt7Bgl8i.js";import"./curriculum-data-UeTaQjv3.js";import"./worked-examples-BExh4ce1.js";const P=[{caption:"Session starts — Mia says hello with a wiggle",mood:"idle",gesture:"greet",line:D("Addition & Subtraction"),holdMs:1200},{caption:"The child reads the question — Mia waits, glancing between them and the card",mood:"idle",expression:"neutral",attention:"question",holdMs:5e3},{caption:"The child starts typing — a quick look at the card, a small nod",mood:"idle",gesture:"glance",attention:"question",holdMs:2600},{caption:"Wrong answer — warmth, never a frown (calm-maths tone)",mood:"encouraging",expression:"encourage",line:H[0],holdMs:1800},{caption:"The child taps Hint — an idea!",mood:"hint",expression:"idea",line:`${W[0]} Count on from the bigger number.`,holdMs:1800},{caption:"AI explanation on its way — Mia thinks (thought bubbles)",mood:"thinking",expression:"thinking",line:q,holdMs:3200},{caption:"Now she explains (sample line, not in the script)",mood:"encouraging",expression:"encourage",line:"Start at 8, the bigger number. Then count on 5 more: 9, 10, 11, 12, 13. So 8 add 5 is 13.",holdMs:1400},{caption:"Correct! — happy eyes, a bounce and sparkles",mood:"happy",expression:"cheer",line:_[0],holdMs:2200},{caption:"Question saved for later — a nod",mood:"idle",gesture:"nod",line:oe[0],holdMs:1400},{caption:"Nothing happens for a while… Mia dozes off",mood:"idle",expression:"sleepy",holdMs:4500},{caption:"…the child is back — she wakes with a shake (sample line, not in the script)",mood:"idle",expression:"neutral",gesture:"shake",line:"Oh — hello again! Ready when you are.",holdMs:1600},{caption:"Session complete",mood:"happy",expression:"cheer",line:B(80),holdMs:3e3}],G=[{label:"Session start",text:D("Number & Place Value")},{label:"Correct (first try)",text:_[2]},{label:"Wrong (first try)",text:H[1]},{label:"Hint intro",text:`${W[1]} Look at the tens first.`},{label:"Thinking",text:q},{label:"Session complete",text:B(60)},{label:"Longer explanation",text:"Let's look at it together. 47 is 4 tens and 7 ones. Adding 30 is adding 3 tens, so the ones stay the same. 4 tens and 3 tens make 7 tens. That's 77."}];function me(a){return Math.max(1200,Math.min(12e3,a.length*58))}function ue({mood:a,expression:l,speaking:p,cue:r,line:c,variant:b,reducedMotion:S}){const m={mood:a,speaking:p,cue:r,variant:b,reducedMotion:S,animated:!0,autoSleepMs:null},o=l?{...m,expression:l}:m;return e.jsxs("section",{className:"mlab-contexts","aria-label":"Mia in context",children:[e.jsxs("div",{className:"mlab-context",children:[e.jsx("span",{className:"mlab-context-tag",children:"Session side pane · 64px"}),e.jsxs("div",{className:"sm-tutor-block mlab-session-pane",children:[e.jsxs("div",{className:"sm-tutor-head",children:[e.jsx(h,{...o,size:64,lookAt:{x:-.75,y:.15}}),e.jsxs("div",{children:[e.jsx("b",{children:"Mia"}),e.jsx("span",{children:"Your tutor"})]})]}),c&&e.jsx("div",{className:`sm-tutor-msg tone-${de(a)}`,children:c})]})]}),e.jsxs("div",{className:"mlab-context",children:[e.jsx("span",{className:"mlab-context-tag",children:"Home card · 150px"}),e.jsxs("div",{className:"sm-tutor-card mlab-home-card",children:[e.jsx("span",{className:"sm-tutor-name",children:"Hi, I'm Mia · your tutor"}),e.jsx(h,{...o,size:150}),e.jsxs("p",{className:"sm-tutor-line",children:[`"Let's start with the `,e.jsx("em",{children:"easy ones"}),' and warm up the brain."']})]})]}),e.jsxs("div",{className:"mlab-context",children:[e.jsx("span",{className:"mlab-context-tag",children:"Summary · 88px"}),e.jsxs("div",{className:"sm-summary-tutor mlab-summary",children:[e.jsx(h,{...o,size:88}),e.jsx("div",{className:"sm-summary-tutor-msg",children:"Good session. Three more than last time."})]})]}),e.jsxs("div",{className:"mlab-context",children:[e.jsx("span",{className:"mlab-context-tag",children:"Today's static Mia · 120px"}),e.jsx("div",{className:"mlab-static",children:e.jsx(h,{animated:!1,mood:a,size:120})})]})]})}function de(a){return a==="happy"?"happy":a==="encouraging"?"gentle":a==="hint"?"hint":"neutral"}

1const O={neutral:"Attentive",listen:"Listening",thinking:"Thinking",idea:"Idea (hint)",encourage:"Encourage",cheer:"Cheer",wow:"Wow",greet:"Greet",sleepy:"Sleepy"},$={nod:"Nod",bounce:"Bounce",wiggle:"Wiggle",hop:"Hop",shake:"Shake",wink:"Wink",glance:"Glance at the work",wow:"Wow!",smile:"Smile"},he=[64,88,150,240];function fe({onBackHome:a}){const[l,p]=n.useState("neutral"),[r,c]=n.useState("idle"),[b,S]=n.useState(null),[m,o]=n.useState(!1),[N,x]=n.useState(""),[F,y]=n.useState("Tap an expression, play the story, or make her talk."),[E,U]=n.useState(240),[g,V]=n.useState({tuft:!1}),[k,X]=n.useState(!1),[Y,M]=n.useState(null),[f,Q]=n.useState(!1),[j,K]=n.useState(8e3),[Z,J]=n.useState(null),[R,ee]=n.useState(""),[L,te]=n.useState(G[0].text),w=n.useRef(null),z=n.useRef(0),u=n.useRef(0),v=n.useRef(null),d=n.useCallback(()=>{w.current?.cancel(),w.current=null,window.clearTimeout(z.current),o(!1)},[]);n.useEffect(()=>()=>{d(),u.current+=1},[d]);const A=t=>S({gesture:t,at:Date.now()}),T=(t,s,i)=>{p(t),c(s),i&&y(i)},C=(t,s=!1)=>new Promise(i=>{if(d(),x(t),o(!0),s||!re()){z.current=window.setTimeout(()=>{o(!1),i()},me(t));return}w.current=ce(t,{onEnd:()=>{o(!1),i()},onStop:()=>{o(!1),i()},onError:()=>{o(!1),i()}})}),se=async()=>{const t=++u.current;for(const s of P){if(t!==u.current)return;y(s.caption),c(s.mood),s.expression&&p(s.expression),s.gesture&&A(s.gesture),J(s.attention==="question"?{x:-.75,y:.15}:null),s.line&&await C(s.line),await new Promise(i=>setTimeout(i,s.holdMs))}t===u.current&&(y("The end — tap anything to keep playing."),x(""),T("neutral","idle"))},ne=t=>{if(!k||!v.current)return;const s=v.current.querySelector(".sm-mia")?.getBoundingClientRect();s&&M({x:Math.max(-1,Math.min(1,(t.clientX-(s.left+s.width/2))/(s.width*.9))),y:Math.max(-1,Math.min(1,(t.clientY-(s.top+s.height/2))/(s.height*.9)))})},I=()=>R.trim()||L,ae={animated:!0,mood:r,expression:l,speaking:m,cue:b,variant:g,reducedMotion:f,lookAt:Z,gazeLock:Y,autoSleepMs:j};return e.jsxs("div",{className:"mlab-screen",children:[e.jsxs("header",{className:"mlab-header",children:[e.jsx("button",{type:"button",className:"mlab-back",onClick:a,children:"← Back"}),e.jsx("h1",{children:"Mia lab · animated tutor prototype"}),e.jsx("a",{className:"mlab-link",href:"/?mia=on",children:"Open the app →"})]}),e.jsxs("main",{className:"mlab-main",children:[e.jsxs("section",{className:"mlab-stage-col",children:[e.jsxs("div",{ref:v,className:"mlab-stage",onPointerMove:ne,onPointerLeave:()=>M(null),children:[e.jsx(h,{...ae,size:E}),N&&e.jsx("div",{className:`mlab-bubble tone-${r}`,children:N})]}),e.jsx("p",{className:"mlab-caption","aria-live":"polite",children:F}),e.jsxs("div",{className:"mlab-group",children:[e.jsx("h3",{children:"Expressions"}),Object.keys(ie).map(t=>e.jsx("button",{type:"button",className:`mlab-btn${l===t?" is-on":""}`,onClick:()=>T(t,pe(t),`${O[t]} — ${P.find(s=>s.expression===t)?.caption??""}`),children:O[t]},t))]}),e.jsxs("div",{className:"mlab-group",children:[e.jsx("h3",{children:"Gestures (one-shot, on top of the expression)"}),Object.keys(le).filter(t=>$[t]).map(t=>e.jsx("button",{type:"button",className:"mlab-btn mlab-btn-soft",onClick:()=>A(t),children:$[t]},t))]})]}),e.jsxs("aside",{className:"mlab-side",children:[e.jsxs("div",{className:"mlab-group",children:[e.jsx("h3",{children:"Talking"}),e.jsx("select",{className:"mlab-select",value:L,onChange:t=>te(t.target.value),children:G.map(t=>e.jsx("option",{value:t.text,children:t.label},t.label))}),e.jsx("input",{className:"mlab-input",placeholder:"…or type a line",value:R,onChange:t=>ee(t.target.value)}),e.jsx("button",{type:"button",className:"mlab-btn",onClick:()=>{C(I())},children:"Say it (app voice)"}),e.jsx("button",{type:"button",className:"mlab-btn",onClick:()=>{C(I(),!0)},children:"Mime it (no sound)"}),e.jsx("button",{type:"button",className:"mlab-btn mlab-btn-soft",onClick:()=>{d(),x("")},children:"Stop"})]}),e.jsxs("div",{className:"mlab-group",children:[e.jsx("h3",{children:"Character & options"}),e.jsx("button",{type:"button",className:`mlab-btn mlab-btn-soft${g.tuft?" is-on":""}`,onClick:()=>V({tuft:!g.tuft}),children:"Hair tuft"}),e.jsx("button",{type:"button",className:`mlab-btn mlab-btn-soft${k?" is-on":""}`,onClick:()=>{X(!k),M(null)},children:"Eyes follow my pointer"}),e.jsx("button",{type:"button",className:`mlab-btn mlab-btn-soft${f?" is-on":""}`,onClick:()=>Q(!f),children:"Reduced motion"}),e.jsx("button",{type:"button",className:`mlab-btn mlab-btn-soft${j===8e3?" is-on":""}`,onClick:()=>

1K(j===8e3?6e4:8e3),children:j===8e3?"Dozes after 8 s (demo)":"Dozes after 60 s (app)"}),e.jsx("div",{className:"mlab-sizes",children:he.map(t=>e.jsxs("button",{type:"button",className:`mlab-btn mlab-btn-soft${E===t?" is-on":""}`,onClick:()=>U(t),children:[t,"px"]},t))})]}),e.jsxs("div",{className:"mlab-group",children:[e.jsx("h3",{children:"Play a whole session (about a minute)"}),e.jsx("button",{type:"button",className:"mlab-btn mlab-btn-primary",onClick:()=>{se()},children:"▶ Play the story"}),e.jsx("button",{type:"button",className:"mlab-btn mlab-btn-soft",onClick:()=>{u.current+=1,d(),x(""),T("neutral","idle","Stopped.")},children:"Stop"})]})]})]}),e.jsx(ue,{mood:r,expression:l,speaking:m,cue:b,line:N,variant:g,reducedMotion:f})]})}function pe(a){return a==="cheer"||a==="wow"||a==="greet"?"happy":a==="encourage"?"encouraging":a==="thinking"?"thinking":a==="idea"?"hint":"idle"}export{fe as MiaLabScreen};