@tinyweb_dev/oe-exam-sdk 0.1.3 → 0.1.5

package/dist/components/exams/take/components/question-renderers/MoversLabelThePictureRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{useState as a}from"react";import{ZoomIn as o,Check as s,X as l}from"lucide-react";import{ResolvedImage as n}from"../../../../../components/common/ResolvedImage";import i from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import d from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";function c({imageUrl:s}){const[l,i]=a(!1);return r(t,{children:[r("div",{className:"relative flex items-center justify-center",children:[e(n,{src:s,alt:"Picture to label",className:"max-h-[350px] cursor-pointer rounded-lg object-contain shadow-md",onClick:()=>i(!0)}),e("button",{type:"button",onClick:()=>i(!0),className:"absolute right-2 top-2 rounded-full bg-white/80 p-1.5 shadow-md hover:bg-white","aria-label":"Zoom image",children:e(o,{className:"h-4 w-4 text-gray-600"})})]}),l&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/70",onClick:()=>i(!1),children:e(n,{src:s,alt:"Picture to label (zoomed)",className:"max-h-[90vh] max-w-[90vw] rounded-lg object-contain",showLoadingState:!1})})]})}function m({words:t,usedWords:a}){return r("div",{className:"rounded-lg border-2 border-purple-200 bg-purple-50 p-4",children:[e("p",{className:"mb-3 text-sm font-semibold text-purple-800",children:"Word Bank:"}),e("div",{className:"flex flex-wrap gap-2",children:t.map((r,t)=>{const o=a.has(r);return e("span",{className:"rounded-full px-3 py-1.5 text-sm font-medium "+(o?"bg-gray-200 text-gray-400 line-through":"bg-white text-purple-700 shadow-sm"),children:r},t)})})]})}function u({label:t,value:a,onChange:o,isReviewMode:n,wordBank:i}){const d=t.isPreFilled,c=n&&(d||a.toLowerCase()===t.correctAnswer?.toLowerCase()),m=n&&!d&&a&&a.toLowerCase()!==t.correctAnswer?.toLowerCase(),u=n&&!d&&!a;return r("div",{className:"flex items-center gap-3",children:[e("span",{className:"flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full text-sm font-bold text-white "+(d?"bg-green-500":"bg-blue-500"),children:t.number}),r("div",{className:"relative flex-1 rounded-lg border-2 "+(n?d||c?"border-green-500 bg-green-50":m?"border-red-500 bg-red-50":u?"border-blue-500 bg-blue-50":"border-gray-300":d?"border-gray-400 bg-gray-100":"border-gray-300 focus-within:border-blue-500"),children:[e("input",{type:"text",value:d||u?t.correctAnswer||"":a,onChange:e=>!n&&!d&&o(e.target.value),disabled:n||d,placeholder:"Type your answer...",className:"w-full rounded-lg bg-transparent px-3 py-2 text-sm outline-none disabled:cursor-default "+(d?"text-green-700 font-medium":u?"text-blue-600 font-medium":"text-gray-700"),list:`wordbank-${t.id}`}),e("datalist",{id:`wordbank-${t.id}`,children:i.map((r,t)=>e("option",{value:r},t))}),n&&c&&e("span",{className:"absolute right-2 top-1/2 -translate-y-1/2",children:e(s,{className:"h-5 w-5 text-green-500"})}),n&&m&&e("span",{className:"absolute right-2 top-1/2 -translate-y-1/2",children:e(l,{className:"h-5 w-5 text-red-500"})})]}),n&&!d&&(m||u)&&t.correctAnswer&&r("span",{className:"text-sm font-medium text-blue-600",children:["→ ",t.correctAnswer]})]})}export function MoversLabelThePictureRenderer({partNumber:t,partName:a,questionCount:o,instruction:s,imageUrl:l,wordBank:n,labels:p,answers:g,onAnswerChange:b,isReviewMode:h=!1}){const w=new Set(Object.values(g).filter(Boolean).map(e=>"string"==typeof e?e.toLowerCase():"").filter(Boolean)),f=n.map(e=>e.toLowerCase()),x=new Set([...w].filter(e=>f.includes(e)));return r("div",{className:"grid h-full grid-cols-1 gap-4 sm:gap-6 "+(h?"":"lg:grid-cols-2"),children:[r("div",{className:"flex flex-col gap-4 overflow-y-auto p-3 sm:pb-6 sm:pr-6 sm:pt-6 lg:pr-6",children:[e(i,{partNumber:t,questionCount:o,partName:a,isReviewMode:h}),e(d,{instruction:s,isReviewMode:h}),e(c,{imageUrl:l}),e(m,{words:n,usedWords:new Set(n.filter(e=>x.has(e.toLowerCase())))})]}),e("div",{className:"flex flex-col gap-4 overflow-y-auto p-3 sm:pb-6 sm:pl-2 sm:pt-6",children:r("div",{className:"rounded-lg border border-gray-200 bg-white p-4 shadow-sm",children:[e("p",{className:"mb-4 text-sm font-semibold text-gray-700",children:"Write the correct word for each number:"}),e("div",{className:"flex flex-col gap-4",children:p.map(r=>e(u,{label:r,value:g[r.id]||"",onChange:e=>b(r.id,e),isReviewMode:h,wordBank:n},r.id))})]})})]})}

package/dist/components/exams/take/components/question-renderers/MoversListenAndWriteRenderer.d.ts

