@tinyweb_dev/oe-exam-sdk 1.0.11 → 1.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/questions/_shared/components/compact/KidQuestionCard.d.ts +5 -2
- package/dist/components/questions/_shared/components/compact/KidQuestionCard.js +2 -2
- package/dist/components/questions/types/word-fill-structured-form/WordFillStructuredFormClient.js +19 -15
- package/package.json +1 -1
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
-
export declare function KidQuestionCard({ icon, title, points, isExample, review, headerExtra, children, className, contentClassName, }: {
|
|
2
|
+
export declare function KidQuestionCard({ icon, hideIcon, title, titleClassName, points, isExample, review, headerExtra, children, className, contentClassName, }: {
|
|
3
3
|
icon?: ReactNode;
|
|
4
|
-
|
|
4
|
+
hideIcon?: boolean;
|
|
5
|
+
title: ReactNode;
|
|
6
|
+
/** Defaults to `truncate`; pass e.g. `whitespace-normal` to let long titles wrap. */
|
|
7
|
+
titleClassName?: string;
|
|
5
8
|
points?: number;
|
|
6
9
|
isExample?: boolean;
|
|
7
10
|
review?: 'correct' | 'wrong' | null;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Check, CircleHelp, Star, X } from 'lucide-react';
|
|
4
4
|
import { cn } from '../../../../../shared/lib/utils';
|
|
5
|
-
export function KidQuestionCard({ icon, title, points, isExample = false, review, headerExtra, children, className, contentClassName, }) {
|
|
6
|
-
return (_jsxs("div", { className: cn('overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm', className), children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-gray-100 bg-gradient-to-r from-gray-50 to-white px-3 py-2", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-gradient-to-br from-blue-500 to-indigo-600 text-white", children: icon ?? _jsx(CircleHelp, { className: "h-3.5 w-3.5" }) }), _jsx("span", { className:
|
|
5
|
+
export function KidQuestionCard({ icon, hideIcon = false, title, titleClassName, points, isExample = false, review, headerExtra, children, className, contentClassName, }) {
|
|
6
|
+
return (_jsxs("div", { className: cn('overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm', className), children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-gray-100 bg-gradient-to-r from-gray-50 to-white px-3 py-2", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [!hideIcon && (_jsx("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-gradient-to-br from-blue-500 to-indigo-600 text-white", children: icon ?? _jsx(CircleHelp, { className: "h-3.5 w-3.5" }) })), _jsx("span", { className: cn('text-sm font-medium text-gray-700', titleClassName ?? 'truncate'), children: title }), isExample && (_jsxs("span", { className: "inline-flex items-center gap-1 rounded-full bg-amber-100 px-2 py-0.5 text-[11px] font-semibold text-amber-700", children: [_jsx(Star, { className: "h-3 w-3" }), "C\u00E2u v\u00ED d\u1EE5"] }))] }), _jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [headerExtra, typeof points === 'number' && (_jsxs("span", { className: "text-xs text-gray-500", children: [points, " \u0111i\u1EC3m"] })), review === 'correct' && (_jsxs("div", { className: "flex items-center gap-1 rounded-full bg-green-100 px-2 py-0.5 text-xs font-semibold text-green-700", children: [_jsx(Check, { className: "h-3 w-3" }), "\u0110\u00FAng"] })), review === 'wrong' && (_jsxs("div", { className: "flex items-center gap-1 rounded-full bg-red-100 px-2 py-0.5 text-xs font-semibold text-red-700", children: [_jsx(X, { className: "h-3 w-3" }), "Sai"] }))] })] }), _jsx("div", { className: cn('space-y-3 p-3', contentClassName), children: children })] }));
|
|
7
7
|
}
|
package/dist/components/questions/types/word-fill-structured-form/WordFillStructuredFormClient.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import React, { useState, useEffect, useMemo, useCallback } from 'react';
|
|
4
|
-
import { Check, X,
|
|
4
|
+
import { Check, X, Library } from 'lucide-react';
|
|
5
5
|
import { usePresignedFileUrl } from '../../../../shared/lib/hooks';
|
|
6
6
|
import { cn } from '../../../../shared/lib/utils';
|
|
7
|
-
import {
|
|
7
|
+
import { KidPrompt, KidQuestionCard } from '../../_shared/components/compact';
|
|
8
8
|
import { detectWfsfBankMode, isOptionsWordEntry, normalizeSharedWordBank, } from './wfsf-word-bank.utils';
|
|
9
9
|
import { expandWfsfCorrectAlts, formatWfsfCorrectLabel, isWfsfBlankCorrect, primaryWfsfAnswers, } from '../../../../shared/lib/utils/wfsf-blank-match';
|
|
10
10
|
function normalizeWfsfBlankStyle(raw) {
|
|
@@ -138,9 +138,13 @@ export function WordFillStructuredFormClient({ questionData, isReviewMode = fals
|
|
|
138
138
|
// Header = page rubric. Pearson preview maps draft.instruction → explanation.
|
|
139
139
|
const rawExplanation = String(explanation || questionData.explanation || '').trim();
|
|
140
140
|
const headerInstruction = String(instruction || dataInstruction || rawExplanation || '').trim();
|
|
141
|
-
|
|
141
|
+
// Header reads "Bài x: rubric" — the question type name is never shown.
|
|
142
|
+
const numberLabel = typeof questionNumber === 'number' && questionNumber > 0
|
|
143
|
+
? `Bài ${questionNumber}`
|
|
144
|
+
: '';
|
|
145
|
+
const headerTitle = numberLabel ? (_jsxs(_Fragment, { children: [_jsxs("strong", { className: "font-bold", children: [numberLabel, headerInstruction ? ':' : ''] }), headerInstruction ? ` ${headerInstruction}` : ''] })) : (headerInstruction || DEFAULT_WFSF_HEADER);
|
|
142
146
|
// Do not re-show the same rubric under "Giải thích".
|
|
143
|
-
const displayExplanation = rawExplanation && rawExplanation !==
|
|
147
|
+
const displayExplanation = rawExplanation && rawExplanation !== headerInstruction ? rawExplanation : '';
|
|
144
148
|
const handleInputChange = useCallback((key, value) => {
|
|
145
149
|
if (isReviewMode)
|
|
146
150
|
return;
|
|
@@ -178,8 +182,8 @@ export function WordFillStructuredFormClient({ questionData, isReviewMode = fals
|
|
|
178
182
|
: undefined, size: isLetterBlank ? undefined : isPhraseBlank ? 28 : 10, className: cn('inline-block bg-slate-50/40 text-center text-sm font-semibold outline-none transition-all align-baseline hover:bg-slate-100/60 focus:bg-teal-50/60 focus:ring-0', isLetterBlank
|
|
179
183
|
? 'h-7 w-7 rounded-md border px-0 uppercase'
|
|
180
184
|
: isPhraseBlank
|
|
181
|
-
? 'min-w-[16rem] max-w-[36rem] w-[28ch] rounded-
|
|
182
|
-
: 'min-w-[4.5rem] max-w-[8rem] w-[10ch] rounded-
|
|
185
|
+
? 'min-w-[16rem] max-w-[36rem] w-[28ch] rounded-none border-0 border-b-2 bg-transparent px-1 py-0.5'
|
|
186
|
+
: 'min-w-[4.5rem] max-w-[8rem] w-[10ch] rounded-none border-0 border-b-2 bg-transparent px-1 py-0.5', isReviewMode
|
|
183
187
|
? isCorrectFill
|
|
184
188
|
? 'border-green-400 bg-green-50 text-green-800'
|
|
185
189
|
: isWrongFill
|
|
@@ -278,12 +282,12 @@ export function WordFillStructuredFormClient({ questionData, isReviewMode = fals
|
|
|
278
282
|
.map((node, index) => renderNode(node, `root-${index}`))
|
|
279
283
|
.filter((node) => node !== null);
|
|
280
284
|
}, [content, renderBlank]);
|
|
281
|
-
return (
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
285
|
+
return (_jsx("div", { className: "space-y-4", children: _jsxs(KidQuestionCard, { hideIcon: true, title: headerTitle, titleClassName: "whitespace-normal break-words text-base font-normal text-gray-800", review: isReviewMode && allFilled ? (isAllCorrect ? 'correct' : 'wrong') : null, children: [title && (_jsx(KidPrompt, { children: _jsx("h2", { className: "text-sm font-semibold text-gray-800", children: title }) })), allAudios.length > 0 && (_jsx("div", { className: "flex flex-col items-center gap-2", children: allAudios.map((audio, idx) => (_jsx(ClientAudioItem, { url: audio }, idx))) })), allImages.length > 0 && (_jsx("div", { className: "flex flex-wrap justify-center gap-3", children: allImages.map((img, idx) => (_jsx(ClientImageItem, { url: img, alt: title ? `${title} (${idx + 1})` : undefined }, idx))) })), bankMode === 'WITH_WORD_BANK' && sharedWords.length > 0 && (_jsxs("div", { className: "rounded-lg border border-purple-200 bg-gradient-to-r from-purple-50 to-pink-50 p-3", children: [_jsxs("div", { className: "mb-2 flex items-center gap-2", children: [_jsx(Library, { className: "h-4 w-4 text-purple-600" }), _jsx("span", { className: "text-xs font-semibold uppercase tracking-wider text-purple-700", children: "Word Bank" })] }), _jsx("div", { className: "flex flex-wrap gap-2", children: sharedWords.map((item, index) => {
|
|
286
|
+
const used = usedSharedWords.has(item.word.trim().toLowerCase());
|
|
287
|
+
return (_jsxs("span", { className: cn('rounded-full border px-3 py-1 text-sm font-medium', item.isExample
|
|
288
|
+
? 'border-amber-300 bg-amber-100 text-amber-800'
|
|
289
|
+
: used
|
|
290
|
+
? 'border-purple-200 bg-white/60 text-purple-400 line-through'
|
|
291
|
+
: 'border-purple-300 bg-white text-purple-800'), children: [item.word, item.isExample ? ' (ex)' : ''] }, `${item.word}-${index}`));
|
|
292
|
+
}) })] })), _jsx("div", { className: "structured-form-content space-y-2 rounded-lg border border-gray-200 bg-gradient-to-r from-gray-50 to-slate-50 p-5 text-base leading-loose text-gray-800", children: renderedContent }), isReviewMode && !isAllCorrect && (_jsxs("div", { className: "rounded-lg border border-green-200 bg-green-50 p-3", children: [_jsx("span", { className: "text-xs font-medium uppercase tracking-wider text-green-600", children: "\u0110\u00E1p \u00E1n \u0111\u00FAng" }), _jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: expectedBlankKeys.map((key) => (_jsxs("span", { className: "rounded-lg border border-green-300 bg-green-100 px-3 py-1.5 text-sm font-semibold text-green-800", children: [`{${key}}`, ": ", formatWfsfCorrectLabel(answers[key])] }, key))) })] })), isReviewMode && displayExplanation && (_jsxs("div", { className: "rounded-lg border border-blue-200 bg-gradient-to-r from-blue-50 to-indigo-50 p-3", children: [_jsx("span", { className: "text-xs font-medium uppercase tracking-wider text-blue-600", children: "Gi\u1EA3i th\u00EDch" }), _jsx("p", { className: "mt-1 text-sm text-blue-800", children: displayExplanation })] }))] }) }));
|
|
289
293
|
}
|