@tinyweb_dev/oe-exam-sdk 0.1.6 → 0.1.8

package/dist/components/themes/english-certification/EnglishCertificationSingleQuestionList.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import{EnglishCertificationAudioPlayer as n}from"./EnglishCertificationAudioPlayer";import{EnglishCertificationQuestionItem as t}from"./EnglishCertificationQuestionItem";import{ENGLISH_CERT_CONTENT_WIDTH_CLASS as o}from"./english-certification-theme";export function englishCertQuestionDomId(e){return`ec-question-${e}`}export function EnglishCertificationSingleQuestionList({part:r,partConfig:s,answers:a,flaggedQuestions:u,onAnswerChange:l,onToggleFlag:g,isReviewMode:d=!1,isListeningPart:m=!1,partAudioUrl:f}){const c=s.startIndex??0,p=Array.isArray(s.questionConfig)?s.questionConfig:[],h=s.defaultQuestion,C=m&&Boolean(f);return i("div",{className:"flex flex-col items-center gap-5 pb-4",children:[C&&e("div",{className:o,children:e(n,{audioUrl:f,partNumber:r.partNo})}),r.questions.map((i,n)=>{const o=i.audio_url?Array.from(new Set([...p,"audioUrl"])):p;return e(t,{domId:englishCertQuestionDomId(i.id),question:i,questionNumber:c+n+1,questionConfig:o,defaultQuestion:h,isListeningPart:m,answer:a[i.id],isFlagged:u.has(i.id),onAnswerChange:l,onToggleFlag:g,isReviewMode:d},i.id)})]})}
+"use client";import{jsx as i,jsxs as e}from"react/jsx-runtime";import{EnglishCertificationAudioPlayer as t}from"./EnglishCertificationAudioPlayer";import{EnglishCertificationQuestionItem as o}from"./EnglishCertificationQuestionItem";import{ENGLISH_CERT_CONTENT_WIDTH_CLASS as n}from"./english-certification-theme";import{ENGLISH_CERT_STICKY_AUDIO_ATTR as r,englishCertQuestionDomId as s}from"./english-cert-scroll";export function EnglishCertificationSingleQuestionList({part:a,partConfig:l,answers:u,flaggedQuestions:g,onAnswerChange:d,onToggleFlag:m,isReviewMode:f=!1,isListeningPart:c=!1,partAudioUrl:p}){const h=l.startIndex??0,C=Array.isArray(l.questionConfig)?l.questionConfig:[],w=l.defaultQuestion,x=c&&Boolean(p);return e("div",{className:"flex flex-col items-center gap-5 pb-4",children:[x&&i("div",{[r]:"",className:`sticky top-0 z-20 ${n}`,children:i(t,{audioUrl:p,partNumber:a.partNo})}),a.questions.map((e,t)=>{const n=e.audio_url?Array.from(new Set([...C,"audioUrl"])):C;return i(o,{domId:s(e.id),question:e,questionNumber:h+t+1,questionConfig:n,defaultQuestion:w,isListeningPart:c,answer:u[e.id],isFlagged:g.has(e.id),onAnswerChange:d,onToggleFlag:m,isReviewMode:f},e.id)})]})}

package/dist/components/themes/english-certification/english-cert-scroll.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Scroll helpers for English Certification Answer Sheet navigation.
+ *
+ * Question cards use a stable DOM id (`ec-question-{id}`) so the sidebar can
+ * jump to the chosen question after `goToQuestion` re-renders the active part.
+ *
+ * Listening parts pin the audio bar with `position: sticky`. Manual scroll must
+ * subtract that bar's height so the target card is not hidden underneath it.
+ */
+/** Stable DOM id for a question card / row, used for Answer-Sheet scroll-to. */
+export declare function englishCertQuestionDomId(questionId: string): string;
+/** Marker on sticky audio wrappers so scroll offset can be measured at runtime. */
+export declare const ENGLISH_CERT_STICKY_AUDIO_ATTR = "data-ec-sticky-audio";
+/** Nearest ancestor that actually scrolls (falls back to document scrolling element). */
+export declare function findScrollableParent(el: HTMLElement): HTMLElement;
+/**
+ * Scroll `el` into view inside its nearest scrollable ancestor.
+ * Prefer parent-relative scroll so nested columns (Reading split-view) work.
+ * When a sticky Listening audio bar is present, leave room under it.
+ */
+export declare function scrollElementIntoView(el: HTMLElement, options?: {
+    behavior?: ScrollBehavior;
+    block?: ScrollLogicalPosition;
+}): void;
+/**
+ * Find the question anchor by id and scroll it into view.
+ * Retries briefly so cross-part navigation can wait for React to mount the card.
+ */
+export declare function scrollToEnglishCertQuestion(questionId: string, options?: {
+    behavior?: ScrollBehavior;
+    block?: ScrollLogicalPosition;
+}): void;