@@ -0,0 +1,21 @@
+import type { FillBlankQuestion } from '../../types';
+interface MoversListenAndWriteRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    imageUrl?: string;
+    audioUrl?: string;
+    title: string;
+    exampleText?: string;
+    exampleHighlight?: string;
+    questions: FillBlankQuestion[];
+    answers: Record<string, string>;
+    onAnswerChange: (questionId: string, value: string) => void;
+    isReviewMode?: boolean;
+    showHints?: boolean;
+    groupContent?: string;
+    groupTitle?: string;
+}
+export declare function MoversListenAndWriteRenderer({ partNumber, partName, questionCount, instruction, imageUrl, audioUrl, title, exampleText, exampleHighlight, questions, answers, onAnswerChange, isReviewMode, showHints, groupContent, groupTitle, }: MoversListenAndWriteRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversListenAndWriteRenderer.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{ResolvedImage as r}from"../../../../../components/common/ResolvedImage";import a from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import l from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";import s from"../../../../../components/themes/cambridge-yle/CambridgeYleAudioPlayer";import n from"../../../../../components/themes/cambridge-yle/CambridgeYleExampleText";export function MoversListenAndWriteRenderer({partNumber:o,partName:i,questionCount:c,instruction:m,imageUrl:d,audioUrl:p,title:x,exampleText:b,exampleHighlight:g,questions:h,answers:u,onAnswerChange:f,isReviewMode:N=!1,showHints:v=!1,groupContent:w,groupTitle:y}){const C=e=>{if(N){const t=h.find(t=>t.id===e),r=u[e]?.trim().toLowerCase(),a=t?.correctAnswer?.trim().toLowerCase();return r===a?"#22c55e":"#ef4444"}return"#9ca3af"},A=!!(p||d||w||b);return t("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar relative",children:[t("div",{className:"flex flex-col gap-2 sm:gap-3 p-3 sm:px-6 sm:pt-4",children:[e(a,{partNumber:o,questionCount:c,partName:i,isReviewMode:N}),e(l,{instruction:m,hasExample:!!b,isReviewMode:N})]}),A&&t("div",{className:"flex flex-col gap-2 sm:gap-3 p-3 sm:px-6 sm:pt-0 sticky top-0 z-20 bg-white/95 backdrop-blur pb-2 shadow-sm border-b border-gray-100",children:[p&&e(s,{audioSrc:p,compact:!0}),t("div",{className:"max-h-[35vh] overflow-y-auto custom-scrollbar pr-2 flex flex-col gap-3",children:[d&&e("div",{className:"flex items-center justify-center",children:e(r,{src:d,alt:"Shared illustration",className:"max-h-[200px] rounded-lg object-contain shadow-md"})}),w&&t("div",{className:"rounded-lg bg-amber-50 p-3 text-sm leading-relaxed text-gray-700 shadow-inner",children:[y&&e("h3",{className:"mb-2 font-semibold text-gray-800",children:y}),w]})]}),b&&e(n,{text:b,highlightedWord:g||""})]}),t("div",{className:"flex flex-col gap-4 p-3 sm:gap-6 sm:pb-6 sm:px-6",children:[e("h2",{className:"text-center text-3xl font-bold uppercase text-coral-500",children:x}),e("div",{className:"flex flex-col gap-4",children:h.map(a=>{const l=a.isExample||!1,s=N||l,n=l&&a.correctAnswer?a.correctAnswer:u[a.id]||"";return t("div",{id:`question-${a.id}`,className:"flex flex-col gap-2 "+(l?"rounded-lg border-2 border-orange-200 bg-orange-50 p-2":""),children:[a.imageUrl&&e("div",{className:"flex items-center justify-center",children:e(r,{src:a.imageUrl,alt:`Question ${a.questionNumber} illustration`,className:"max-h-[150px] rounded-lg object-contain shadow-md"})}),t("div",{className:"flex items-baseline gap-2",children:[e("span",{className:"flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full text-sm font-bold text-white "+(l?"bg-orange-400":"bg-blue-500"),children:a.questionNumber}),t("div",{className:"flex-1 text-base leading-relaxed text-gray-800",children:[a.textBefore&&e("span",{className:"mr-2",children:a.textBefore}),e("span",{className:"inline-block min-w-[120px]",style:{borderBottom:`2px solid ${l?"#fb923c":C(a.id)}`},children:e("input",{type:"text",value:n,onChange:e=>f(a.id,e.target.value),disabled:s,placeholder:"",className:"w-full bg-transparent text-center outline-none "+(l?"font-semibold text-orange-700 disabled:opacity-100":"disabled:opacity-60"),style:{border:"none",boxShadow:"none",appearance:"none",WebkitAppearance:"none"}})}),a.textAfter&&e("span",{className:"ml-2",children:a.textAfter}),l&&e("span",{className:"ml-2 rounded bg-orange-100 px-2 py-0.5 text-xs font-semibold text-orange-600",children:"Example"}),a.verbHint&&t("span",{className:"ml-2 italic text-gray-500",children:["(",a.verbHint,")"]}),v&&a.hints&&a.hints.length>0&&!N&&e("div",{className:"mt-2 flex flex-wrap gap-2",children:a.hints.map((t,r)=>e("button",{type:"button",onClick:()=>f(a.id,t),className:"rounded-full border border-blue-300 bg-blue-50 px-3 py-1 text-sm text-blue-700 transition-colors hover:bg-blue-100",children:t},r))}),N&&a.correctAnswer&&e("div",{className:"mt-1 text-sm",children:t("span",{className:"font-semibold text-green-600",children:["Đáp án đúng: ",a.correctAnswer]})})]})]})]},a.id)})})]})]})}

package/dist/components/exams/take/components/question-renderers/MoversMatchByWritingAnswerRenderer.d.ts

@@ -0,0 +1,19 @@
+import type { MatchByWritingAnswerQuestion, MatchByWritingAnswerOption } from '../../utils/question-transformers';
+interface MoversMatchByWritingAnswerRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    audioUrl?: string;
+    options: MatchByWritingAnswerOption[];
+    questions: MatchByWritingAnswerQuestion[];
+    answers: Record<string, string>;
+    onAnswerChange: (questionId: string, value: string) => void;
+    isReviewMode?: boolean;
+    viewMode?: 'DEFAULT' | 'CONVERSATION';
+    groupImageUrl?: string;
+    correctAnswerTextMap?: Record<string, string>;
+    isCorrectMap?: Record<string, boolean | null>;
+}
+export declare function MoversMatchByWritingAnswerRenderer({ partNumber, partName, questionCount, instruction, audioUrl, options, questions, answers, onAnswerChange, isReviewMode, viewMode, groupImageUrl, correctAnswerTextMap, isCorrectMap, }: MoversMatchByWritingAnswerRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversMatchByWritingAnswerRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import{Check as s,ChevronDown as a,X as n}from"lucide-react";import{ResolvedImage as i}from"../../../../../components/common/ResolvedImage";import o from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import l from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";import d from"../../../../../components/themes/cambridge-yle/CambridgeYleAudioPlayer";function c({opt:s,isUsed:a}){const n=Boolean(s.imageUrl?.trim()),o=Boolean(s.content?.trim()),l=!n&&!o,d=o?s.content:s.answer;return l?e("div",{className:["group relative flex min-h-[56px] items-center rounded-xl border-2 px-4 py-3 shadow-sm transition-all duration-300",a?"border-emerald-400 bg-emerald-50/50 opacity-60 scale-[0.98] shadow-emerald-100/50":"border-slate-200 bg-white hover:border-indigo-300 hover:shadow-md hover:shadow-indigo-100/50"].join(" "),children:e("span",{className:"min-w-0 flex-1 text-sm font-semibold leading-snug break-words transition-colors "+(a?"text-emerald-700":"text-slate-700"),children:s.answer})}):t("div",{className:["group relative flex min-h-[180px] flex-col gap-3 rounded-2xl border-2 p-3 shadow-sm transition-all duration-300",a?"border-emerald-400 bg-emerald-50/40 opacity-60 scale-[0.98] shadow-emerald-100/50":"border-slate-200 bg-white/95 hover:-translate-y-1 hover:border-indigo-300 hover:shadow-lg hover:shadow-indigo-100/50"].join(" "),children:[s.answer!==d&&e("div",{className:"flex items-start justify-start gap-2",children:e("div",{className:"relative inline-flex min-h-[40px] min-w-[40px] items-center justify-center rounded-xl px-3 py-1.5 font-extrabold text-white shadow-sm transition-all duration-300 "+(a?"bg-gradient-to-br from-emerald-400 to-emerald-600":"bg-gradient-to-br from-indigo-500 to-violet-600"),children:e("span",{className:"text-sm text-center leading-tight break-words line-clamp-2",children:s.answer})})}),n?t(r,{children:[e("div",{className:"flex flex-1 items-center justify-center overflow-hidden rounded-xl border p-2 transition-all duration-300 "+(a?"border-emerald-200/50 bg-emerald-100/30 grayscale-[40%]":"border-slate-100 bg-gradient-to-br from-slate-50 to-white"),children:e(i,{src:s.imageUrl,alt:s.answer,className:"h-28 w-full rounded-xl object-contain sm:h-32"})}),e("div",{className:"min-w-0",children:e("div",{className:"truncate text-center text-sm font-semibold transition-colors "+(a?"text-emerald-700":"text-slate-700"),children:d||`Picture ${s.answer}`})})]}):e("div",{className:"flex flex-1 items-center justify-center rounded-xl border border-slate-100 bg-gradient-to-br from-slate-50 to-white px-4 py-5 text-center",children:e("span",{className:"text-sm font-semibold leading-snug "+(a?"text-emerald-700":"text-slate-700"),children:d})})]})}function m({value:r,onChange:s,disabled:n,options:i}){const o=r.trim().toUpperCase();return t("div",{className:"group relative min-w-[160px] sm:min-w-[210px]",children:[t("select",{value:o,onChange:e=>s(e.target.value),disabled:n,className:"h-[48px] w-full appearance-none rounded-2xl border border-slate-200 bg-white px-4 pr-11 text-sm font-semibold text-slate-700 shadow-sm outline-none transition-all duration-200 hover:border-indigo-300 focus:border-indigo-500 focus:ring-4 focus:ring-indigo-100/50 disabled:cursor-not-allowed disabled:opacity-60","aria-label":"Chọn đáp án đúng",children:[e("option",{value:"",children:"Chọn đáp án"}),i.map(r=>e("option",{value:r.answer.toUpperCase(),children:r.content||r.answer},r.answer))]}),e("div",{className:"pointer-events-none absolute right-2.5 top-1/2 flex h-6 w-6 -translate-y-1/2 items-center justify-center rounded-full bg-slate-100 text-slate-500 transition-colors group-focus-within:bg-indigo-100 group-focus-within:text-indigo-600",children:e(a,{className:"h-3.5 w-3.5",strokeWidth:2.5})})]})}function p({question:r,rawAnswer:s,displayValue:a,isDisabled:n,isExampleQ:o,onAnswerChange:l,isReviewMode:d,correctAnswer:c,answerStatus:p,options:u}){return t("div",{className:["group relative overflow-hidden rounded-[14px] border p-4 shadow-sm transition-all duration-200 flex flex-col gap-4",o?"border-amber-200 bg-gradient-to-br from-amber-50 to-orange-50/50 shadow-amber-100/40":"border-slate-200/80 bg-white hover:-translate-y-0.5 hover:border-indigo-200 hover:shadow-md hover:shadow-indigo-100/50"].join(" "),children:[t("div",{className:"flex items-start gap-4",children:[e("span",{className:"flex h-[38px] w-[38px] shrink-0 items-center justify-center rounded-[10px] text-[15px] font-extrabold text-white shadow-sm "+(o?"bg-gradient-to-br from-amber-400 to-orange-500":"bg-gradient-to-br from-indigo-500 to-violet-600"),children:r.questionNumber}),t("div",{className:"flex flex-1 flex-col gap-2 pt-1",children:[o&&e("span",{className:"w-fit rounded-full border border-amber-300 bg-amber-100 px-2.5 py-0.5 text-[10px] font-bold uppercase tracking-wider text-amber-700",children:"Example"}),e("div",{className:"text-[15px] font-medium leading-relaxed text-slate-800 break-words",children:r.question})]})]}),r.imageUrl&&e("div",{className:"flex w-full justify-center",children:e(i,{src:r.imageUrl,alt:`Q${r.questionNumber}`,className:"h-30 w-auto min-w-[5rem] rounded-xl border border-slate-100 bg-slate-50 object-contain p-1.5 shadow-sm sm:h-30"})}),e("div",{className:"mt-1 flex w-full items-center justify-end border-t border-slate-100/80 pt-3",children:d&&!o?e(h,{userAnswer:a,correctAnswer:c,status:p??"unanswered"}):e("div",{className:"w-full sm:w-auto",children:e(m,{value:s,onChange:e=>l(r.id,e),disabled:n,options:u})})})]})}function h({userAnswer:a,correctAnswer:i,status:o}){return t("div",{className:`flex w-full sm:w-auto items-center justify-center gap-2 rounded-xl border px-5 py-2 text-[15px] shadow-sm transition-colors ${"correct"===o?"border-emerald-200 bg-emerald-50 text-emerald-700":"incorrect"===o?"border-red-200 bg-red-50 text-red-700":"border-slate-200 bg-slate-50 text-slate-700"}`,children:["correct"===o&&t(r,{children:[e(s,{className:"h-4 w-4 shrink-0",strokeWidth:3}),e("span",{className:"font-medium opacity-90",children:"Đáp án:"}),e("span",{className:"ml-1 rounded-md bg-white px-2.5 py-0.5 border border-emerald-100 font-bold shadow-sm",children:a||"Trống"})]}),"unanswered"===o&&t("div",{className:"flex items-center gap-2",children:[e("span",{className:"font-medium opacity-80",children:"Đáp án:"}),e("span",{className:"rounded-md bg-white px-2.5 py-0.5 border border-slate-200 font-bold shadow-sm",children:i})]}),"incorrect"===o&&t("div",{className:"flex items-center gap-2",children:[e(n,{className:"h-4 w-4 shrink-0",strokeWidth:3}),e("span",{className:"font-medium opacity-90",children:"Đáp án:"}),e("span",{className:"line-through decoration-red-400/80 decoration-2 rounded-md bg-white/60 px-2 py-0.5 border border-red-100/50 font-semibold opacity-70",children:a||"Trống"}),e("span",{className:"text-red-400 font-bold",children:"→"}),e("span",{className:"rounded-md bg-white px-2.5 py-0.5 border border-red-200 font-bold shadow-sm",children:i})]})]})}export function MoversMatchByWritingAnswerRenderer({partNumber:a,partName:m,questionCount:h,instruction:u,audioUrl:x,options:g,questions:b,answers:w,onAnswerChange:f,isReviewMode:v=!1,viewMode:N="DEFAULT",groupImageUrl:y,correctAnswerTextMap:C={},isCorrectMap:j={}}){const A=e=>{if(!w[e])return"unanswered";const r=j[e];return!0===r?"correct":!1===r?"incorrect":"unanswered"},k=e=>{if(!e)return"";const r=e.trim().toUpperCase(),t=g.find(e=>e.answer.toUpperCase()===r);return t?t.content||t.answer:e};if("CONVERSATION"===N)return t("div",{className:"flex h-full flex-col gap-4 overflow-y-auto p-3 sm:gap-6 sm:p-6",children:[e(o,{partNumber:a,questionCount:h,partName:m,isReviewMode:v}),e(l,{instruction:u,isReviewMode:v}),x&&e("div",{className:"shrink-0",children:e(d,{audioSrc:x,compact:!0})}),y&&e(i,{src:y,alt:"Group illustration",className:"max-h-[200px] rounded-lg object-contain shadow-md"}),g.length>0&&e("div",{className:"grid grid-cols-2 gap-2 rounded-xl border border-slate-200 bg-slate-50 p-3 sm:grid-cols-4",children:g.map((r,s)=>t("div",{className:"flex items-center gap-2 rounded-lg border border-slate-200 bg-white p-2",children:[e("span",{className:"flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-gradient-to-br from-indigo-500 to-violet-600 text-xs font-bold text-white",children:r.answer}),e("span",{className:"flex-1 text-sm text-slate-700",children:r.content||r.answer})]},s))}),e("div",{className:"flex flex-col gap-3",children:b.filter(e=>!e.isExample).map(a=>{const i=A(a.id),o=w[a.id]||"",l=k(o),d=C[a.id];return t("div",{id:`question-${a.id}`,className:"flex flex-col gap-2",children:[t("div",{className:"flex items-start gap-2",children:[t("span",{className:"w-12 shrink-0 text-xs font-semibold text-slate-500",children:[a.askerName,":"]}),e("div",{className:"max-w-[80%] rounded-2xl rounded-tl-none bg-slate-100 px-4 py-2 text-sm text-slate-800",children:a.question})]}),e("div",{className:"flex items-center justify-end gap-2",children:t("div",{className:"flex max-w-[80%] items-center gap-2 rounded-2xl rounded-tr-none border border-indigo-200 bg-indigo-50 px-4 py-2",children:[t("span",{className:"shrink-0 text-xs font-semibold text-indigo-600",children:[a.answererName,":"]}),v?t("span",{className:"flex items-center gap-1 text-sm font-bold",children:["correct"===i&&e("span",{className:"text-slate-800",children:l}),"unanswered"===i&&e("span",{className:"text-indigo-600",children:d}),"incorrect"===i&&t(r,{children:[e("span",{className:"text-red-500 line-through",children:l}),e("span",{className:"text-slate-400",children:"→"}),e("span",{className:"text-indigo-600",children:d})]}),e("div",{className:"flex h-5 w-5 items-center justify-center rounded-full text-white "+("correct"===i?"bg-emerald-500":"incorrect"===i?"bg-red-500":"bg-indigo-500"),children:e("incorrect"===i?n:s,{className:"h-3 w-3",strokeWidth:3})})]}):t("select",{value:o.trim().toUpperCase(),onChange:e=>f(a.id,e.target.value),disabled:v,className:"min-w-[140px] rounded-lg border border-indigo-300 bg-white px-3 py-2 text-sm font-bold text-slate-700 outline-none focus:border-indigo-500",children:[e("option",{value:"",children:"Chọn đáp án"}),g.map(r=>e("option",{value:r.answer.toUpperCase(),children:r.content||r.answer},r.answer))]})]})})]},a.id)})})]});const U=new Set(Object.values(w).filter(e=>"string"==typeof e&&Boolean(e)).map(e=>e.trim().toUpperCase()));b.forEach(e=>{e.isExample&&e.exampleAnswer&&U.add(e.exampleAnswer.trim().toUpperCase())});const q=b.filter(e=>e.isExample),M=b.filter(e=>!e.isExample);return t("div",{className:"flex flex-col h-full gap-5 sm:gap-6 overflow-y-auto custom-scrollbar",children:[t("div",{className:"flex flex-col gap-4 sm:gap-5 p-3 sm:px-6 sm:pt-2",children:[e(o,{partNumber:a,questionCount:h,partName:m,isReviewMode:v}),e(l,{instruction:u,isReviewMode:v}),x&&e("div",{className:"shrink-0",children:e(d,{audioSrc:x,compact:!0})}),y&&e("div",{className:"flex items-center justify-center rounded-2xl border border-slate-200/80 bg-white p-3 shadow-sm",children:e(i,{src:y,alt:"Group illustration",className:"max-h-[300px] rounded-xl object-contain shadow-md"})}),g.length>0&&t("div",{className:"rounded-[20px] border border-slate-200/80 bg-gradient-to-br from-white via-white to-slate-50 p-4 sm:p-5 shadow-lg shadow-slate-100/70",children:[e("div",{className:"mb-4 flex items-center justify-between gap-3",children:e("div",{children:e("h3",{className:"text-sm font-bold uppercase tracking-[0.18em] text-slate-500",children:"Answer bank"})})}),e("div",{className:"grid grid-cols-1 gap-3 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4",children:g.map((r,t)=>e(c,{opt:r,isUsed:U.has(r.answer.toUpperCase())},t))})]}),q.length>0&&e("div",{className:"flex flex-col gap-4 mt-2",children:q.map(r=>{const t=w[r.id]||"",s=r.exampleAnswer||k(t);return e("div",{id:`question-${r.id}`,className:"w-full",children:e(p,{question:r,rawAnswer:t,displayValue:s,isDisabled:!0,isExampleQ:!0,onAnswerChange:f,isReviewMode:v,correctAnswer:C[r.id],answerStatus:void 0,options:g})},r.id)})})]}),q.length>0&&M.length>0&&e("div",{className:"px-3 sm:px-6",children:e("hr",{className:"border-t border-slate-200/60 my-2"})}),e("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-5 p-3 sm:px-6 sm:pb-6",children:M.map(r=>{const t=v,s=w[r.id]||"",a=k(s);return e("div",{id:`question-${r.id}`,className:"w-full",children:e(p,{question:r,rawAnswer:s,displayValue:a,isDisabled:t,isExampleQ:!1,onAnswerChange:f,isReviewMode:v,correctAnswer:C[r.id],answerStatus:v?A(r.id):void 0,options:g})},r.id)})})]})}

package/dist/components/exams/take/components/question-renderers/MoversPictureChooseRenderer.d.ts

@@ -0,0 +1,2 @@
+import type { MoversPictureChooseRendererProps } from '../../types';
+export declare function MoversPictureChooseRenderer({ partNumber, partName, questionCount, instruction, subQuestions, answers, onAnswerChange, isReviewMode, }: MoversPictureChooseRendererProps): import("react").JSX.Element;

package/dist/components/exams/take/components/question-renderers/MoversPictureChooseRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{ZoomIn as i,Check as n,X as s}from"lucide-react";import{ResolvedImage as l}from"../../../../../components/common/ResolvedImage";import d from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import a from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";function c({imageUrl:n,alt:s}){const[d,a]=o(!1);return r(t,{children:[r("div",{className:"relative flex items-center justify-center",children:[e(l,{src:n,alt:s,className:"max-h-[180px] cursor-pointer rounded-lg object-contain shadow-md",onClick:()=>a(!0)}),e("button",{type:"button",onClick:()=>a(!0),className:"absolute right-2 top-2 rounded-full bg-white/80 p-1.5 shadow-md hover:bg-white","aria-label":"Zoom image",children:e(i,{className:"h-4 w-4 text-gray-600"})})]}),d&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/70",onClick:()=>a(!1),children:e(l,{src:n,alt:`${s} (zoomed)`,className:"max-h-[90vh] max-w-[90vw] rounded-lg object-contain",showLoadingState:!1})})]})}function m({subQuestion:t,selectedOptionId:o,onSelect:i,isReviewMode:l,id:d}){const a=l&&o===t.correctOptionId,m=e=>{if(!l)return o===e?"border-blue-500 bg-[#f4f9ff]":"border-blue-200 bg-white hover:border-blue-300 hover:bg-blue-50/30";const r=o===e,i=t.correctOptionId===e;return i?a?"border-green-500 bg-green-50":"border-blue-500 bg-blue-50":r&&!i?"border-red-500 bg-red-50":"border-blue-200 bg-white"},u=e=>{if(!l)return o===e?"border-blue-500 bg-blue-500":"border-gray-300 bg-white";const r=o===e,i=t.correctOptionId===e;return i?a?"border-green-500 bg-green-500":"border-blue-500 bg-blue-500":r&&!i?"border-red-500 bg-red-500":"border-gray-300 bg-white"},b=r=>{if(!l)return null;const i=o===r,d=t.correctOptionId===r;return d?e(n,{className:"h-4 w-4 text-white"}):i&&!d?e(s,{className:"h-4 w-4 text-white"}):null};return r("div",{id:d,className:"rounded-lg border border-gray-200 bg-white p-4 shadow-sm",children:[r("div",{className:"mb-3 flex items-start gap-3",children:[e("span",{className:"flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full bg-blue-500 text-sm font-bold text-white",children:t.questionNumber}),e(c,{imageUrl:t.imageUrl,alt:`Question ${t.questionNumber}`})]}),t.questionText&&e("p",{className:"mb-3 text-[17px] font-bold text-[#001590]",children:t.questionText}),e("div",{className:"flex flex-col gap-2",children:t.options.map(t=>r("button",{type:"button",onClick:()=>!l&&i(t.id),disabled:l,className:`flex items-center gap-3 rounded-lg border-2 px-3 py-2 text-left transition-colors ${m(t.id)} ${l?"cursor-default":"cursor-pointer"}`,children:[r("span",{className:"text-sm font-medium text-gray-600",children:[t.label,"."]}),e("span",{className:"flex-1 text-sm text-gray-700",children:t.text}),e("div",{className:`flex h-5 w-5 items-center justify-center rounded-full border-2 ${u(t.id)}`,children:l?b(t.id):o===t.id&&e("div",{className:"h-2 w-2 rounded-full bg-white"})})]},t.id))})]})}export function MoversPictureChooseRenderer({partNumber:t,partName:o,questionCount:i,instruction:n,subQuestions:s,answers:l,onAnswerChange:c,isReviewMode:u=!1}){return r("div",{className:"flex h-full flex-col gap-4 overflow-y-auto p-6",children:[r("div",{className:"flex flex-col gap-4",children:[e(d,{partNumber:t,questionCount:i,partName:o,isReviewMode:u}),e(a,{instruction:n,isReviewMode:u})]}),e("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2",children:s.map(r=>e(m,{id:`question-${r.id}`,subQuestion:r,selectedOptionId:l[r.id],onSelect:e=>c(r.id,e),isReviewMode:u},r.id))})]})}

package/dist/components/exams/take/components/question-renderers/MoversPictureFillBlankChooseRenderer.d.ts

@@ -0,0 +1,2 @@
+import type { MoversPictureFillBlankChooseRendererProps } from '../../types';
+export declare function MoversPictureFillBlankChooseRenderer({ partNumber, partName, questionCount, instruction, subQuestions, answers, onAnswerChange, isReviewMode, }: MoversPictureFillBlankChooseRendererProps): import("react").JSX.Element;

package/dist/components/exams/take/components/question-renderers/MoversPictureFillBlankChooseRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{ZoomIn as i}from"lucide-react";import{ResolvedImage as n}from"../../../../../components/common/ResolvedImage";import s from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import d from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";function l({imageUrl:s,alt:d}){const[l,a]=o(!1);return r(t,{children:[r("div",{className:"relative flex items-center justify-center",children:[e(n,{src:s,alt:d,className:"max-h-[150px] cursor-pointer rounded-lg object-contain shadow-md",onClick:()=>a(!0)}),e("button",{type:"button",onClick:()=>a(!0),className:"absolute right-1 top-1 rounded-full bg-white/80 p-1 shadow-md hover:bg-white","aria-label":"Zoom image",children:e(i,{className:"h-3 w-3 text-gray-600"})})]}),l&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/70",onClick:()=>a(!1),children:e(n,{src:s,alt:`${d} (zoomed)`,className:"max-h-[90vh] max-w-[90vw] rounded-lg object-contain",showLoadingState:!1})})]})}function a({question:t,selectedAnswer:o,isReviewMode:i,isCorrect:n}){const s=t.split("{0}");return r("p",{className:"text-sm font-medium text-gray-700",children:[s[0],e("span",{className:"mx-1 inline-block min-w-[60px] border-b-2 border-dashed px-2 text-center font-semibold "+(i&&o?n?"border-green-500 text-green-600":"border-red-500 text-red-600":"border-blue-400 text-blue-600"),children:o||"______"}),s[1]]})}function c({subQuestion:t,selectedOptionId:o,onSelect:i,isReviewMode:n,id:s}){const d=t.options.find(e=>e.id===o),c=n&&o===t.correctOptionId,m=e=>{if(!n)return o===e?"border-blue-500 bg-blue-50":"border-gray-300 bg-white hover:border-blue-300";const r=o===e,i=t.correctOptionId===e;return i?c?"border-green-500 bg-green-50":"border-blue-500 bg-blue-50":r&&!i?"border-red-500 bg-red-50":"border-gray-300 bg-white"},u=e=>{if(!n)return"text-gray-700";const r=o===e;return t.correctOptionId===e||r?"text-gray-800 font-bold":"text-gray-600"};return r("div",{id:s,className:"rounded-lg border border-gray-200 bg-white p-4 shadow-sm",children:[r("div",{className:"mb-3 flex items-start gap-3",children:[e("span",{className:"flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full bg-blue-500 text-sm font-bold text-white",children:t.questionNumber}),e(l,{imageUrl:t.imageUrl,alt:`Question ${t.questionNumber}`})]}),e("div",{className:"mb-3",children:e(a,{question:t.question,selectedAnswer:d?.text,isReviewMode:n,isCorrect:o===t.correctOptionId})}),e("div",{className:"flex flex-wrap gap-2",children:t.options.map(e=>r("button",{type:"button",onClick:()=>!n&&i(e.id),disabled:n,className:`rounded-lg border-2 px-3 py-1.5 text-sm transition-colors ${m(e.id)} ${u(e.id)} ${n?"cursor-default":"cursor-pointer"}`,children:[e.label,". ",e.text]},e.id))})]})}export function MoversPictureFillBlankChooseRenderer({partNumber:t,partName:o,questionCount:i,instruction:n,subQuestions:l,answers:a,onAnswerChange:m,isReviewMode:u=!1}){return r("div",{className:"flex h-full flex-col gap-4 overflow-y-auto p-6",children:[r("div",{className:"flex flex-col gap-4",children:[e(s,{partNumber:t,questionCount:i,partName:o,isReviewMode:u}),e(d,{instruction:n,isReviewMode:u})]}),e("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2",children:l.map(r=>e(c,{id:`question-${r.id}`,subQuestion:r,selectedOptionId:a[r.id],onSelect:e=>m(r.id,e),isReviewMode:u},r.id))})]})}

package/dist/components/exams/take/components/question-renderers/MoversReadingPassageRenderer.d.ts

@@ -0,0 +1,2 @@
+import type { MoversReadingPassageRendererProps } from '../../types';
+export declare function MoversReadingPassageRenderer({ partNumber, partName, questionCount, instruction, passageTitle, passage, passageImageUrl, questions, answers, onAnswerChange, isReviewMode, correctOptionIdMap, }: MoversReadingPassageRendererProps): import("react").JSX.Element;