package/dist/components/themes/english-certification/english-cert-scroll.js

@@ -0,0 +1 @@
+export function englishCertQuestionDomId(t){return`ec-question-${t}`}export const ENGLISH_CERT_STICKY_AUDIO_ATTR="data-ec-sticky-audio";const t=[0,50,120,250,400];function e(t){const e=window.getComputedStyle(t).overflowY;return("auto"===e||"scroll"===e||"overlay"===e)&&t.scrollHeight>t.clientHeight+1}export function findScrollableParent(t){let n=t.parentElement;for(;n;){if(e(n))return n;n=n.parentElement}return document.scrollingElement??document.documentElement}export function scrollElementIntoView(t,e){const n=e?.behavior??"smooth",o=e?.block??"start",i=findScrollableParent(t),l=function(t,e){const n=t.querySelectorAll("[data-ec-sticky-audio]");if(!n.length)return 0;let o=0;return n.forEach(n=>{if(n===e||n.contains(e))return;if(!t.contains(n))return;const i=n.getBoundingClientRect().height;i>o&&(o=i)}),o>0?o+12:0}(i,t),r=i.getBoundingClientRect(),c=t.getBoundingClientRect(),s=i.scrollTop,u=c.top-r.top+s;let a=u;if("center"===o)a=u-i.clientHeight/2+c.height/2;else if("end"===o)a=u-i.clientHeight+c.height;else if("nearest"===o){const t=s+l,e=s+i.clientHeight,n=u+c.height;if(u>=t&&n<=e)return;a=u<t?u-l:n-i.clientHeight}else a=u-l;"start"===o&&0===l&&(a=Math.max(0,a-12)),i.scrollTo({top:Math.max(0,a),behavior:n})}export function scrollToEnglishCertQuestion(e,n){if("undefined"==typeof document||!e)return;const o=englishCertQuestionDomId(e);let i=0;const l=()=>{const e=document.getElementById(o);e?scrollElementIntoView(e,n):(i+=1,i<t.length&&window.setTimeout(l,t[i]))};window.setTimeout(l,t[0])}

package/dist/components/themes/english-certification/index.d.ts

@@ -6,11 +6,14 @@ export { EnglishCertificationFooterBar } from './EnglishCertificationFooterBar';
 export { EnglishCertificationOptionSelector } from './EnglishCertificationOptionSelector';
 export { EnglishCertificationAudioPlayer } from './EnglishCertificationAudioPlayer';
 export { EnglishCertificationSingleQuestion } from './EnglishCertificationSingleQuestion';
-export { EnglishCertificationSingleQuestionList, englishCertQuestionDomId, } from './EnglishCertificationSingleQuestionList';
+export { EnglishCertificationSingleQuestionList, } from './EnglishCertificationSingleQuestionList';
+export { ENGLISH_CERT_STICKY_AUDIO_ATTR, englishCertQuestionDomId, scrollToEnglishCertQuestion, } from './english-cert-scroll';
 export { EnglishCertificationGroupedQuestion } from './EnglishCertificationGroupedQuestion';
 export { EnglishCertificationReadingSection } from './EnglishCertificationReadingSection';
 export { EnglishCertificationFlagButton } from './EnglishCertificationFlagButton';
 export { EnglishCertificationBrand } from './EnglishCertificationBrand';
+export { EnglishCertificationPartHeader } from './EnglishCertificationPartHeader';
+export { EnglishCertificationInstructionBanner } from './EnglishCertificationInstructionBanner';
 export { EcWordFillStructuredForm } from './EcWordFillStructuredForm';
 export { EcMatchByWritingAnswer } from './EcMatchByWritingAnswer';
 export { EcAnswerTheQuestion } from './EcAnswerTheQuestion';