package/dist/components/exams/take/components/question-renderers/MoversReadingPassageRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{useState as s}from"react";import{Check as a,X as i,ZoomIn as l}from"lucide-react";import{ResolvedImage as o}from"../../../../../components/common/ResolvedImage";import n from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import d from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";function c({imageUrl:a}){const[i,n]=s(!1);return r(t,{children:[r("div",{className:"relative flex items-center justify-center",children:[e(o,{src:a,alt:"Passage illustration",className:"max-h-[200px] cursor-pointer rounded-lg object-contain shadow-md",onClick:()=>n(!0)}),e("button",{type:"button",onClick:()=>n(!0),className:"absolute right-2 top-2 rounded-full bg-white/80 p-1.5 shadow-md hover:bg-white","aria-label":"Zoom image",children:e(l,{className:"h-4 w-4 text-gray-600"})})]}),i&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/70",onClick:()=>n(!1),children:e(o,{src:a,alt:"Passage illustration (zoomed)",className:"max-h-[90vh] max-w-[90vw] rounded-lg object-contain",showLoadingState:!1})})]})}function m({title:t,passage:s,imageUrl:a}){return r("div",{className:"rounded-lg border-2 border-amber-200 bg-amber-50 p-4",children:[t&&e("h3",{className:"mb-3 text-center text-lg font-bold text-amber-800",children:t}),a&&e("div",{className:"mb-3",children:e(c,{imageUrl:a})}),e("div",{className:"prose prose-sm max-w-none text-gray-700",children:s.split("\n").map((r,t)=>e("p",{className:"mb-2 last:mb-0",children:r},t))})]})}function u({question:t,selectedOptionId:s,onSelect:l,isReviewMode:o,correctOptionId:n,id:d}){const c=n||t.correctOptionId,m=!!s,u=s===c,b=e=>{if(!o)return s===e?"border-blue-500 bg-blue-50":"border-gray-300 bg-white hover:border-blue-300";const r=s===e;return r&&u?"border-green-500 bg-green-50":r&&!u?"border-red-500 bg-red-50":!(c===e)||u&&m?"border-gray-300 bg-white":"border-blue-500 bg-blue-50"};return r("div",{id:d,className:"mb-4",children:[r("p",{className:"mb-2 text-base font-semibold text-gray-800",children:[t.questionNumber,". ",t.questionText]}),e("div",{className:"flex flex-col gap-2 pl-2",children:t.options.map(t=>{const n=s===t.id,d=c===t.id,p=o&&n&&u,g=o&&n&&!u,h=o&&d&&(!u||!m);return r("button",{type:"button",onClick:()=>!o&&l(t.id),disabled:o,className:`flex items-center gap-3 rounded-lg border-2 px-3 py-2 text-left transition-colors ${b(t.id)} ${o?"cursor-default":"cursor-pointer"}`,children:[r("span",{className:"text-sm font-medium text-gray-600",children:[t.label,"."]}),e("span",{className:"flex-1 text-sm text-gray-700",children:t.text}),p&&e("div",{className:"flex h-6 w-6 items-center justify-center rounded-full bg-green-500",children:e(a,{className:"h-4 w-4 text-white",strokeWidth:3})}),g&&e("div",{className:"flex h-6 w-6 items-center justify-center rounded-full bg-red-500",children:e(i,{className:"h-4 w-4 text-white",strokeWidth:3})}),h&&e("div",{className:"flex h-6 w-6 items-center justify-center rounded-full bg-blue-500",children:e(a,{className:"h-4 w-4 text-white",strokeWidth:3})}),!o&&e("div",{className:"flex h-5 w-5 items-center justify-center rounded-full border-2 "+(n?"border-blue-500 bg-blue-500":"border-gray-300 bg-white"),children:n&&e("div",{className:"h-2 w-2 rounded-full bg-white"})}),o&&!p&&!g&&!h&&e("div",{className:"flex h-5 w-5 items-center justify-center rounded-full border-2 border-gray-300 bg-white"})]},t.id)})})]})}export function MoversReadingPassageRenderer({partNumber:t,partName:s,questionCount:a,instruction:i,passageTitle:l,passage:o,passageImageUrl:c,questions:b,answers:p,onAnswerChange:g,isReviewMode:h=!1,correctOptionIdMap:f}){return r("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar relative",children:[r("div",{className:"flex flex-col gap-4 p-3 sm:px-6 sm:pt-4",children:[e(n,{partNumber:t,questionCount:a,partName:s,isReviewMode:h}),e(d,{instruction:i,isReviewMode:h})]}),e("div",{className:"flex flex-col gap-4 p-3 sm:px-6 sm:pt-0 sticky top-0 z-20 bg-white/95 backdrop-blur pb-2 shadow-sm border-b border-gray-100",children:e("div",{className:"max-h-[35vh] overflow-y-auto custom-scrollbar pr-2",children:e(m,{title:l,passage:o,imageUrl:c})})}),e("div",{className:"flex flex-col gap-4 p-3 sm:pb-6 sm:px-6",children:b.map(r=>e(u,{id:`question-${r.id}`,question:r,selectedOptionId:p[r.id],onSelect:e=>g(r.id,e),isReviewMode:h,correctOptionId:f?.[r.id]},r.id))})]})}

package/dist/components/exams/take/components/question-renderers/MoversTrueFalseRenderer.d.ts

@@ -0,0 +1,20 @@
+/**
+ * TRUE_FALSE Renderer - Display questions with True/False buttons
+ * Used in Starters P5
+ */
+import type { TrueFalseQuestion } from '../../utils/question-transformers';
+interface MoversTrueFalseRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    imageUrl?: string;
+    questions: TrueFalseQuestion[];
+    answers: Record<string, boolean | undefined>;
+    onAnswerChange: (questionId: string, value: boolean) => void;
+    isReviewMode?: boolean;
+    correctAnswerTextMap?: Record<string, string>;
+    groupContent?: string;
+}
+export declare function MoversTrueFalseRenderer({ partNumber, partName, questionCount, instruction, imageUrl, questions, answers, onAnswerChange, isReviewMode, correctAnswerTextMap, groupContent, }: MoversTrueFalseRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversTrueFalseRenderer.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{ResolvedImage as a}from"../../../../../components/common/ResolvedImage";import t from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import s from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";function o({question:t,answer:s,onAnswerChange:o,isReviewMode:l,correctAnswerTextMap:i,id:n}){const d=l||t.isExample,m=i[t.id],c="true"===m||"false"!==m&&void 0,g=t.isExample?t.exampleCorrectAnswer:s,p=l&&void 0!==c,x=p&&g===c,b=p&&void 0!==g&&g!==c;return r("div",{id:n,className:"flex items-start gap-3 rounded-xl p-3 "+(t.isExample?"border border-amber-300 bg-gradient-to-br from-amber-50 via-orange-50 to-white shadow-amber-100/70":""),children:[e("span",{className:"flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full text-sm font-bold text-white "+(t.isExample?"bg-gradient-to-br from-amber-400 to-orange-500":x?"bg-emerald-500":b?"bg-rose-500":"bg-blue-500"),children:t.questionNumber}),r("div",{className:"flex flex-1 flex-col gap-2",children:[e("div",{className:"flex items-center gap-2",children:t.isExample&&e("span",{className:"rounded-full border border-amber-300 bg-gradient-to-r from-amber-100 to-orange-100 px-2 py-0.5 text-[10px] font-extrabold uppercase tracking-widest text-amber-700 shadow-sm",children:"Example"})}),t.imageUrl&&e(a,{src:t.imageUrl,alt:`Q${t.questionNumber}`,className:"max-h-[120px] rounded-lg object-contain"}),e("p",{className:"text-base text-gray-800",children:t.question}),r("div",{className:"flex gap-3",children:[e("button",{type:"button",disabled:d,onClick:()=>o(t.id,!0),className:`rounded-lg border-2 px-5 py-2 text-sm font-semibold transition-colors ${!0===g?l&&b&&!t.isExample?"border-rose-500 bg-rose-50 text-rose-700":"border-emerald-500 bg-emerald-50 text-emerald-700":p&&!0===c&&!t.isExample?"border-emerald-500 bg-emerald-50 text-emerald-700 ring-2 ring-emerald-300":"border-gray-300 bg-white text-gray-600 hover:border-emerald-400"} ${d?"cursor-not-allowed opacity-60":""}`,children:"✓ True"}),e("button",{type:"button",disabled:d,onClick:()=>o(t.id,!1),className:`rounded-lg border-2 px-5 py-2 text-sm font-semibold transition-colors ${!1===g?l&&b&&!t.isExample?"border-rose-500 bg-rose-50 text-rose-700":"border-emerald-500 bg-emerald-50 text-emerald-700":p&&!1===c&&!t.isExample?"border-emerald-500 bg-emerald-50 text-emerald-700 ring-2 ring-emerald-300":"border-gray-300 bg-white text-gray-600 hover:border-rose-400"} ${d?"cursor-not-allowed opacity-60":""}`,children:"✗ False"})]}),b&&p&&!t.isExample&&r("p",{className:"text-sm font-medium text-emerald-600",children:["Đáp án đúng: ",c?"True":"False"]})]})]})}export function MoversTrueFalseRenderer({partNumber:l,partName:i,questionCount:n,instruction:d,imageUrl:m,questions:c,answers:g,onAnswerChange:p,isReviewMode:x=!1,correctAnswerTextMap:b={},groupContent:u}){const h=c.filter(e=>e.isExample),f=c.filter(e=>!e.isExample);return r("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar",children:[r("div",{className:"flex flex-col gap-4 p-3 sm:px-6 sm:pt-2",children:[e(t,{partNumber:l,questionCount:n,partName:i,isReviewMode:x}),e(s,{instruction:d,isReviewMode:x}),m&&e("div",{className:"flex items-center justify-center",children:e(a,{src:m,alt:"Question illustration",className:"max-h-[300px] rounded-lg object-contain shadow-md"})}),u&&e("div",{className:"rounded-lg bg-amber-50 p-4 text-base leading-relaxed text-gray-800",dangerouslySetInnerHTML:{__html:u}}),h.length>0&&e("div",{className:"flex flex-col gap-4 mt-2",children:h.map(r=>e(o,{id:`question-${r.id}`,question:r,answer:g[r.id],onAnswerChange:p,isReviewMode:x,correctAnswerTextMap:b},r.id))})]}),h.length>0&&f.length>0&&e("div",{className:"px-3 sm:px-6",children:e("hr",{className:"border-t border-slate-200/60 my-1"})}),e("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-5 p-3 sm:px-6 sm:pb-6",children:f.map(r=>e("div",{id:`question-${r.id}`,className:"w-full rounded-xl border border-gray-200 bg-white shadow-sm transition-all hover:border-indigo-200 hover:shadow-md",children:e(o,{question:r,answer:g[r.id],onAnswerChange:p,isReviewMode:x,correctAnswerTextMap:b})},r.id))})]})}

package/dist/components/exams/take/components/question-renderers/MoversWordFillParagraphRenderer.d.ts

@@ -0,0 +1,32 @@
+/**
+ * WORD_FILL_PARAGRAPH Renderer - Paragraph with blanks filled from word bank
+ * Supports WITH_WORD_BANK (input per blank) and WITH_OPTIONS (per-blank dropdown)
+ * Used in Starters P8, Movers P8/P9
+ */
+interface WordBankItem {
+    word: string;
+    imageUrl?: string;
+    isExample?: boolean;
+    options?: string[];
+}
+interface MoversWordFillParagraphRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    questionId: string;
+    paragraph: string;
+    title?: string;
+    imageUrl?: string;
+    wordBank: WordBankItem[];
+    viewMode: 'WITH_WORD_BANK' | 'WITH_OPTIONS' | 'DEFAULT' | 'EMAIL';
+    answers: Record<string, string[]>;
+    onAnswerChange: (questionId: string, value: string[]) => void;
+    exampleAnswer?: string[];
+    isReviewMode?: boolean;
+    emailFrom?: string;
+    emailTo?: string;
+    correctAnswerTextMap?: Record<string, string>;
+}
+export declare function MoversWordFillParagraphRenderer({ partNumber, partName, questionCount, instruction, questionId, paragraph, title, imageUrl, wordBank, viewMode, answers, onAnswerChange, exampleAnswer, isReviewMode, emailFrom, emailTo, correctAnswerTextMap, }: MoversWordFillParagraphRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversWordFillParagraphRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{X as t}from"lucide-react";import{useMemo as a}from"react";import{ResolvedImage as l}from"../../../../../components/common/ResolvedImage";import n from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import s from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";import{cn as i}from"../../../../../shared/lib/utils";function o({item:t,isUsed:a,isExample:n}){return r("div",{className:i("flex flex-col items-center justify-between overflow-hidden rounded-2xl border-2 bg-white p-3 shadow-sm transition-all duration-300",n?"border-amber-200 bg-amber-50/50":a?"border-emerald-200 bg-emerald-50/50 opacity-60":"border-slate-200"),children:[t.imageUrl&&e("div",{className:"flex h-24 sm:h-28 w-full items-center justify-center overflow-hidden rounded-xl bg-slate-50/50 p-2 mb-3",children:e(l,{src:t.imageUrl,alt:t.word,className:"h-full w-full object-contain drop-shadow-sm"})}),r("div",{className:i("flex w-full flex-col items-center",!t.imageUrl&&"mt-0"),children:[e("span",{className:"text-base font-extrabold tracking-wide text-slate-800",children:t.word}),n&&e("span",{className:"mt-1 rounded-full bg-amber-100 px-2 py-0.5 text-[10px] font-bold uppercase tracking-wider text-amber-700",children:"Example"}),a&&!n&&e("span",{className:"mt-1 rounded-full bg-emerald-100 px-2 py-0.5 text-[10px] font-bold uppercase tracking-wider text-emerald-700",children:"Used"})]})]})}function d({blankIndex:a,value:l,isExampleBlank:n,isReviewMode:s,onInputChange:o,onClear:d}){const c=!!l;return n?e("span",{className:"mx-1 inline-flex min-w-[110px] items-center justify-center border-0 border-b-2 border-amber-400 bg-transparent px-2 py-0.5 align-baseline text-sm font-bold text-amber-700",children:l}):r("span",{className:"mx-1 inline-flex items-end gap-1.5 align-baseline",children:[e("input",{type:"text","aria-label":`Blank ${a+1}`,value:l,onChange:e=>o(e.target.value),disabled:s,placeholder:"_____",className:i("h-8 min-w-[90px] max-w-[150px] rounded-none border-0 border-b-2 bg-transparent px-1 pb-0.5 text-center text-sm font-semibold shadow-none outline-none transition-all",c?"border-emerald-500 text-emerald-700":"border-slate-400 text-slate-500 placeholder:text-slate-300","focus:border-blue-500 focus:text-blue-700",s?"cursor-default":"cursor-text")}),!s&&c&&e("button",{type:"button",onClick:d,className:"inline-flex h-6 w-6 items-center justify-center rounded-full text-slate-400 transition-colors hover:bg-red-50 hover:text-red-500","aria-label":`Clear blank ${a+1}`,children:e(t,{className:"h-3.5 w-3.5"})})]})}export function MoversWordFillParagraphRenderer({partNumber:t,partName:c,questionCount:m,instruction:p,questionId:x,paragraph:b,title:u,imageUrl:h,wordBank:g,viewMode:f,answers:w,onAnswerChange:N,exampleAnswer:v,isReviewMode:y=!1,emailFrom:_,emailTo:k,correctAnswerTextMap:C}){const I=w[x],j=Array.isArray(I)?I:I&&"object"==typeof I?Object.keys(I).filter(e=>/^\d+$/.test(e)).sort((e,r)=>Number(e)-Number(r)).map(e=>I[e]):"string"==typeof I?[I]:[],$=a(()=>Array.isArray(g)?g:[],[g]),M=a(()=>{if(v&&v.length>0)return v;const e=[];let r=!1;for(let t=0;t<$.length;t++)$[t]?.isExample?(r=!0,y&&C?e.push(C[`${x}-blank-${t}`]||$[t]?.word||""):e.push($[t]?.word||"")):e.push(void 0);return r?e:void 0},[v,$,y,C,x]),R=b.split(/(\{\d+\})/),A=e=>Boolean(M?.[e]),B=(e,r)=>{if(y||A(e))return;const t=[...j];t[e]=r,N(x,t)},E=e=>{if(y||A(e))return;const r=[...j];r[e]="",N(x,r)},T=new Set(j.filter(Boolean));return r("div","EMAIL"===f?{className:"grid h-full min-h-0 grid-cols-1 gap-4 sm:gap-6 "+(y?"":"lg:grid-cols-2"),children:[r("div",{className:"flex min-h-0 flex-col gap-4 overflow-y-auto p-3 sm:pb-6 sm:pr-6 sm:pt-6",children:[e(n,{partNumber:t,questionCount:m,partName:c,isReviewMode:y}),e(s,{instruction:p,isReviewMode:y}),h&&e("div",{className:"flex items-center justify-center",children:e(l,{src:h,alt:"Illustration",className:"max-h-[300px] rounded-lg object-contain shadow-md"})})]}),r("div",{className:"flex min-h-0 flex-col gap-4 p-3 sm:gap-5 sm:pb-6 sm:pl-6 sm:pt-6",children:[r("div",{className:"shrink-0 overflow-hidden rounded-2xl border border-sky-100 bg-white shadow-[0_10px_30px_rgba(15,23,42,0.06)]",children:[e("div",{className:"bg-gradient-to-r from-sky-100 via-blue-50 to-sky-100 px-5 py-3",children:e("span",{className:"text-[15px] font-extrabold uppercase tracking-[0.14em] text-sky-900",children:"Email"})}),r("div",{className:"space-y-3 bg-gradient-to-b from-white to-slate-50/80 px-5 py-4",children:[r("div",{className:"grid grid-cols-[64px_1fr] items-center gap-4",children:[e("span",{className:"text-[15px] font-semibold text-slate-700",children:"From:"}),e("div",{className:"rounded-xl border border-slate-200 bg-white px-4 py-2.5 text-base font-medium leading-6 text-slate-800 shadow-[inset_0_1px_2px_rgba(15,23,42,0.04)]",children:_||"—"})]}),r("div",{className:"grid grid-cols-[64px_1fr] items-center gap-4",children:[e("span",{className:"text-[15px] font-semibold text-slate-700",children:"To:"}),e("div",{className:"rounded-xl border border-slate-200 bg-white px-4 py-2.5 text-base font-medium leading-6 text-slate-800 shadow-[inset_0_1px_2px_rgba(15,23,42,0.04)]",children:k||"—"})]})]})]}),e("div",{className:i("custom-scrollbar flex-1 min-h-0 overflow-y-auto rounded-2xl border border-slate-200 bg-white p-5 pr-3 text-base leading-loose text-gray-800 shadow-[0_8px_24px_rgba(15,23,42,0.04)]",!y&&"whitespace-pre-line"),children:R.map((t,a)=>{const l=t.match(/^\{(\d+)\}$/);if(!l)return e("span",{children:t},a);const n=parseInt(l[1],10),s=j[n]||"";if(y&&C){const t=C[`${x}-blank-${n}`]||"",l=!s,i=!l&&s.trim().toLowerCase()===t.trim().toLowerCase();return l?e("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-blue-400 px-1 py-0.5 text-center text-blue-600",children:t||"___"},a):i?e("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-green-500 px-1 py-0.5 text-center text-green-700",children:s},a):r("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-red-400 px-1 py-0.5 text-center",children:[e("span",{className:"text-red-500 line-through",children:s}),t&&r("span",{className:"ml-1 text-green-600",children:["→ ",t]})]},a)}return r("span",{className:"mx-0.5 inline-flex items-baseline gap-0.5 align-baseline",children:[r("span",{className:"text-[11px] font-bold text-blue-400",children:["(",n+1,")"]}),e("input",{type:"text",value:s,onChange:e=>{const r=[...j];r[n]=e.target.value,N(x,r)},disabled:y,placeholder:"···",style:{width:`${Math.max(3,(s||"").length+1)}ch`},className:i("inline-block min-w-[3ch] max-w-[12ch] border-b-2 bg-transparent px-0.5 py-0 text-center text-sm font-medium outline-none transition-colors",s?"border-emerald-400 text-emerald-700":"border-slate-300 text-slate-500","focus:border-blue-500 focus:text-blue-700","disabled:opacity-60")})]},a)})})]})]}:{className:"grid h-full min-h-0 grid-cols-1 gap-4 sm:gap-6 "+(y?"":"lg:grid-cols-2"),children:[r("div",{className:"flex min-h-0 flex-col gap-4 overflow-y-auto p-3 sm:pb-6 sm:pr-6 sm:pt-6",children:[e(n,{partNumber:t,questionCount:m,partName:c,isReviewMode:y}),e(s,{instruction:p,isReviewMode:y}),u&&e("h2",{className:"shrink-0 text-center text-2xl font-bold uppercase text-coral-500",children:u}),h&&e("div",{className:"flex items-center justify-center",children:e(l,{src:h,alt:"Illustration",className:"max-h-[400px] w-full max-w-xl rounded-lg object-contain shadow-md"})}),"WITH_WORD_BANK"===f&&r("div",{className:"shrink-0 rounded-2xl border border-sky-100 bg-slate-50/50 p-4 sm:p-5 shadow-sm",children:[r("div",{className:"mb-4 flex items-center justify-center gap-2",children:[e("div",{className:"h-px flex-1 bg-gradient-to-r from-transparent to-sky-200"}),e("h3",{className:"text-sm font-extrabold uppercase tracking-widest text-sky-800",children:"WORD BANK (Reference)"}),e("div",{className:"h-px flex-1 bg-gradient-to-l from-transparent to-sky-200"})]}),e("div",{className:"grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-2 xl:grid-cols-3",children:$.map((r,t)=>{const a=T.has(r.word),l=r.isExample||M?.includes(r.word)||!1;return e(o,{item:r,isUsed:a,isExample:l},`${r.word}-${t}`)})})]})]}),e("div",{className:"custom-scrollbar flex min-h-0 flex-col gap-4 overflow-y-auto p-3 sm:gap-5 sm:pb-6 sm:pl-6 sm:pt-6",children:e("div",{className:i("shrink-0 rounded-2xl border border-slate-200 bg-white p-5 pr-3 text-base leading-loose text-gray-800 shadow-[0_8px_24px_rgba(15,23,42,0.04)]",!y&&"whitespace-pre-line"),children:R.map((t,a)=>{const l=t.match(/^\{(\d+)\}$/);if(!l)return e("span",{children:t},a);const n=parseInt(l[1],10),s=j[n]||"",o=M?.[n],c=Boolean(o),m=o||s;if(y&&!c&&C){const t=C[`${x}-blank-${n}`]||"",l=!s,i=!l&&s.trim().toLowerCase()===t.trim().toLowerCase();return l?e("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-blue-400 px-1 py-0.5 text-center text-blue-600",children:t||"___"},a):i?e("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-green-500 px-1 py-0.5 text-center text-green-700",children:s},a):r("span",{className:"mx-1 inline-block min-w-[80px] border-b-2 border-red-400 px-1 py-0.5 text-center",children:[e("span",{className:"text-red-500 line-through",children:s}),t&&r("span",{className:"ml-1 text-green-600",children:["→ ",t]})]},a)}if("WITH_OPTIONS"===f){if(c)return e("span",{className:"mx-1 inline-block min-w-[60px] border-b-2 border-amber-400 bg-amber-50 px-2 py-0.5 text-center text-sm font-bold text-amber-700 align-baseline",children:o||"___"},a);const t=$[n]?.options||[];return r("select",{value:s,onChange:e=>((e,r)=>{r?B(e,r):E(e)})(n,e.target.value),disabled:y,className:"mx-1 inline-block min-w-[100px] rounded border-2 border-blue-300 bg-blue-50 px-2 py-0.5 text-center text-sm font-medium outline-none focus:border-blue-500",children:[e("option",{value:"",children:"___"}),t.map(r=>e("option",{value:r,children:r},r))]},a)}if("DEFAULT"===f){const t=c?String(o||""):j[n]||"";return r("span",{className:"mx-0.5 inline-flex items-baseline gap-0.5 align-baseline",children:[r("span",{className:"text-[11px] font-bold text-blue-400",children:["(",n+1,")"]}),e("input",{type:"text",value:t,onChange:e=>{if(c)return;const r=[...j];r[n]=e.target.value,N(x,r)},disabled:y||!!c,placeholder:"·········",style:{width:`${Math.max(10,t.length+1)}ch`},className:i("inline-block min-w-[10ch] max-w-[12ch] border-b-2 bg-transparent px-0.5 py-0 text-center text-sm font-medium outline-none transition-colors",t?"border-emerald-400 text-emerald-700":"border-slate-300 text-slate-500","focus:border-blue-500 focus:text-blue-700","disabled:opacity-60")})]},a)}return"WITH_WORD_BANK"===f?e(d,{blankIndex:n,value:m||"",isExampleBlank:c,isReviewMode:y,onInputChange:e=>B(n,e),onClear:()=>E(n)},a):e("span",{children:t},a)})})})]})}

package/dist/components/exams/take/components/question-renderers/MoversWordFillStructuredFormRenderer.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { WordFillStructuredFormQuestion } from '../../utils/question-transformers';
+interface MoversWordFillStructuredFormRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    audioUrl?: string;
+    groupTitle?: string;
+    groupContent?: string;
+    groupImageUrl?: string;
+    questions: WordFillStructuredFormQuestion[];
+    answers: Record<string, any>;
+    onAnswerChange: (questionId: string, value: any) => void;
+    isReviewMode?: boolean;
+}
+export declare function MoversWordFillStructuredFormRenderer({ partNumber, partName, questionCount, instruction, audioUrl, groupTitle, groupContent, groupImageUrl, questions, answers, onAnswerChange, isReviewMode, }: MoversWordFillStructuredFormRendererProps): React.JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversWordFillStructuredFormRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useRef as t,useEffect as n,useMemo as a,useCallback as s,memo as l}from"react";import{ResolvedImage as i}from"../../../../../components/common/ResolvedImage";import o from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import d from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";import c from"../../../../../components/themes/cambridge-yle/CambridgeYleAudioPlayer";import{cn as m}from"../../../../../shared/lib/utils";function u(e,r){const t=e.trim();return r?t:t.toLowerCase()}const p={},g=l(function({question:s,initialAnswers:l,onBlankChange:o,isReviewMode:d}){const c=t(null),p=t(o);p.current=o;const g=t(!1),b=t(l),x=a(()=>s.content.replace(/\{([\w\d]+)\}/g,(e,r)=>`\n      <span class="structured-blank-wrapper" data-blank-wrapper="${r}">\n        <input type="text" data-blank-key="${r}" placeholder="______" class="structured-blank-input" />\n        <span class="structured-blank-hint" data-blank-hint="${r}"></span>\n      </span>\n    `),[s.content]);return n(()=>{const e=c.current;if(!e)return;g.current||(e.innerHTML=x,g.current=!0);const r=e.querySelectorAll("input.structured-blank-input"),t=[];return r.forEach(r=>{const n=r.getAttribute("data-blank-key")||"",a=e.querySelector(`[data-blank-wrapper="${n}"]`),l=e.querySelector(`[data-blank-hint="${n}"]`),i=b.current[n]||"",o=s.answers[n]||"",c=i.trim().length>0,g=c&&u(i,s.caseSensitive)===u(o,s.caseSensitive),x=d&&!g&&o.trim().length>0;r.value=x?`${c?i:"(trống)"} → ${o}`:i,r.disabled=d,r.className=m("structured-blank-input inline-block min-w-[88px] max-w-[180px] border-b-2 bg-transparent px-1 py-0.5 text-sm font-semibold outline-none transition-all align-baseline",d?g?"border-green-500 bg-green-50 text-green-700":c?"border-red-500 bg-red-50 text-red-700":"border-amber-500 bg-amber-50 text-amber-700":"border-gray-300 text-gray-800 focus:border-teal-500"),a&&(a.className=m("structured-blank-wrapper inline-flex flex-col align-top",d&&"mx-1 my-0.5")),l&&(l.textContent="",l.className="structured-blank-hint hidden");const h=e=>{const r=e.target;p.current(n,r.value)};r.addEventListener("input",h),t.push({el:r,handler:h})}),()=>{t.forEach(({el:e,handler:r})=>{e.removeEventListener("input",r)})}},[x,d]),r("div",{className:"space-y-3",children:[s.title&&e("h3",{className:"text-base font-semibold text-gray-800",children:s.title}),s.imageUrl&&e("div",{className:"flex justify-center",children:e("div",{className:"overflow-hidden rounded-lg border border-gray-200",children:e(i,{src:s.imageUrl,alt:s.title||"Question image",className:"max-h-48 w-auto object-contain"})})}),e("div",{ref:c,className:"structured-form-content rounded-lg border border-gray-200 bg-gradient-to-r from-gray-50 to-slate-50 p-4 text-sm leading-relaxed text-gray-800 [&_.structured-blank-wrapper]:inline-flex [&_.structured-blank-wrapper]:align-top [&_.structured-blank-hint]:max-w-[180px]"}),d&&r("div",{className:"space-y-2 rounded-lg border border-slate-200 bg-slate-50 p-3",children:[r("div",{className:"flex flex-wrap gap-2 text-[11px] font-medium",children:[r("span",{className:"inline-flex items-center gap-1 rounded-full bg-green-100 px-2 py-1 text-green-700",children:[e("span",{className:"h-2 w-2 rounded-full bg-green-500"}),"Đúng"]}),r("span",{className:"inline-flex items-center gap-1 rounded-full bg-red-100 px-2 py-1 text-red-700",children:[e("span",{className:"h-2 w-2 rounded-full bg-red-500"}),"Sai"]}),r("span",{className:"inline-flex items-center gap-1 rounded-full bg-amber-100 px-2 py-1 text-amber-700",children:[e("span",{className:"h-2 w-2 rounded-full bg-amber-500"}),"Chưa trả lời"]})]}),r("div",{children:[e("span",{className:"text-[10px] font-medium uppercase tracking-wider text-slate-500",children:"Đáp án đúng"}),e("div",{className:"mt-1 flex flex-wrap gap-1.5",children:Object.entries(s.answers).map(([e,t])=>r("span",{className:"rounded border border-green-300 bg-green-100 px-2 py-0.5 text-xs font-semibold text-green-800",children:[e,": ",t]},e))})]})]})]})});export function MoversWordFillStructuredFormRenderer({partNumber:n,partName:l,questionCount:m,instruction:u,audioUrl:b,groupTitle:x,groupContent:h,groupImageUrl:f,questions:w,answers:N,onAnswerChange:v,isReviewMode:y=!1}){const k=t(N);k.current=N;const C=t(v);C.current=v;const _=s((e,r,t)=>{const n=k.current[e]||{};C.current(e,{...n,[r]:t})},[]),q=a(()=>{const e={};return w.forEach(r=>{e[r.id]=(e,t)=>_(r.id,e,t)}),e},[w,_]);return r("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar",children:[r("div",{className:"flex flex-col gap-4 p-3 sm:px-6 sm:pt-2",children:[e(o,{partNumber:n,questionCount:m,partName:l,isReviewMode:y}),e(d,{instruction:u,isReviewMode:y}),x&&e("h2",{className:"text-center text-xl font-bold uppercase text-coral-500",children:x}),b&&e(c,{audioSrc:b,compact:!0}),f&&e("div",{className:"flex items-center justify-center",children:e(i,{src:f,alt:x||"Group image",className:"max-h-[300px] rounded-lg object-contain shadow-md"})}),h&&e("div",{className:"article-content rounded-lg bg-amber-50 p-4 text-sm leading-relaxed text-gray-700 max-h-[500px] overflow-y-auto pr-2 custom-scrollbar",dangerouslySetInnerHTML:{__html:h}})]}),w.length>0&&e("div",{className:"px-3 sm:px-6",children:e("hr",{className:"border-t border-slate-200/60 my-1"})}),e("div",{className:"grid grid-cols-1 gap-4 sm:gap-5 p-3 sm:px-6 sm:pb-6",children:w.map(t=>r("div",{id:`question-${t.id}`,className:"rounded-xl border border-gray-200 bg-white p-4 shadow-sm transition-all hover:border-indigo-200 hover:shadow-md",children:[e("div",{className:"mb-2 flex items-center gap-2",children:e("span",{className:"flex h-7 w-7 items-center justify-center rounded-full bg-gradient-to-br from-indigo-500 to-violet-600 text-xs font-bold text-white shadow-sm",children:t.questionNumber})}),e(g,{question:t,initialAnswers:N[t.id]||p,onBlankChange:q[t.id],isReviewMode:y})]},t.id))})]})}