package/dist/components/themes/english-certification/index.js

@@ -1 +1 @@
-export{EnglishCertificationExamLayout}from"./EnglishCertificationExamLayout";export{EnglishCertificationQuestionRenderer}from"./EnglishCertificationQuestionRenderer";export{EnglishCertificationHeader}from"./EnglishCertificationHeader";export{EnglishCertificationNavigationPanel}from"./EnglishCertificationNavigationPanel";export{EnglishCertificationFooterBar}from"./EnglishCertificationFooterBar";export{EnglishCertificationOptionSelector}from"./EnglishCertificationOptionSelector";export{EnglishCertificationAudioPlayer}from"./EnglishCertificationAudioPlayer";export{EnglishCertificationSingleQuestion}from"./EnglishCertificationSingleQuestion";export{EnglishCertificationSingleQuestionList,englishCertQuestionDomId}from"./EnglishCertificationSingleQuestionList";export{EnglishCertificationGroupedQuestion}from"./EnglishCertificationGroupedQuestion";export{EnglishCertificationReadingSection}from"./EnglishCertificationReadingSection";export{EnglishCertificationFlagButton}from"./EnglishCertificationFlagButton";export{EnglishCertificationBrand}from"./EnglishCertificationBrand";export{EcWordFillStructuredForm}from"./EcWordFillStructuredForm";export{EcMatchByWritingAnswer}from"./EcMatchByWritingAnswer";export{EcAnswerTheQuestion}from"./EcAnswerTheQuestion";export{EcWordFillParagraph}from"./EcWordFillParagraph";export{EcWritingTask}from"./EcWritingTask";
+export{EnglishCertificationExamLayout}from"./EnglishCertificationExamLayout";export{EnglishCertificationQuestionRenderer}from"./EnglishCertificationQuestionRenderer";export{EnglishCertificationHeader}from"./EnglishCertificationHeader";export{EnglishCertificationNavigationPanel}from"./EnglishCertificationNavigationPanel";export{EnglishCertificationFooterBar}from"./EnglishCertificationFooterBar";export{EnglishCertificationOptionSelector}from"./EnglishCertificationOptionSelector";export{EnglishCertificationAudioPlayer}from"./EnglishCertificationAudioPlayer";export{EnglishCertificationSingleQuestion}from"./EnglishCertificationSingleQuestion";export{EnglishCertificationSingleQuestionList}from"./EnglishCertificationSingleQuestionList";export{ENGLISH_CERT_STICKY_AUDIO_ATTR,englishCertQuestionDomId,scrollToEnglishCertQuestion}from"./english-cert-scroll";export{EnglishCertificationGroupedQuestion}from"./EnglishCertificationGroupedQuestion";export{EnglishCertificationReadingSection}from"./EnglishCertificationReadingSection";export{EnglishCertificationFlagButton}from"./EnglishCertificationFlagButton";export{EnglishCertificationBrand}from"./EnglishCertificationBrand";export{EnglishCertificationPartHeader}from"./EnglishCertificationPartHeader";export{EnglishCertificationInstructionBanner}from"./EnglishCertificationInstructionBanner";export{EcWordFillStructuredForm}from"./EcWordFillStructuredForm";export{EcMatchByWritingAnswer}from"./EcMatchByWritingAnswer";export{EcAnswerTheQuestion}from"./EcAnswerTheQuestion";export{EcWordFillParagraph}from"./EcWordFillParagraph";export{EcWritingTask}from"./EcWritingTask";

package/dist/components/themes/index.d.ts

@@ -2,14 +2,12 @@ import type { ComponentType } from 'react';
 import type { SpeakingLayoutProps, StandardExamLayoutProps, StandardQuestionCardProps } from './types';
 export * from './cambridge-yle';
 export * from './english-certification';
-export * from './spaceship/SpaceshipLayout';
-export * from './spaceship/SpaceshipAudioPlayer';
 export * from './summer-sky/SummerSkyAudioPlayer';
 export * from './summer-sky/SummerSkyLayout';
 export * from './summer-sky/SummerSkySubmitModal';
 export * from './summer-sky/SummerSkyWaitingRoom';
 export type * from './types';