package/dist/components/exams/take/components/question-renderers/MoversWordOrderingRenderer.d.ts

@@ -0,0 +1,19 @@
+/**
+ * WORD_ORDERING Renderer - Click letters/words in order to form a word
+ * Used in Starters P7
+ */
+import type { WordOrderingQuestion } from '../../utils/question-transformers';
+interface MoversWordOrderingRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    questions: WordOrderingQuestion[];
+    answers: Record<string, string[]>;
+    onAnswerChange: (questionId: string, value: string[]) => void;
+    isReviewMode?: boolean;
+    rawCorrectAnswerMap?: Record<string, any>;
+    isCorrectMap?: Record<string, boolean | null>;
+}
+export declare function MoversWordOrderingRenderer({ partNumber, partName, questionCount, instruction, questions, answers, onAnswerChange, isReviewMode, rawCorrectAnswerMap, isCorrectMap, }: MoversWordOrderingRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversWordOrderingRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import{ResolvedImage as t}from"../../../../../components/common/ResolvedImage";import a from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import s from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";import{CheckCircle2 as l,XCircle as o}from"lucide-react";export function MoversWordOrderingRenderer({partNumber:d,partName:i,questionCount:n,instruction:m,questions:c,answers:b,onAnswerChange:p,isReviewMode:x=!1,rawCorrectAnswerMap:g={},isCorrectMap:u={}}){return r("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar",children:[r("div",{className:"flex flex-col gap-2 sm:gap-3 p-3 sm:px-6 sm:pt-2",children:[e(a,{partNumber:d,questionCount:n,partName:i,isReviewMode:x}),e(s,{instruction:m,isReviewMode:x})]}),e("div",{className:"p-3 sm:pb-6 sm:px-6 grid grid-cols-1 gap-6 sm:grid-cols-2",children:c.map(a=>{const s=a.isExample?a.exampleAnswer:b[a.id],d=Array.isArray(s)?s:[],i=x||a.isExample,n=e=>e.trim().replace(/[.,?!]+$/,"").toLowerCase(),m=new Set;d.forEach(e=>{const r=a.words.findIndex((r,t)=>n(r)===n(e)&&!m.has(t));-1!==r&&m.add(r)});const c=x&&!a.isExample&&!0===u[a.id],f=x&&!a.isExample&&!1===u[a.id],h=a.isExample?"border-amber-200 bg-white/90 shadow-inner shadow-amber-100/60":c?"border-emerald-300 bg-emerald-50/80":f?"border-red-300 bg-red-50/80":"border-slate-100 bg-slate-50",w=a.isExample?"text-amber-600":c?"text-emerald-600":f?"text-red-500":"text-slate-400",v=a.isExample?"border-amber-400 bg-amber-100 text-amber-800":c?"border-emerald-400 bg-emerald-100 text-emerald-700":f?"border-red-400 bg-red-100 text-red-700":"border-emerald-400 bg-emerald-50 text-emerald-700 hover:bg-emerald-100";return r("div",{id:`question-${a.id}`,className:"relative flex flex-col items-center gap-4 rounded-2xl border-2 p-5 shadow-sm transition-all "+(a.isExample?"border-amber-300 bg-gradient-to-br from-amber-50 via-orange-50 to-white shadow-amber-100/70":c?"border-emerald-300 bg-gradient-to-br from-emerald-50/60 via-white to-white shadow-emerald-100/50":f?"border-red-200 bg-gradient-to-br from-red-50/40 via-white to-white shadow-red-100/40":"border-slate-200 bg-white hover:border-blue-200 hover:shadow-md"),children:[r("div",{className:"mb-2 flex w-full items-center justify-between",children:[e("span",{className:"flex h-8 w-8 items-center justify-center rounded-full text-sm font-bold text-white shadow-sm "+(a.isExample?"bg-gradient-to-br from-amber-400 to-orange-500":c?"bg-gradient-to-br from-emerald-400 to-green-500":f?"bg-gradient-to-br from-red-400 to-rose-500":"bg-blue-500"),children:a.questionNumber}),a.isExample&&e("span",{className:"inline-flex items-center rounded-full border border-amber-300 bg-gradient-to-r from-amber-100 to-orange-100 px-3 py-1 text-xs font-extrabold uppercase tracking-[0.16em] text-amber-700 shadow-sm",children:"Example"}),c&&r("span",{className:"inline-flex items-center gap-1 rounded-full border border-emerald-300 bg-gradient-to-r from-emerald-100 to-green-100 px-3 py-1 text-xs font-extrabold uppercase tracking-[0.16em] text-emerald-700 shadow-sm",children:[e(l,{className:"h-3.5 w-3.5"}),"Đúng"]}),f&&r("span",{className:"inline-flex items-center gap-1 rounded-full border border-red-300 bg-gradient-to-r from-red-100 to-rose-100 px-3 py-1 text-xs font-extrabold uppercase tracking-[0.16em] text-red-600 shadow-sm",children:[e(o,{className:"h-3.5 w-3.5"}),"Sai"]})]}),a.imageUrl&&e("div",{className:"mb-2 flex h-40 w-full justify-center sm:h-48",children:e(t,{src:a.imageUrl,alt:`Q${a.questionNumber}`,className:"h-full w-auto rounded-xl object-contain drop-shadow-sm"})}),e("div",{className:"flex flex-wrap justify-center gap-2",children:a.words.map((r,t)=>{const s=m.has(t);let l=r;if(a.isExample&&a.exampleAnswer){const e=a.exampleAnswer.find(e=>n(e)===n(r));e&&(l=e)}return e("button",{type:"button",disabled:i||s,onClick:()=>((e,r,t)=>{p(e,[...t,r])})(a.id,l,d),className:`flex min-w-[2.5rem] items-center justify-center rounded-lg border-2 px-3 py-2 text-lg font-bold transition-all ${s?"border-slate-200 bg-slate-100 text-slate-300":"border-blue-400 bg-blue-50 text-blue-700 shadow-sm hover:-translate-y-0.5 hover:bg-blue-100 hover:shadow"} ${i?"cursor-not-allowed":"cursor-pointer"}`,children:l},t)})}),r("div",{className:`mt-2 w-full rounded-xl border p-4 ${h}`,children:[e("div",{className:`mb-2 text-center text-xs font-medium uppercase tracking-wider ${w}`,children:"Your Answer"}),e("div",{className:"flex min-h-[3rem] flex-wrap items-center justify-center gap-2",children:d.length>0?d.map((r,t)=>e("button",{type:"button",disabled:i,onClick:()=>((e,r,t)=>{const a=[...t];a.splice(r,1),p(e,a)})(a.id,t,d),className:`flex min-w-[2.5rem] items-center justify-center rounded-lg border-2 px-3 py-2 text-lg font-bold shadow-sm transition-all disabled:cursor-not-allowed ${v}`,title:i?"":"Click to remove",children:r},t)):e("span",{className:"text-sm italic "+(a.isExample?"text-amber-500":"text-slate-400"),children:a.isExample?"Example answer is shown here":"Click letters above to answer"})})]}),f&&(()=>{const t=g[a.id]?.answer;return Array.isArray(t)&&0!==t.length?r("div",{className:"mt-3 w-full rounded-xl border-2 border-emerald-300 bg-gradient-to-br from-emerald-50 to-green-50 p-4",children:[r("div",{className:"mb-2 flex items-center justify-center gap-1.5 text-xs font-medium uppercase tracking-wider text-emerald-600",children:[e(l,{className:"h-3.5 w-3.5"}),"Đáp án đúng"]}),e("div",{className:"flex min-h-[3rem] flex-wrap items-center justify-center gap-2",children:t.map((r,t)=>e("div",{className:"flex min-w-[2.5rem] items-center justify-center rounded-lg border-2 border-emerald-400 bg-emerald-100 px-3 py-2 text-lg font-bold text-emerald-800 shadow-sm",children:r},t))})]}):null})()]},a.id)})})]})}

package/dist/components/exams/take/components/question-renderers/MoversWriteSentencesRenderer.d.ts

@@ -0,0 +1,22 @@
+/**
+ * WRITE_SENTENCES Renderer - Free-form text input per question
+ * Used in Movers P11 section 3
+ */
+interface MoversWriteSentencesRendererProps {
+    partNumber: number;
+    partName?: string;
+    questionCount: number;
+    instruction: string;
+    imageUrl?: string;
+    title?: string;
+    groupContent?: string;
+    questions: Array<{
+        id: string;
+        questionNumber: number;
+    }>;
+    answers: Record<string, string>;
+    onAnswerChange: (questionId: string, value: string) => void;
+    isReviewMode?: boolean;
+}
+export declare function MoversWriteSentencesRenderer({ partNumber, partName, questionCount, instruction, imageUrl, title, groupContent, questions, answers, onAnswerChange, isReviewMode, }: MoversWriteSentencesRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversWriteSentencesRenderer.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{ResolvedImage as r}from"../../../../../components/common/ResolvedImage";import s from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import a from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";export function MoversWriteSentencesRenderer({partNumber:o,partName:n,questionCount:i,instruction:l,imageUrl:m,title:d,groupContent:c,questions:p,answers:u,onAnswerChange:g,isReviewMode:x=!1}){return t("div",{className:"grid h-full grid-cols-1 gap-4 sm:gap-6 "+(x?"":"lg:grid-cols-2"),children:[t("div",{className:"flex flex-col gap-4 overflow-y-auto p-3 sm:pb-6 sm:pr-6 sm:pt-6",children:[e(s,{partNumber:o,questionCount:i,partName:n,isReviewMode:x}),e(a,{instruction:l,isReviewMode:x}),m&&e("div",{className:"flex items-center justify-center",children:e(r,{src:m,alt:"Illustration",className:"max-h-[300px] rounded-lg object-contain shadow-md"})}),c&&e("div",{className:"rounded-lg bg-amber-50 p-4 text-sm leading-relaxed text-gray-700",children:c})]}),t("div",{className:"flex flex-col gap-4 overflow-y-auto p-3 sm:gap-5 sm:pb-6 sm:pl-6 sm:pt-6",children:[d&&e("h2",{className:"text-center text-2xl font-bold uppercase text-coral-500",children:d}),p.map(r=>t("div",{id:`question-${r.id}`,className:"flex items-start gap-3",children:[e("span",{className:"flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-full bg-blue-500 text-sm font-bold text-white",children:r.questionNumber}),e("textarea",{value:u[r.id]||"",onChange:e=>g(r.id,e.target.value),disabled:x,placeholder:"Write your sentence...",rows:2,className:"flex-1 resize-none rounded-lg border-2 border-gray-300 bg-white px-3 py-2 text-base outline-none transition-colors focus:border-blue-500 disabled:opacity-60"})]},r.id))]})]})}

package/dist/components/exams/take/components/question-renderers/MoversWritingRenderer.d.ts

@@ -0,0 +1,18 @@
+interface MoversWritingRendererProps {
+    partNumber: number;
+    partName?: string;
+    instruction?: string;
+    prompt: string;
+    requirements?: string[];
+    minWords?: number;
+    maxWords?: number;
+    answer: string;
+    onAnswerChange: (value: string) => void;
+    isReviewMode?: boolean;
+    guideImages?: string[];
+    teacherScore?: number | null;
+    maxScore?: number;
+    teacherFeedback?: string | null;
+}
+export declare function MoversWritingRenderer({ partNumber, partName, instruction, prompt, requirements, minWords, maxWords, answer, onAnswerChange, isReviewMode, guideImages, teacherScore, maxScore, teacherFeedback, }: MoversWritingRendererProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/question-renderers/MoversWritingRenderer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{useMemo as s}from"react";import{ResolvedImage as a}from"../../../../../components/common/ResolvedImage";import l from"../../../../../components/themes/cambridge-yle/CambridgeYlePartBanner";import i from"../../../../../components/themes/cambridge-yle/CambridgeYleInstructionBanner";export function MoversWritingRenderer({partNumber:d,partName:n,instruction:m,prompt:c,requirements:o,minWords:p,maxWords:x,answer:b,onAnswerChange:h,isReviewMode:g=!1,guideImages:u,teacherScore:f,maxScore:N,teacherFeedback:w}){const v=s(()=>b&&b.trim()?b.trim().split(/\s+/).filter(Boolean).length:0,[b]);return r("div",{className:"flex flex-col h-full gap-4 sm:gap-6 overflow-y-auto custom-scrollbar relative",children:[r("div",{className:"flex flex-col gap-2 sm:gap-3 p-3 sm:px-6 sm:pt-4",children:[e(l,{partNumber:d,questionCount:1,partName:n,isReviewMode:g}),m&&e(i,{instruction:m,isReviewMode:g})]}),e("div",{className:"flex flex-col gap-4 p-3 sm:px-6 sm:pt-0 sticky top-0 z-20 bg-white/95 backdrop-blur pb-2 shadow-sm border-b border-gray-100",children:r("div",{className:"flex flex-col gap-4",children:[e("div",{className:"rounded-2xl border border-slate-200 bg-white p-5 shadow-sm",children:r("div",{className:"flex flex-col gap-4 text-base leading-relaxed text-gray-800",children:[r("div",{className:"space-y-3",children:[e("p",{className:"text-lg font-semibold text-slate-900",children:"Writing task"}),e("p",{children:c})]}),o&&o.length>0&&r("div",{className:"rounded-xl bg-slate-50 p-4",children:[e("p",{className:"text-sm font-bold uppercase tracking-wide text-slate-700",children:"Include"}),e("ul",{className:"mt-3 space-y-2",children:o.map((t,s)=>r("li",{className:"flex items-start gap-2 text-sm text-slate-700",children:[e("span",{className:"mt-1.5 h-2 w-2 rounded-full bg-blue-500"}),e("span",{children:t})]},s))})]}),(p||x)&&r("div",{className:"flex flex-wrap gap-2",children:[p&&r("div",{className:"inline-flex items-center rounded-full border border-blue-200 bg-blue-50 px-3 py-1 text-sm font-medium text-blue-700",children:["Minimum: ",p," words"]}),x&&r("div",{className:"inline-flex items-center rounded-full border border-slate-200 bg-white px-3 py-1 text-sm font-medium text-slate-600",children:["Suggested max: ",x," words"]})]})]})}),u&&u.length>0&&r("div",{className:"rounded-2xl border border-slate-200 bg-white p-4 shadow-sm",children:[r("div",{className:"mb-3 flex items-center justify-between gap-3",children:[e("p",{className:"text-sm font-semibold uppercase tracking-wide text-slate-600",children:"Story pictures"}),e("p",{className:"text-xs text-slate-400",children:"Read the sequence from left to right"})]}),e("div",{className:"grid gap-4 "+(1===u.length?"grid-cols-1":"grid-cols-1 sm:grid-cols-2"),children:u.map((t,s)=>r("div",{className:"rounded-xl border border-slate-200 bg-slate-50/80 p-2 shadow-sm",children:[e(a,{src:t,alt:`Picture ${s+1}`,className:"w-full rounded-lg bg-white object-contain "+(1===u.length?"max-h-[400px]":"aspect-[4/3]")}),e("div",{className:"pt-2 text-center text-[13px] font-medium text-slate-500",children:u.length>1?`Picture ${s+1}`:"Reference Image"})]},s))})]})]})}),r("div",{className:"flex flex-col gap-3 p-3 sm:px-6 sm:pb-6",children:[r("div",{className:"rounded-2xl border border-slate-200 bg-white shadow-sm",children:[r("div",{className:"flex items-center justify-between gap-3 border-b border-slate-100 px-5 py-3 bg-slate-50/50 rounded-t-2xl",children:[r("div",{children:[e("p",{className:"text-sm font-semibold uppercase tracking-wide text-slate-500",children:"Your answer"}),e("p",{className:"text-xs text-slate-400",children:"Write clearly and organise your ideas in order."})]}),r("div",{className:"rounded-full px-3 py-1 text-sm font-semibold "+(p&&v<p?"border border-amber-200 bg-amber-50 text-amber-700":"border border-emerald-200 bg-emerald-50 text-emerald-700"),children:[v," words"]})]}),r("div",{className:"p-4",children:[e("textarea",{id:"writing-answer",name:"writing-answer",value:b,onChange:e=>{const r=e.target.value;if(x){const e=Number(x);if((r.trim()?r.trim().split(/\s+/).filter(Boolean).length:0)>e&&r.length>=(b?.length||0))return}h(r)},disabled:g,placeholder:"Write your answer here...",className:"min-h-[340px] w-full resize-y rounded-xl border border-slate-200 bg-slate-50/50 p-4 text-base leading-8 text-gray-800 outline-none transition focus:border-blue-400 focus:bg-white focus:ring-2 focus:ring-blue-100 disabled:bg-gray-50 disabled:text-gray-700"}),r("div",{className:"mt-3 flex flex-wrap items-center justify-between gap-3 text-sm",children:[e("p",{className:"text-slate-500",children:p||x?r(t,{children:[p&&r("span",{children:["Minimum required: ",r("span",{className:"font-semibold text-slate-700",children:[p," words"]})]}),p&&x&&e("span",{className:"mx-2 text-slate-300",children:"|"}),x&&r("span",{children:["Maximum allowed: ",r("span",{className:"font-semibold text-slate-700",children:[x," words"]})]})]}):"Write a complete answer."}),r("p",{className:"font-medium "+(x&&v>=x?"text-red-500":"text-slate-500"),children:["Word count: ",v," ",x&&`/ ${x}`]})]})]})]}),g&&(null!=f?r("div",{className:"mt-1 rounded-2xl border border-green-200 bg-green-50 p-4",children:[e("div",{className:"mb-2 flex items-center gap-2",children:r("span",{className:"text-lg font-semibold text-green-700",children:["Điểm: ",f,"/",N]})}),w&&r("div",{className:"text-sm text-gray-700",children:[e("span",{className:"font-medium",children:"Nhận xét:"})," ",w]})]}):e("div",{className:"mt-1 rounded-2xl border border-amber-200 bg-amber-50 p-4",children:r("div",{className:"flex items-center gap-2",children:[e("svg",{className:"h-5 w-5 shrink-0 text-amber-500",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"})}),e("span",{className:"text-sm font-medium text-amber-700",children:"Bài viết đang chờ giáo viên chấm điểm"})]})}))]})]})}

package/dist/components/exams/take/components/question-renderers/index.d.ts

@@ -0,0 +1,19 @@
+export { MoversListenAndWriteRenderer } from './MoversListenAndWriteRenderer';
+export { MoversColoringRenderer } from './MoversColoringRenderer';
+export { MoversChooseBestAnswerRenderer } from './MoversChooseBestAnswerRenderer';
+export { MoversChooseAdjectiveRenderer } from './MoversChooseAdjectiveRenderer';
+export { MoversWritingRenderer } from './MoversWritingRenderer';
+export { MoversPictureChooseRenderer } from './MoversPictureChooseRenderer';
+export { MoversPictureFillBlankChooseRenderer } from './MoversPictureFillBlankChooseRenderer';
+export { MoversReadingPassageRenderer } from './MoversReadingPassageRenderer';
+export { MoversLabelThePictureRenderer } from './MoversLabelThePictureRenderer';
+export { MoversFillWordHintRenderer } from './MoversFillWordHintRenderer';
+export { MoversGridFillRenderer } from './MoversGridFillRenderer';
+export { MoversTrueFalseRenderer } from './MoversTrueFalseRenderer';
+export { MoversAnswerTheQuestionRenderer } from './MoversAnswerTheQuestionRenderer';
+export { MoversWriteSentencesRenderer } from './MoversWriteSentencesRenderer';
+export { MoversWordOrderingRenderer } from './MoversWordOrderingRenderer';
+export { MoversWordFillParagraphRenderer } from './MoversWordFillParagraphRenderer';
+export { MoversMatchByWritingAnswerRenderer } from './MoversMatchByWritingAnswerRenderer';
+export { MoversWordFillStructuredFormRenderer } from './MoversWordFillStructuredFormRenderer';
+export { ArticlesViewer } from './ArticlesViewer';

package/dist/components/exams/take/components/question-renderers/index.js

@@ -0,0 +1 @@
+export{MoversListenAndWriteRenderer}from"./MoversListenAndWriteRenderer";export{MoversColoringRenderer}from"./MoversColoringRenderer";export{MoversChooseBestAnswerRenderer}from"./MoversChooseBestAnswerRenderer";export{MoversChooseAdjectiveRenderer}from"./MoversChooseAdjectiveRenderer";export{MoversWritingRenderer}from"./MoversWritingRenderer";export{MoversPictureChooseRenderer}from"./MoversPictureChooseRenderer";export{MoversPictureFillBlankChooseRenderer}from"./MoversPictureFillBlankChooseRenderer";export{MoversReadingPassageRenderer}from"./MoversReadingPassageRenderer";export{MoversLabelThePictureRenderer}from"./MoversLabelThePictureRenderer";export{MoversFillWordHintRenderer}from"./MoversFillWordHintRenderer";export{MoversGridFillRenderer}from"./MoversGridFillRenderer";export{MoversTrueFalseRenderer}from"./MoversTrueFalseRenderer";export{MoversAnswerTheQuestionRenderer}from"./MoversAnswerTheQuestionRenderer";export{MoversWriteSentencesRenderer}from"./MoversWriteSentencesRenderer";export{MoversWordOrderingRenderer}from"./MoversWordOrderingRenderer";export{MoversWordFillParagraphRenderer}from"./MoversWordFillParagraphRenderer";export{MoversMatchByWritingAnswerRenderer}from"./MoversMatchByWritingAnswerRenderer";export{MoversWordFillStructuredFormRenderer}from"./MoversWordFillStructuredFormRenderer";export{ArticlesViewer}from"./ArticlesViewer";

package/dist/components/exams/take/components/speaking/FindObjectInPicture.module.css

@@ -0,0 +1,133 @@
+/* ===== Find Object In Picture Container ===== */
+.findObjectContainer {
+  height: 100%;
+  width: 100%;
+  border-radius: 10px;
+  display: flex;
+  overflow-y: auto;
+  overflow-x: hidden;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+  padding: 0 30px;
+}
+
+.findObjectContainer::-webkit-scrollbar {
+  width: 8px;
+}
+
+.findObjectContainer::-webkit-scrollbar-track {
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
+  border-radius: 10px;
+}
+
+.findObjectContainer::-webkit-scrollbar-thumb {
+  background: #fff;
+  border-radius: 10px;
+}
+
+/* ===== Object Background (Scene Image Wrapper) ===== */
+.objectBackground {
+  position: relative;
+  top: 15px;
+}
+
+/* ===== Scene Image ===== */
+.imageBackground {
+  width: 900px;
+  height: auto;
+  padding: 5px;
+}
+
+.imageBackground img {
+  height: 100%;
+  width: 100%;
+  border-radius: 14px;
+}
+
+/* ===== Clickable Object Item ===== */
+.objectItem {
+  position: absolute;
+  transition: all 0.5s ease;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  padding: 0;
+}
+
+.objectItem:hover {
+  transform: scale(1.1);
+}
+
+.objectItem div {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  pointer-events: none;
+}
+
+.objectItemImageBorder {
+  pointer-events: none;
+  display: block;
+}
+
+/* ===== Selected State ===== */
+.objectItemSelected img {
+  filter: drop-shadow(2px 2px 0 #ff2323) drop-shadow(-2px 2px 0 #ff2323) drop-shadow(2px -2px 0 #ff2323) drop-shadow(-2px -2px 0 #ff2323);
+}
+
+/* ========== RESPONSIVE ========== */
+
+/* 1400px */
+@media (max-width: 1400px) {
+  .objectBackground {
+    position: relative;
+    top: 0px;
+  }
+
+  .imageBackground {
+    width: 755px;
+    height: 426.875px;
+    padding: 5px;
+  }
+
+  .imageBackground img {
+    border-radius: 10px;
+  }
+}
+
+/* 1024px */
+@media (max-width: 1024px) {
+  .objectBackground {
+    position: relative;
+    top: 0px;
+  }
+
+  .imageBackground {
+    width: 555px;
+    height: 314.375px;
+    padding: 5px;
+  }
+
+  .imageBackground img {
+    border-radius: 10px;
+  }
+}
+
+/* 768px */
+@media (max-width: 768px) {
+  .objectBackground {
+    position: relative;
+    top: 0px;
+  }
+
+  .imageBackground {
+    width: 353px;
+    height: 199.875px;
+    padding: 3px;
+  }
+
+  .imageBackground img {
+    border-radius: 10px;
+  }
+}

package/dist/components/exams/take/components/speaking/SpeakingAudioPlayer.d.ts

@@ -0,0 +1,9 @@
+interface SpeakingAudioPlayerProps {
+    audioUrl: string;
+    questionNumber: number;
+    className?: string;
+    /** Called when audio playback state changes (play/pause/ended) */
+    onPlayingChange?: (isPlaying: boolean) => void;
+}
+export declare function SpeakingAudioPlayer({ audioUrl, questionNumber, className, onPlayingChange }: SpeakingAudioPlayerProps): import("react").JSX.Element;
+export {};

package/dist/components/exams/take/components/speaking/SpeakingAudioPlayer.js

@@ -0,0 +1 @@
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as r,useState as n,useEffect as a}from"react";import{Pause as i,Play as s,Volume2 as o}from"lucide-react";import{cn as d}from"../../../../../shared/lib/utils";import{usePresignedFileUrl as l}from"../../../../../shared/lib/hooks/usePresignedFileUrl";function m(e){const t=Math.floor(e/60),r=Math.floor(e%60);return`${String(t).padStart(2,"0")}:${String(r).padStart(2,"0")}`}export function SpeakingAudioPlayer({audioUrl:c,questionNumber:u,className:h,onPlayingChange:b}){const p=r(null),[v,x]=n(!1),[g,f]=n(0),[w,k]=n(0),{previewUrl:N}=l(c||void 0);a(()=>{const e=p.current;if(!e)return;const t=()=>{e.duration&&!isNaN(e.duration)&&isFinite(e.duration)&&k(e.duration)},r=()=>{f(e.currentTime),t()},n=()=>{x(!1),f(0),b?.(!1)};return t(),e.addEventListener("loadedmetadata",t),e.addEventListener("durationchange",t),e.addEventListener("canplay",t),e.addEventListener("timeupdate",r),e.addEventListener("ended",n),()=>{e.removeEventListener("loadedmetadata",t),e.removeEventListener("durationchange",t),e.removeEventListener("canplay",t),e.removeEventListener("timeupdate",r),e.removeEventListener("ended",n)}},[N]),a(()=>{x(!1),f(0),k(0),b?.(!1)},[N,b]);const y=w>0?g/w*100:0;return t("div",{className:d("flex items-center gap-3 rounded-xl px-4 py-3","bg-gradient-to-r from-stone-800 via-stone-700 to-stone-800","border-2 border-stone-600","shadow-[0_4px_12px_rgba(0,0,0,0.5),inset_0_1px_0_rgba(255,255,255,0.05)]",h),children:[e("audio",{ref:p,...N?{src:N}:{},preload:"metadata"}),t("div",{className:"shrink-0",children:[e("span",{className:"text-xs font-bold uppercase tracking-wider text-amber-400",children:"Câu hỏi số"}),e("span",{className:"ml-1 text-base font-extrabold text-white",children:u})]}),e("div",{className:"h-8 w-px shrink-0 bg-stone-500"}),e("button",{type:"button",onClick:()=>{const e=p.current;e&&(v?(e.pause(),x(!1),b?.(!1)):(e.play(),x(!0),b?.(!0)))},className:"flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-stone-900 shadow-md transition-transform hover:scale-105 active:scale-95","aria-label":v?"Tạm dừng":"Phát",children:v?e(i,{className:"h-4 w-4 text-amber-400"}):e(s,{className:"ml-0.5 h-4 w-4 text-amber-400"})}),t("div",{className:"min-w-[80px] shrink-0 text-center text-sm font-medium tabular-nums text-stone-300",children:[m(g)," / ",m(w)]}),e("div",{className:"relative flex flex-1 items-center",children:e("input",{type:"range",min:"0",max:w||0,value:g,onChange:e=>{const t=p.current;if(!t)return;const r=parseFloat(e.target.value);t.currentTime=r,f(r)},className:"h-1.5 w-full cursor-pointer appearance-none rounded-full bg-stone-600 accent-amber-400 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-3 [&::-webkit-slider-thumb]:w-3 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-amber-400 [&::-webkit-slider-thumb]:shadow-md",style:{background:`linear-gradient(to right, rgb(251 191 36) ${y}%, rgb(87 83 78) ${y}%)`}})}),e(o,{className:"h-4 w-4 shrink-0 text-stone-400","aria-hidden":"true"})]})}