-export type SpeakingThemeId = 'SPACESHIP' | 'SUMMER_SKY' | string;
+export type SpeakingThemeId = 'SUMMER_SKY' | string;
 export declare function getSpeakingLayout(themeId?: SpeakingThemeId): ComponentType<SpeakingLayoutProps>;
 export interface StandardThemeEntry {
     Layout: ComponentType<StandardExamLayoutProps>;

package/dist/components/themes/index.js

@@ -1 +1 @@
-import{SpaceshipLayout as r}from"./spaceship/SpaceshipLayout";import{SummerSkyLayout as e}from"./summer-sky/SummerSkyLayout";import{CambridgeYleExamLayout as m}from"./cambridge-yle/CambridgeYleExamLayout";import o from"./cambridge-yle/CambridgeYleQuestionCard";export*from"./cambridge-yle";export*from"./english-certification";export*from"./spaceship/SpaceshipLayout";export*from"./spaceship/SpaceshipAudioPlayer";export*from"./summer-sky/SummerSkyAudioPlayer";export*from"./summer-sky/SummerSkyLayout";export*from"./summer-sky/SummerSkySubmitModal";export*from"./summer-sky/SummerSkyWaitingRoom";const t={SPACESHIP:r,SUMMER_SKY:e},a="SUMMER_SKY";export function getSpeakingLayout(r){return t[r||a]||t[a]}const i={CAMBRIDGE_YLE:{Layout:m,QuestionCard:o}},p="CAMBRIDGE_YLE";export function getStandardExamTheme(r){return i[r||p]||i[p]}
+import{SummerSkyLayout as r}from"./summer-sky/SummerSkyLayout";import{CambridgeYleExamLayout as m}from"./cambridge-yle/CambridgeYleExamLayout";import e from"./cambridge-yle/CambridgeYleQuestionCard";export*from"./cambridge-yle";export*from"./english-certification";export*from"./summer-sky/SummerSkyAudioPlayer";export*from"./summer-sky/SummerSkyLayout";export*from"./summer-sky/SummerSkySubmitModal";export*from"./summer-sky/SummerSkyWaitingRoom";const o={SUMMER_SKY:r},t="SUMMER_SKY";export function getSpeakingLayout(r){return o[r||t]||o[t]}const u={CAMBRIDGE_YLE:{Layout:m,QuestionCard:e}},a="CAMBRIDGE_YLE";export function getStandardExamTheme(r){return u[r||a]||u[a]}

package/dist/shared/lib/html-content.d.ts

@@ -0,0 +1,14 @@
+/** Detects whether a CMS string carries HTML markup vs plain text. */
+export declare function isHtmlContent(value: string): boolean;
+interface HtmlOrTextProps {
+    value: string;
+    className?: string;
+    /** Element used for plain-text fallback. Default: `p`. */
+    as?: 'p' | 'div' | 'span';
+}
+/**
+ * Renders CMS-authored content as HTML when it contains tags, otherwise as
+ * plain text. Content comes from the exam CMS (not end-user input).
+ */
+export declare function HtmlOrText({ value, className, as }: HtmlOrTextProps): import("react").JSX.Element;
+export {};

package/dist/shared/lib/html-content.js

@@ -0,0 +1 @@
+"use client";import{jsx as t}from"react/jsx-runtime";import{cn as l}from"../lib/utils";export function isHtmlContent(t){return/<[a-z][\s\S]*>/i.test(t)}export function HtmlOrText({value:e,className:s,as:i="p"}){if(!e)return null;if(isHtmlContent(e))return t("div",{className:l("[&_p]:mb-2 [&_p:last-child]:mb-0 [&_ul]:my-2 [&_ul]:list-disc [&_ul]:pl-5 [&_ol]:my-2 [&_ol]:list-decimal [&_ol]:pl-5 [&_strong]:font-semibold",s),dangerouslySetInnerHTML:{__html:e}});return t(i,{className:s,children:e})}

package/dist/shared/types/common.types.d.ts

@@ -42,7 +42,6 @@ export declare enum SkillEnum {
 export declare enum ExamTemplateTheme {
     CAMBRIDGE_YLE = "CAMBRIDGE_YLE",
     FLYER_WOODEN = "FLYER_WOODEN",
-    SPACESHIP = "SPACESHIP",
     SUMMER_SKY = "SUMMER_SKY",
     IELTS_LRW = "IELTS_LRW"
 }

package/dist/shared/types/common.types.js

@@ -1 +1 @@
-export var UserRole;!function(E){E.SYSTEM_ADMIN="SYSTEM_ADMIN",E.ADMIN="ADMIN",E.TEACHER="TEACHER",E.STUDENT="STUDENT"}(UserRole||(UserRole={}));export var Gender;!function(E){E.MALE="male",E.FEMALE="female",E.OTHER="other"}(Gender||(Gender={}));export var RoomType;!function(E){E.CONTEST="CONTEST",E.PRACTICE_TEST="PRACTICE_TEST"}(RoomType||(RoomType={}));export var ExamRoomStatus;!function(E){E.SCHEDULED="SCHEDULED",E.IN_PROGRESS="IN_PROGRESS",E.COMPLETED="COMPLETED"}(ExamRoomStatus||(ExamRoomStatus={}));export var StudentSelectionType;!function(E){E.ALL="ALL",E.SPECIFIC="SPECIFIC"}(StudentSelectionType||(StudentSelectionType={}));export var SkillEnum;!function(E){E.LISTENING="LISTENING",E.SPEAKING="SPEAKING",E.READING="READING",E.WRITING="WRITING"}(SkillEnum||(SkillEnum={}));export var ExamTemplateTheme;!function(E){E.CAMBRIDGE_YLE="CAMBRIDGE_YLE",E.FLYER_WOODEN="FLYER_WOODEN",E.SPACESHIP="SPACESHIP",E.SUMMER_SKY="SUMMER_SKY",E.IELTS_LRW="IELTS_LRW"}(ExamTemplateTheme||(ExamTemplateTheme={}));
+export var UserRole;!function(E){E.SYSTEM_ADMIN="SYSTEM_ADMIN",E.ADMIN="ADMIN",E.TEACHER="TEACHER",E.STUDENT="STUDENT"}(UserRole||(UserRole={}));export var Gender;!function(E){E.MALE="male",E.FEMALE="female",E.OTHER="other"}(Gender||(Gender={}));export var RoomType;!function(E){E.CONTEST="CONTEST",E.PRACTICE_TEST="PRACTICE_TEST"}(RoomType||(RoomType={}));export var ExamRoomStatus;!function(E){E.SCHEDULED="SCHEDULED",E.IN_PROGRESS="IN_PROGRESS",E.COMPLETED="COMPLETED"}(ExamRoomStatus||(ExamRoomStatus={}));export var StudentSelectionType;!function(E){E.ALL="ALL",E.SPECIFIC="SPECIFIC"}(StudentSelectionType||(StudentSelectionType={}));export var SkillEnum;!function(E){E.LISTENING="LISTENING",E.SPEAKING="SPEAKING",E.READING="READING",E.WRITING="WRITING"}(SkillEnum||(SkillEnum={}));export var ExamTemplateTheme;!function(E){E.CAMBRIDGE_YLE="CAMBRIDGE_YLE",E.FLYER_WOODEN="FLYER_WOODEN",E.SUMMER_SKY="SUMMER_SKY",E.IELTS_LRW="IELTS_LRW"}(ExamTemplateTheme||(ExamTemplateTheme={}));

package/dist/shared/types/exam-taking.types.d.ts

@@ -16,6 +16,8 @@ export interface StoreTemplatePart {
     id: string | number;
     name: string;
     category?: string;
+    /** Max points for this part from exams.template.parts */
+    points?: number;
     startIndex?: number;
     endIndex?: number;
     questionCount?: number;

package/dist/shared/types/student.types.d.ts

@@ -102,6 +102,17 @@ export interface AttemptQuestionsResponse {
     } | null;
     questions: any[];
 }
+/** Summary of one exam part for student waiting room / room detail */
+export interface StudentExamPartSummary {
+    id: string;
+    name: string;
+    skill?: string;
+    category?: string;
+    points: number;
+    questionCount: number;
+    instructions?: string;
+    questionType?: string;
+}
 export interface StudentRoom {
     id: string;
     name: string;
@@ -127,9 +138,12 @@ export interface StudentRoom {
         passScore: number;
         numberOfParts: number | null;
         level?: string;
+        theme?: string;
         template?: {
             theme?: string;
         };
+        /** Summary parts from exams.template.parts */
+        parts?: StudentExamPartSummary[];
     };
     contest?: {
         id: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinyweb_dev/oe-exam-sdk",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "description": "Reusable OceanEdu question components.",
   "type": "module",
   "main": "./dist/index.js",
@@ -21,7 +21,7 @@
     "build:compile": "tsc -p tsconfig.build.json",
     "build:alias": "tsc-alias -p tsconfig.build.json",
     "build:ts": "npm run build:compile && npm run build:assets && npm run build:alias",
-    "build:assets": "for d in cambridge-yle english-certification summer-sky spaceship; do [ -d src/components/themes/$d/assets ] && cp -R src/components/themes/$d/assets dist/components/themes/$d/ || true; done; [ -d src/components/shared/audio/assets ] && cp -R src/components/shared/audio/assets dist/components/shared/audio/ || true; [ -d src/components/results/report/assets ] && mkdir -p dist/components/results/report && cp -R src/components/results/report/assets dist/components/results/report/ || true; (cd src && find . -name '*.module.css' -exec cp --parents {} ../dist/ \\;); cp src/global.d.ts dist/global.d.ts",
+    "build:assets": "for d in cambridge-yle english-certification summer-sky; do [ -d src/components/themes/$d/assets ] && cp -R src/components/themes/$d/assets dist/components/themes/$d/ || true; done; [ -d src/components/shared/audio/assets ] && cp -R src/components/shared/audio/assets dist/components/shared/audio/ || true; [ -d src/components/results/report/assets ] && mkdir -p dist/components/results/report && cp -R src/components/results/report/assets dist/components/results/report/ || true; (cd src && find . -name '*.module.css' -exec cp --parents {} ../dist/ \\;); cp src/global.d.ts dist/global.d.ts",
     "minify:js": "find dist -name '*.js' -type f -exec sh -c 'for f do terser \"$f\" --compress directives=false --mangle --module --comments false --output \"$f\"; done' sh {} +",
     "build": "npm run clean && npm run build:ts && npm run minify:js",
     "pack:local": "npm pack",

package/dist/components/themes/spaceship/SpaceshipAudioPlayer.d.ts

@@ -1,8 +0,0 @@
-interface SpaceshipAudioPlayerProps {
-    audioUrl: string;
-    partName?: string;
-    onEnded?: () => void;
-    onPlayingChange?: (isPlaying: boolean) => void;
-}
-export declare function SpaceshipAudioPlayer({ audioUrl, partName, onEnded, onPlayingChange }: SpaceshipAudioPlayerProps): import("react").JSX.Element;
-export {};

package/dist/components/themes/spaceship/SpaceshipAudioPlayer.js

@@ -1 +0,0 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as a,useState as r,useEffect as n}from"react";import s from"next/image";import{Pause as i,Play as l,VolumeX as o}from"lucide-react";import{usePresignedFileUrl as d}from"../../../shared/lib/hooks/usePresignedFileUrl";import c from"./assets/styles/SpaceshipLayout.module.css";import u from"./assets/images/big-blue-badge-sunset.png";import m from"./assets/images/teacher-play-sunset.png";import p from"./assets/images/ic-mute-sunset.png";function v(e){if(isNaN(e)||!isFinite(e))return"0:00";const t=Math.floor(e/60),a=Math.floor(e%60);return`${t}:${String(a).padStart(2,"0")}`}export function SpaceshipAudioPlayer({audioUrl:h,partName:f="Part 1 - Phase 2",onEnded:g,onPlayingChange:N}){const w=a(null),[y,b]=r(!1),[L,E]=r(0),[x,k]=r(0),[C,B]=r(100),{previewUrl:P}=d(h||void 0);n(()=>{const e=w.current;if(!e)return;const t=()=>{e.duration&&!isNaN(e.duration)&&isFinite(e.duration)&&k(e.duration)},a=()=>{E(e.currentTime),t()},r=()=>{b(!0),N?.(!0)},n=()=>{b(!1),N?.(!1)},s=()=>{b(!1),E(0),N?.(!1),g?.()};return t(),e.addEventListener("loadedmetadata",t),e.addEventListener("durationchange",t),e.addEventListener("canplay",t),e.addEventListener("timeupdate",a),e.addEventListener("play",r),e.addEventListener("pause",n),e.addEventListener("ended",s),()=>{e.removeEventListener("loadedmetadata",t),e.removeEventListener("durationchange",t),e.removeEventListener("canplay",t),e.removeEventListener("timeupdate",a),e.removeEventListener("play",r),e.removeEventListener("pause",n),e.removeEventListener("ended",s)}},[P,g]),n(()=>{b(!1),E(0),k(0)},[P]),n(()=>{const e=w.current;if(!e||!P)return;let t=!1;const a=()=>{t||e.play().catch(()=>{if(t)return;const a=()=>{t||(e.play().catch(()=>{}),document.removeEventListener("click",a),document.removeEventListener("keydown",a))};document.addEventListener("click",a,{once:!0}),document.addEventListener("keydown",a,{once:!0})})};return e.readyState>=3?a():e.addEventListener("canplay",a,{once:!0}),()=>{t=!0,e.removeEventListener("canplay",a)}},[P]);const F=x>0?L/x*100:0;return t("div",{className:c.examAudioContainer,children:[e("audio",{ref:w,...P?{src:P}:{},preload:"metadata"}),t("div",{className:c.bigBlueBadge,children:[e(s,{src:u,alt:"Audio Badge",className:c.bigBlueBadgeBg,priority:!0}),e("div",{className:c.audioBarContent,children:t("div",{className:c.audioBarInner,children:[e("span",{className:c.partLabel,children:f}),t("div",{className:c.teacherAvatarContainer,onClick:P?()=>{const e=w.current;e&&(e.paused?e.play().catch(()=>{}):e.pause())}:void 0,children:[e("img",{src:m.src,alt:"Play",className:c.teacherPlayIcon}),e("div",{className:"absolute inset-0 flex items-center justify-center",children:y?e(i,{className:"h-5 w-5 text-white drop-shadow-md",fill:"currentColor"}):e(l,{className:"h-5 w-5 text-white drop-shadow-md ml-1",fill:"currentColor"})})]}),t("div",{className:c.audioControlsWrapper,children:[t("span",{className:c.audioTime,children:[v(L)," / ",v(x)]}),t("div",{className:c.sliderTrack,children:[e("div",{className:c.sliderFill,style:{width:`${F}%`}}),e("input",{type:"range",min:"0",max:x||0,step:"0.1",value:L,onChange:e=>{const t=w.current;if(!t)return;const a=parseFloat(e.target.value);t.currentTime=a,E(a)},className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer disabled:cursor-not-allowed",disabled:!P})]}),t("div",{className:c.volumeContainer,children:[e("div",{className:c.volumeIcon,onClick:()=>{const e=w.current;e&&(C>0?(e.volume=0,B(0)):(e.volume=1,B(100)))},children:0===C?e(o,{className:"text-white w-full h-full"}):e(s,{src:p,alt:"volume",className:"w-full h-full"})}),e("div",{className:"flex-grow items-center flex",style:{width:"60px"},children:e("input",{type:"range",min:"0",max:"100",value:C,onChange:e=>{const t=w.current;if(!t)return;const a=parseFloat(e.target.value);t.volume=a/100,B(a)},className:"w-full h-[3px] appearance-none bg-white/50 rounded cursor-pointer [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:w-2.5 [&::-webkit-slider-thumb]:h-2.5 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white"})})]})]})]})})]})]})}

package/dist/components/themes/spaceship/SpaceshipLayout.d.ts

@@ -1,2 +0,0 @@
-import type { SpeakingLayoutProps } from '../types';
-export declare function SpaceshipLayout({ onExit, partName, headerRight, onPrev, onNext, canGoPrev, canGoNext, audioUrl, onAudioEnded, recorder, children, contentClassName, hideAudioBar, onAudioPlayingChange, }: SpeakingLayoutProps): import("react").JSX.Element;

package/dist/components/themes/spaceship/SpaceshipLayout.js

@@ -1 +0,0 @@
-"use client";import{jsx as e,jsxs as t,Fragment as s}from"react/jsx-runtime";import a from"next/image";import r from"./assets/styles/SpaceshipLayout.module.css";import{SpaceshipAudioPlayer as i}from"./SpaceshipAudioPlayer";import n from"./assets/images/circle-btn-right-sunset.png";import l from"./assets/images/circle-btn-sunset.png";import c from"./assets/images/next-sunset.png";import o from"./assets/images/X-sunset.png";import m from"./assets/images/button_feedback_vi.png";import d from"./assets/images/blue-wrapper-sunset.png";import p from"./assets/images/timer-badge.png";import h from"./assets/images/micro.png";export function SpaceshipLayout({onExit:g,partName:u,headerRight:f,onPrev:x,onNext:v,canGoPrev:N,canGoNext:b,audioUrl:y,onAudioEnded:B,recorder:w,children:C,contentClassName:S="",hideAudioBar:k,onAudioPlayingChange:I}){return t("div",{id:"exam-main-scroll-area",className:r.pageContainer,children:[e("div",{className:r.examContainer,children:t("div",{className:r.examMainBoard,children:[e("div",{className:r.headerTitleWrapper,children:e("div",{className:r.exitButtonWrapper,children:t("div",{className:r.circleBtn,tabIndex:0,onClick:g,children:[e(a,{src:n,alt:"btn",className:r.circleBtnBg}),e("div",{className:r.circleBtnInner,children:e(a,{src:o,alt:"X",className:r.exitIcon})})]})})}),N&&e("div",{className:r.controlLeft,children:t("div",{className:r.circleBtn,onClick:x,children:[e(a,{src:n,alt:"btn",className:r.circleBtnBg}),e("div",{className:r.circleBtnInner,children:e(a,{src:c,alt:"prev",className:`${r.nextPrevIcon} ${r.rotate}`})})]})}),t("div",{className:r.examContentMainContainer,children:[!k&&e(i,{audioUrl:y,partName:u,onEnded:B,onPlayingChange:I}),t("div",{className:r.examContentSpace,children:[f&&e("div",{className:"absolute top-2 right-6 z-50",children:f}),e("div",{className:`w-full h-full flex flex-col items-center justify-center ${S}`,children:C})]}),w&&t(s,{children:[e("p",{className:"absolute left-1/2 -translate-x-1/2 text-center whitespace-nowrap text-black font-bold m-0",style:{bottom:"115px",fontSize:"16px",fontFamily:'"Open Sans", sans-serif'},children:"uploaded"===w.status?"Đã ghi nhận câu trả lời":"Ấn biểu tượng micro để trả lời"}),e("div",{className:`absolute left-1/2 -translate-x-1/2 flex flex-col items-center z-10 transition-transform ${"recording"===w.status?"scale-[1.05]":"hover:scale-[1.02] active:scale-[0.98]"} ${"uploaded"===w.status?"opacity-80 grayscale-[20%] pointer-events-none":""}`,style:{bottom:"-40px",overflow:"visible"},children:t("div",{className:"block relative",style:{overflow:"visible"},children:[e(a,{src:d,alt:"wrapper",className:"z-0 "+("recording"===w.status?"animate-pulse":""),style:{width:"158px",height:"116px"}}),"uploaded"!==w.status&&t("div",{className:"absolute left-1/2 -translate-x-1/2 z-20",style:{top:"-32px"},children:[e(a,{src:p,alt:"timer",style:{width:"104px",height:"45px"}}),e("div",{className:"absolute inset-0 flex items-center justify-center",children:t("p",{className:"text-white text-center text-[20px] font-normal m-0",style:{margin:0},children:[Math.floor(w.remainingSeconds/60),":",(w.remainingSeconds%60).toString().padStart(2,"0")]})})]}),e("div",{className:"absolute inset-0 flex justify-center items-center w-full h-full",children:e(a,{src:h,alt:"micro",className:"cursor-pointer "+("recording"===w.status?"drop-shadow-[0_0_15px_rgba(0,255,255,0.8)]":""),style:{width:"51px",height:"51px"},onClick:"recording"===w.status?w.stopRecording:"idle"===w.status||"error"===w.status?w.startRecording:void 0})})]})})]})]}),b&&e("div",{className:r.controlRight,children:t("div",{className:r.circleBtn,onClick:v,children:[e(a,{src:l,alt:"btn",className:r.circleBtnBg}),e("div",{className:r.circleBtnInner,children:e(a,{src:c,alt:"next",className:r.nextPrevIcon})})]})})]})}),e("div",{className:r.feedbackButton,children:e("a",{target:"_blank",href:"https://forms.gle/DxdZqfgSirYzf1vW8",rel:"noopener noreferrer",children:e(a,{alt:"feedback",src:m})})})]})}