@intellectif/lk-react 12.0.1 → 14.0.0

package/dist/chunk-47HHC4GD.js

@@ -0,0 +1,763 @@
+'use client';
+import { localeDirectionOf, textDirectionOf, characterDirectionOf } from './chunk-YORQQXGO.js';
+import { FeedbackRegion } from './chunk-RCMYEWBE.js';
+import { ActivityErrorBoundary, isDevelopment, ANONYMOUS_ACTOR, objectIdFor } from './chunk-BO6P723E.js';
+import { ActivityMedia } from './chunk-XIBOFTOL.js';
+import { useActivityState } from './chunk-6N43WDVG.js';
+import { useLkStrings } from './chunk-TDJEKXEP.js';
+import { assertRedacted, validateActivity, ActivitySchemaError, alignDictation, diffDictationChars, DICTATION_MAX_TEXT_LENGTH, score, xAPIBuilder, xapiDefinitionFor } from '@intellectif/lk-core';
+import { useMemo, useState, useRef, useEffect, useId } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var TEXT_CHANGED_DEBOUNCE_MS = 500;
+var VISUALLY_HIDDEN = {
+  position: "absolute",
+  width: 1,
+  height: 1,
+  margin: -1,
+  padding: 0,
+  overflow: "hidden",
+  clip: "rect(0 0 0 0)",
+  clipPath: "inset(50%)",
+  whiteSpace: "nowrap",
+  border: 0
+};
+var recordingsGroupCount = 0;
+var UNSPELLED_RE = new RegExp(
+  `^[\\p{P}\\p{Cc}\\p{Cf}\\p{Default_Ignorable_Code_Point}${String.fromCodePoint(180, 96, 65344, 700, 1600, 2042)}]*$`,
+  "u"
+);
+var HINT_SPACE_RE = new RegExp(
+  `(?:(?!${String.fromCodePoint(65279)})\\s|${String.fromCodePoint(133)})+`,
+  "u"
+);
+var VISIBLE_TEXT_RE = /[^\p{White_Space}\p{Cc}\p{Cf}\p{Default_Ignorable_Code_Point}]/u;
+var BULLET = "\u2022";
+var LEFT_TO_RIGHT_MARK = String.fromCodePoint(8206);
+var RIGHT_TO_LEFT_MARK = String.fromCodePoint(8207);
+var EXTENDING_RE = new RegExp(
+  `^[\\p{M}${String.fromCodePoint(8204, 8205, 3635, 3763)}${String.fromCodePoint(127995)}-${String.fromCodePoint(127999)}${String.fromCodePoint(917536)}-${String.fromCodePoint(917631)}${String.fromCodePoint(4448)}-${String.fromCodePoint(4607)}${String.fromCodePoint(55216)}-${String.fromCodePoint(55295)}]$`,
+  "u"
+);
+var STACKING_VIRAMAS = new Set(
+  [
+    2381,
+    2509,
+    2765,
+    2893,
+    3149,
+    3277,
+    3405,
+    4153,
+    6098,
+    6752,
+    6980,
+    43456,
+    69702,
+    69939
+  ].map((point) => String.fromCodePoint(point))
+);
+var SUBJOINED_AFTER = new Map([
+  ...[2608, 2607, 2613].map(
+    (point) => [
+      String.fromCodePoint(point),
+      (before) => before.at(-1) === String.fromCodePoint(2637)
+    ]
+  ),
+  [
+    String.fromCodePoint(2999),
+    (before) => before.at(-1) === String.fromCodePoint(3021) && before.at(-2) === String.fromCodePoint(2965)
+  ],
+  [
+    String.fromCodePoint(2992),
+    (before) => before.at(-1) === String.fromCodePoint(3021) && before.at(-2) === String.fromCodePoint(3e3)
+  ]
+]);
+var JOINABLE_VIRAMAS = /* @__PURE__ */ new Set([...STACKING_VIRAMAS, String.fromCodePoint(3530)]);
+var ZERO_WIDTH_JOINER = String.fromCodePoint(8205);
+var PREPENDED = /* @__PURE__ */ new Set([String.fromCodePoint(3406), String.fromCodePoint(6158)]);
+var ARABIC_LAM = String.fromCodePoint(1604);
+var LIGATING_ALEFS = new Set(
+  [1570, 1571, 1573, 1575, 1649, 1650, 1651, 1653].map(
+    (point) => String.fromCodePoint(point)
+  )
+);
+var REGIONAL_INDICATOR_RE = /^[\u{1f1e6}-\u{1f1ff}]$/u;
+var LETTER_RE = /^\p{L}$/u;
+var LETTER_WITH_REQUIRED_LIGATURES_RE = /(?![\p{Script=Latin}\p{Script=Greek}\p{Script=Cyrillic}])\p{L}/u;
+var DIGIT_RE = /^\p{Nd}$/u;
+var NUMBER_SIGN_RE = new RegExp(
+  `^[\\p{Sc}${String.fromCodePoint(176, 177, 8240, 8241, 8494, 8723)}]$`,
+  "u"
+);
+var ARABIC_LETTER_BLOCKS = [
+  [1536, 1983],
+  [2144, 2303],
+  [64336, 65023],
+  [65136, 65279]
+];
+function textOf(response) {
+  return response !== void 0 && response.type === "dictation" ? response.text : "";
+}
+function hintsOf(response) {
+  if (response === void 0 || response.type !== "dictation") {
+    return 0;
+  }
+  const revealed = response.hintsRevealed;
+  return typeof revealed === "number" && Number.isInteger(revealed) && revealed > 0 ? revealed : 0;
+}
+function responseOf(text, hintsRevealed) {
+  return { type: "dictation", text, ...hintsRevealed > 0 ? { hintsRevealed } : {} };
+}
+function slowMediaFor(data, label) {
+  const slow = data.slowMedia;
+  if (slow === void 0) {
+    return void 0;
+  }
+  const policy = data.media?.playback ?? {};
+  const { maxPlays: _budget, ...inherited } = policy;
+  const hasPolicy = Object.values(inherited).some((value) => value !== void 0);
+  return {
+    type: "audio",
+    url: slow.url,
+    alt: slow.alt ?? label,
+    ...hasPolicy ? { playback: inherited } : {}
+  };
+}
+function hintWordsOf(transcript) {
+  const words = [];
+  let leading = "";
+  for (const token of transcript.split(HINT_SPACE_RE)) {
+    if (token === "") {
+      continue;
+    }
+    const last = words.length - 1;
+    if (!UNSPELLED_RE.test(token.normalize("NFC"))) {
+      words.push(leading === "" ? token : `${leading} ${token}`);
+      leading = "";
+    } else if (last >= 0) {
+      words[last] = `${words[last]} ${token}`;
+    } else {
+      leading = leading === "" ? token : `${leading} ${token}`;
+    }
+  }
+  return words;
+}
+function wordsFromDetails(details) {
+  if (details.length === 0 || !details.every((detail) => /^w\d+$/.test(detail.itemId))) {
+    return null;
+  }
+  return details.map((detail) => {
+    const attempt = Array.isArray(detail.learnerResponse) ? detail.learnerResponse.join(" ") : detail.learnerResponse;
+    const reference = Array.isArray(detail.correctResponse) ? detail.correctResponse.join(" ") : detail.correctResponse;
+    const correct = detail.outcome !== void 0 ? detail.outcome === "correct" : detail.correct;
+    const missing = detail.outcome === "incorrect-omission" || !correct && attempt === "";
+    return {
+      itemId: detail.itemId,
+      reference,
+      attempt,
+      similarity: detail.score ?? (correct ? 1 : 0),
+      status: correct ? "correct" : missing ? "missing" : "incorrect"
+    };
+  });
+}
+function extendsCluster(before, shown) {
+  const previous = before.at(-1);
+  if (EXTENDING_RE.test(shown)) {
+    return true;
+  }
+  if (LETTER_RE.test(shown)) {
+    if (STACKING_VIRAMAS.has(previous) || PREPENDED.has(previous) || SUBJOINED_AFTER.get(shown)?.(before) === true) {
+      return true;
+    }
+    if (previous === ZERO_WIDTH_JOINER && JOINABLE_VIRAMAS.has(before.at(-2))) {
+      return true;
+    }
+  }
+  if (previous === ARABIC_LAM && LIGATING_ALEFS.has(shown)) {
+    return true;
+  }
+  return REGIONAL_INDICATOR_RE.test(shown) && before.length % 2 === 1 && before.every((character) => REGIONAL_INDICATOR_RE.test(character));
+}
+function characterOf(op) {
+  return op.reference === "" ? op.attempt : op.reference;
+}
+function isArabicLetter(character) {
+  const point = character?.codePointAt(0);
+  return point !== void 0 && LETTER_RE.test(character) && ARABIC_LETTER_BLOCKS.some(([first, last]) => point >= first && point <= last);
+}
+function bulletDirections(ops, contentDir) {
+  const own = ops.map((op) => characterDirectionOf(characterOf(op)));
+  const before = [];
+  const arabicBefore = [];
+  let lastDirection;
+  let lastLetterArabic = false;
+  ops.forEach((op, index) => {
+    before[index] = lastDirection;
+    arabicBefore[index] = lastLetterArabic;
+    lastDirection = own[index] ?? lastDirection;
+    if (LETTER_RE.test(characterOf(op))) {
+      lastLetterArabic = isArabicLetter(characterOf(op));
+    }
+  });
+  const after = [];
+  let nextDirection;
+  for (let index = ops.length - 1; index >= 0; index -= 1) {
+    after[index] = nextDirection;
+    nextDirection = own[index] ?? nextDirection;
+  }
+  const directions = /* @__PURE__ */ new Map();
+  ops.forEach((op, index) => {
+    if (op.op !== "missing") {
+      return;
+    }
+    const neighbourIsDigit = [ops[index - 1], ops[index + 1]].some(
+      (neighbour) => neighbour !== void 0 && DIGIT_RE.test(characterOf(neighbour))
+    );
+    directions.set(
+      index,
+      own[index] ?? (NUMBER_SIGN_RE.test(characterOf(op)) && neighbourIsDigit && !arabicBefore[index] ? "ltr" : before[index] !== void 0 && before[index] === after[index] ? before[index] : contentDir ?? before[index] ?? after[index])
+    );
+  });
+  return directions;
+}
+function clusterOpOf(ops) {
+  if (ops[0].op === "missing") {
+    return "missing";
+  }
+  const wrong = new Set(ops.map((op) => op.op).filter((kind) => kind !== "equal"));
+  if (wrong.size === 0) {
+    return "equal";
+  }
+  return wrong.size === 1 ? [...wrong][0] : "substitute";
+}
+function clustersOf(ops, contentDir) {
+  const bullets = bulletDirections(ops, contentDir);
+  const groups = [];
+  ops.forEach((op, index) => {
+    const shown = op.op === "missing" ? BULLET : op.attempt;
+    const current = groups.at(-1);
+    if (current !== void 0 && op.op !== "missing" && (current.ops[0].op === "missing" ? EXTENDING_RE.test(shown) : extendsCluster(current.shown, shown))) {
+      current.ops.push(op);
+      current.shown.push(shown);
+      return;
+    }
+    const direction = bullets.get(index);
+    groups.push({
+      ops: [op],
+      shown: [shown],
+      ...direction !== void 0 ? { bullet: direction } : {}
+    });
+  });
+  const clusters = [];
+  for (const group of groups) {
+    const mark = group.bullet === void 0 ? "" : group.bullet === "rtl" ? RIGHT_TO_LEFT_MARK : LEFT_TO_RIGHT_MARK;
+    const cluster = { op: clusterOpOf(group.ops), text: `${mark}${group.shown.join("")}${mark}` };
+    const previous = clusters.at(-1);
+    if (previous !== void 0 && previous.op === "equal" && cluster.op === "equal") {
+      previous.text += cluster.text;
+    } else {
+      clusters.push(cluster);
+    }
+  }
+  return clusters;
+}
+function CharOps({
+  ops,
+  contentDir
+}) {
+  return clustersOf(ops, contentDir).map((cluster, index) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: "lk-dc-op",
+      "data-op": cluster.op,
+      ...LETTER_WITH_REQUIRED_LIGATURES_RE.test(cluster.text) ? {} : { "data-ligatures": "decorative" },
+      "aria-hidden": "true",
+      children: cluster.text
+    },
+    index
+  ));
+}
+function AnnouncementText({ announcement }) {
+  if (announcement === null) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    announcement.text,
+    announcement.feedback ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      " ",
+      /* @__PURE__ */ jsx("span", { dir: "auto", children: announcement.feedback })
+    ] }) : null
+  ] });
+}
+function Dictation({
+  data,
+  onComplete,
+  onSubmit,
+  onChange,
+  onInteraction,
+  value,
+  defaultValue,
+  defaultSubmitted,
+  renderMode = "practice",
+  outcome,
+  mediaBudget,
+  mediaStrings,
+  strings,
+  theme,
+  locale,
+  disabled
+}) {
+  const isExam = renderMode === "exam";
+  const isReview = renderMode === "review";
+  const s = useLkStrings(strings);
+  const hasKey = typeof data.transcript === "string";
+  const devError = useMemo(() => {
+    if (!isDevelopment()) {
+      return null;
+    }
+    if (data.redacted === true) {
+      if (hasKey) {
+        const shape = data;
+        return shape.type === "dictation" && typeof shape.id === "string" && typeof shape.title === "string" ? null : new Error(
+          "Dictation received a revealed projection (redacted: true with a transcript) that is not a dictation: `type`, `id` and `title` are required."
+        );
+      }
+      try {
+        assertRedacted(data);
+        return null;
+      } catch (error) {
+        return error instanceof Error ? error : new Error(String(error));
+      }
+    }
+    const result2 = validateActivity("dictation", data);
+    return result2.success ? null : new ActivitySchemaError("dictation", result2.errors);
+  }, [data, hasKey]);
+  const { state, start, complete, getTimeSpent, reset } = useActivityState(
+    defaultSubmitted === true ? "completed" : "idle"
+  );
+  const isControlled = value !== void 0;
+  const [internalText, setInternalText] = useState(() => textOf(defaultValue));
+  const [internalRevealed, setInternalRevealed] = useState(() => hintsOf(defaultValue));
+  const [result, setResult] = useState(null);
+  const [summary, setSummary] = useState(null);
+  const [solutionShown, setSolutionShown] = useState(false);
+  const text = isControlled ? textOf(value) : internalText;
+  const revealed = isControlled ? hintsOf(value) : internalRevealed;
+  const defaultValueRef = useRef(defaultValue);
+  useEffect(() => {
+    defaultValueRef.current = defaultValue;
+  }, [defaultValue]);
+  const defaultSubmittedRef = useRef(defaultSubmitted);
+  useEffect(() => {
+    defaultSubmittedRef.current = defaultSubmitted;
+  }, [defaultSubmitted]);
+  const lastDataRef = useRef(data);
+  useEffect(() => {
+    if (lastDataRef.current === data) {
+      return;
+    }
+    lastDataRef.current = data;
+    setInternalText(textOf(defaultValueRef.current));
+    setInternalRevealed(hintsOf(defaultValueRef.current));
+    setResult(null);
+    setSummary(null);
+    setSolutionShown(false);
+    reset(defaultSubmittedRef.current === true ? "completed" : "idle");
+  }, [data, reset]);
+  const textChangedRef = useRef(
+    null
+  );
+  useEffect(
+    () => () => {
+      if (textChangedRef.current !== null) {
+        clearTimeout(textChangedRef.current.timer);
+      }
+    },
+    []
+  );
+  const revealButtonRef = useRef(null);
+  const ids = useId();
+  const hintId = `${ids}-hint`;
+  const titleId = `${ids}-title`;
+  const solutionId = `${ids}-solution`;
+  const [recordingsGroup] = useState(() => {
+    recordingsGroupCount += 1;
+    return `lk-dc-recordings-${recordingsGroupCount}`;
+  });
+  const slowMedia = useMemo(
+    () => slowMediaFor(data, s.dictationSlowRecording),
+    [data, s.dictationSlowRecording]
+  );
+  if (devError) {
+    throw devError;
+  }
+  if (data.redacted === true && renderMode === "practice") {
+    throw new Error(
+      `Dictation "${data.id}" received redacted activity data in renderMode "practice", which grades locally and has no answer key to grade against. Render redacted data with renderMode="exam" (server grades) or "review" (pass \`outcome\`).`
+    );
+  }
+  const submitted = state === "completed";
+  const inactive = disabled === true || submitted || isReview;
+  const revealing = isReview ? outcome?.status === "scored" : !isExam && submitted;
+  const transcript = isExam || !hasKey ? void 0 : data.transcript;
+  const hintWords = useMemo(
+    () => transcript === void 0 ? [] : hintWordsOf(transcript),
+    [transcript]
+  );
+  const hintsOffered = data.hints?.mode === "progressive-words" && !isExam && !isReview && transcript !== void 0;
+  const hintsEnabled = hintsOffered && !submitted;
+  const hintTotal = hintWords.length;
+  const hintsShown = Math.min(revealed, hintTotal);
+  const reportedHints = hintsOffered ? hintsShown : 0;
+  const fireInteraction = (type, payload) => {
+    onInteraction?.({ type, activityId: data.id, timestamp: Date.now(), payload });
+  };
+  const flushTextChanged = () => {
+    const pending = textChangedRef.current;
+    if (pending === null) {
+      return;
+    }
+    clearTimeout(pending.timer);
+    textChangedRef.current = null;
+    fireInteraction("text-changed", { length: pending.length });
+  };
+  const handleTextChange = (next) => {
+    if (inactive) {
+      return;
+    }
+    if (state === "idle") {
+      start();
+    }
+    if (!isControlled) {
+      setInternalText(next);
+    }
+    onChange?.(responseOf(next, reportedHints));
+    if (onInteraction === void 0) {
+      return;
+    }
+    if (textChangedRef.current !== null) {
+      clearTimeout(textChangedRef.current.timer);
+    }
+    textChangedRef.current = {
+      length: next.length,
+      timer: setTimeout(() => {
+        const pending = textChangedRef.current;
+        textChangedRef.current = null;
+        if (pending !== null) {
+          fireInteraction("text-changed", { length: pending.length });
+        }
+      }, TEXT_CHANGED_DEBOUNCE_MS)
+    };
+  };
+  const setRevealed = (next) => {
+    if (!isControlled) {
+      setInternalRevealed(next);
+    }
+    onChange?.(responseOf(text, next));
+  };
+  const revealNextHint = () => {
+    if (inactive || hintsShown >= hintTotal) {
+      return;
+    }
+    if (state === "idle") {
+      start();
+    }
+    const next = hintsShown + 1;
+    setRevealed(next);
+    fireInteraction("hint-requested", { revealed: next, total: hintTotal });
+  };
+  const resetHints = () => {
+    if (inactive || hintsShown === 0) {
+      return;
+    }
+    revealButtonRef.current?.focus();
+    setRevealed(0);
+  };
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    if (inactive) {
+      return;
+    }
+    const response = responseOf(text, reportedHints);
+    onSubmit?.(response);
+    flushTextChanged();
+    if (isExam) {
+      complete();
+      setSummary({ text: s.answerSubmitted, feedback: null });
+      fireInteraction("submitted", { length: text.length, hintsRevealed: reportedHints });
+      return;
+    }
+    const scoringResult = score("dictation", data, response);
+    complete();
+    const timeSpent = getTimeSpent();
+    const xapiStatement = xAPIBuilder.buildAnsweredStatement({
+      actor: ANONYMOUS_ACTOR,
+      object: {
+        id: objectIdFor(data.id),
+        name: { [data.locale ?? "en-US"]: data.title },
+        ...xapiDefinitionFor(data)
+      },
+      scoringResult,
+      timeSpentMs: timeSpent,
+      response: response.text
+    });
+    setResult(scoringResult);
+    onComplete?.({
+      score: scoringResult.score,
+      maxScore: scoringResult.maxScore,
+      passed: scoringResult.passed,
+      timeSpent,
+      xapiStatement
+    });
+    const correctWords = scoringResult.details.filter(
+      (detail) => (detail.outcome ?? (detail.correct ? "correct" : "incorrect")) === "correct"
+    ).length;
+    setSummary({
+      text: `${s.answerSubmitted} ${s.scoreAnnouncement(
+        Math.round(scoringResult.score * 100),
+        scoringResult.passed
+      )} ${s.dictationWordsSummary(correctWords, scoringResult.details.length)}`,
+      feedback: scoringResult.feedback
+    });
+    fireInteraction("submitted", {
+      length: text.length,
+      hintsRevealed: reportedHints,
+      score: scoringResult.score
+    });
+  };
+  const given = isControlled ? value : defaultValue;
+  const hasResponse = given !== void 0 && given.type === "dictation";
+  const contentLang = typeof data.locale === "string" ? data.locale.replaceAll("_", "-") : void 0;
+  const localeDir = localeDirectionOf(data.locale);
+  const alignment = useMemo(
+    () => revealing && transcript !== void 0 && (!isReview || hasResponse) ? alignDictation(data, text) : null,
+    [revealing, transcript, isReview, hasResponse, data, text]
+  );
+  const sentenceDiff = useMemo(
+    () => alignment !== null && alignment.attempt !== "" ? diffDictationChars(alignment.reference, alignment.attempt) : null,
+    [alignment]
+  );
+  const detailWords = useMemo(
+    () => isReview && alignment === null && outcome?.status === "scored" ? wordsFromDetails(outcome.details) : null,
+    [isReview, alignment, outcome]
+  );
+  const words = alignment?.words ?? detailWords;
+  const marksShown = revealing && words !== null;
+  const contentDir = localeDir ?? textDirectionOf(transcript ?? words?.map((word) => word.reference).join(" ") ?? "");
+  const nothingTyped = alignment !== null ? alignment.attempt === "" : words?.every((word) => word.attempt === "") ?? false;
+  const passed = isReview ? outcome?.status === "scored" || outcome?.status === "graded" ? outcome.passed : void 0 : result?.passed;
+  const reviewSummary = useMemo(() => {
+    if (!isReview || outcome === void 0) {
+      return null;
+    }
+    if (outcome.status === "scored") {
+      return {
+        text: s.scoreAnnouncement(Math.round(outcome.score * 100), outcome.passed),
+        feedback: outcome.feedback
+      };
+    }
+    if (outcome.status === "deferred") {
+      return { text: s.notGradedYet, feedback: null };
+    }
+    if (outcome.status === "graded") {
+      const percent = outcome.maxScore > 0 ? Math.round(outcome.score / outcome.maxScore * 100) : Math.round(outcome.score * 100);
+      return {
+        text: s.scoreAnnouncement(percent, outcome.passed),
+        feedback: outcome.feedback ?? null
+      };
+    }
+    return { text: s.noGradeAvailable, feedback: null };
+  }, [isReview, outcome, s]);
+  const sentenceFor = (word) => {
+    switch (word.status) {
+      case "correct":
+        return s.dictationWordCorrect(word.attempt);
+      case "incorrect":
+        return s.dictationWordWrong(word.attempt, word.reference);
+      case "missing":
+        return s.dictationWordMissing(word.reference);
+      default:
+        return s.dictationWordExtra(word.attempt);
+    }
+  };
+  const acceptedTranscripts = transcript === void 0 || !Array.isArray(data.acceptedTranscripts) ? void 0 : data.acceptedTranscripts.filter((entry) => typeof entry === "string");
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: "lk-dc",
+      "aria-labelledby": VISIBLE_TEXT_RE.test(data.title) ? titleId : void 0,
+      lang: locale,
+      "data-render-mode": renderMode,
+      style: theme,
+      onSubmit: handleSubmit,
+      children: [
+        /* @__PURE__ */ jsx("p", { id: titleId, className: "lk-dc-title", dir: localeDir ?? "auto", lang: contentLang, children: data.title }),
+        data.media !== void 0 || slowMedia !== void 0 ? /* @__PURE__ */ jsxs("div", { className: "lk-dc-recordings", children: [
+          data.media !== void 0 ? /* @__PURE__ */ jsxs("fieldset", { className: "lk-dc-recording", children: [
+            /* @__PURE__ */ jsx("legend", { className: "lk-dc-recording-label", children: s.dictationRecording }),
+            /* @__PURE__ */ jsx(
+              ActivityMedia,
+              {
+                media: data.media,
+                renderMode,
+                playbackGroup: recordingsGroup,
+                ...mediaBudget !== void 0 ? { mediaBudget } : {},
+                ...mediaStrings !== void 0 ? { mediaStrings } : {},
+                ...strings !== void 0 ? { strings } : {},
+                ...onInteraction !== void 0 ? { onInteraction } : {},
+                ...locale !== void 0 ? { locale } : {},
+                ...disabled !== void 0 ? { disabled } : {}
+              }
+            )
+          ] }) : null,
+          slowMedia !== void 0 ? /* @__PURE__ */ jsxs("fieldset", { className: "lk-dc-recording", "data-slow": "true", children: [
+            /* @__PURE__ */ jsx("legend", { className: "lk-dc-recording-label", children: s.dictationSlowRecording }),
+            /* @__PURE__ */ jsx(
+              ActivityMedia,
+              {
+                media: slowMedia,
+                renderMode,
+                playbackGroup: recordingsGroup,
+                ...mediaStrings !== void 0 ? { mediaStrings } : {},
+                ...strings !== void 0 ? { strings } : {},
+                ...locale !== void 0 ? { locale } : {},
+                ...disabled !== void 0 ? { disabled } : {}
+              }
+            )
+          ] }) : null
+        ] }) : null,
+        hintsEnabled ? /* @__PURE__ */ jsxs("div", { className: "lk-dc-hints", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              ref: revealButtonRef,
+              type: "button",
+              className: "lk-dc-hint-btn",
+              disabled: inactive,
+              "aria-disabled": hintsShown >= hintTotal || void 0,
+              onClick: revealNextHint,
+              children: s.dictationRevealNextWord(hintsShown, hintTotal)
+            }
+          ),
+          hintsShown > 0 ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "lk-dc-hint-reset",
+              disabled: inactive,
+              onClick: resetHints,
+              children: s.dictationResetHints
+            }
+          ) : null,
+          /* @__PURE__ */ jsx("p", { id: hintId, className: "lk-dc-hint", role: "status", dir: contentDir, lang: contentLang, children: hintsShown > 0 ? `${hintWords.slice(0, hintsShown).join(" ")}${hintsShown < hintTotal ? " \u2026" : ""}` : "" })
+        ] }) : null,
+        /* @__PURE__ */ jsxs("fieldset", { disabled: inactive, children: [
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              className: "lk-dc-input",
+              "aria-label": s.dictationInputLabel,
+              "aria-describedby": hintsEnabled && hintsShown > 0 ? hintId : void 0,
+              dir: "auto",
+              rows: 3,
+              maxLength: DICTATION_MAX_TEXT_LENGTH,
+              autoComplete: "off",
+              autoCapitalize: "none",
+              autoCorrect: "off",
+              spellCheck: false,
+              value: text,
+              disabled: inactive,
+              "aria-disabled": inactive || void 0,
+              "data-correct": revealing && passed !== void 0 && (!isReview || hasResponse) ? String(passed) : void 0,
+              onChange: (event) => handleTextChange(event.target.value)
+            }
+          ),
+          isReview ? null : (
+            // Enabled on empty text: an omission is a recorded answer.
+            /* @__PURE__ */ jsx("button", { type: "submit", disabled: inactive, children: isExam ? s.submitAnswers : s.checkAnswers })
+          )
+        ] }),
+        marksShown ? /* @__PURE__ */ jsxs("div", { className: "lk-dc-result", children: [
+          nothingTyped ? /* @__PURE__ */ jsx("p", { className: "lk-dc-nothing", role: "note", children: s.dictationNothingTyped }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("ol", { className: "lk-dc-words", "aria-label": s.dictationMarksLabel, dir: contentDir, children: words?.map((word, index) => {
+              const sentence = sentenceFor(word);
+              return /* @__PURE__ */ jsxs(
+                "li",
+                {
+                  className: "lk-dc-word",
+                  "data-state": word.status,
+                  title: sentence,
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "lk-visually-hidden", style: VISUALLY_HIDDEN, children: sentence }),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "lk-dc-word-text",
+                        "aria-hidden": "true",
+                        dir: contentDir ?? "auto",
+                        lang: contentLang,
+                        ...word.status === "incorrect" && alignment !== null ? { "data-marks": "characters" } : {},
+                        children: word.status === "incorrect" && alignment !== null ? /* @__PURE__ */ jsx(
+                          CharOps,
+                          {
+                            ops: diffDictationChars(word.reference, word.attempt),
+                            contentDir
+                          }
+                        ) : word.status === "missing" ? word.reference : word.attempt
+                      }
+                    )
+                  ]
+                },
+                index
+              );
+            }) }),
+            sentenceDiff !== null ? /* @__PURE__ */ jsx("p", { className: "lk-dc-diff", "aria-hidden": "true", dir: contentDir, lang: contentLang, children: /* @__PURE__ */ jsx(CharOps, { ops: sentenceDiff, contentDir }) }) : null,
+            /* @__PURE__ */ jsxs("ul", { className: "lk-dc-legend", children: [
+              /* @__PURE__ */ jsx("li", { "data-state": "correct", children: s.dictationLegendCorrect }),
+              /* @__PURE__ */ jsx("li", { "data-state": "incorrect", children: s.dictationLegendWrong }),
+              /* @__PURE__ */ jsx("li", { "data-state": "missing", children: s.dictationLegendMissing }),
+              alignment !== null ? /* @__PURE__ */ jsx("li", { "data-state": "extra", children: s.dictationLegendExtra }) : null
+            ] }),
+            /* @__PURE__ */ jsx("p", { className: "lk-dc-diff-note", children: s.dictationDiffNote })
+          ] }),
+          transcript !== void 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "lk-dc-solution-toggle",
+                "aria-expanded": solutionShown,
+                "aria-controls": solutionId,
+                onClick: () => setSolutionShown((shown) => !shown),
+                children: solutionShown ? s.hideSolution : s.showSolution
+              }
+            ),
+            solutionShown ? /* @__PURE__ */ jsxs(
+              "blockquote",
+              {
+                id: solutionId,
+                className: "lk-dc-solution",
+                "aria-label": s.dictationSolutionLabel,
+                dir: contentDir,
+                children: [
+                  /* @__PURE__ */ jsx("p", { lang: contentLang, children: transcript }),
+                  acceptedTranscripts !== void 0 && acceptedTranscripts.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "lk-dc-solution-alternatives", lang: contentLang, children: acceptedTranscripts.map((alternative) => /* @__PURE__ */ jsx("li", { children: alternative }, alternative)) }) : null
+                ]
+              }
+            ) : null
+          ] }) : null
+        ] }) : null,
+        /* @__PURE__ */ jsx(FeedbackRegion, { id: `${data.id}-feedback`, children: /* @__PURE__ */ jsx(AnnouncementText, { announcement: isReview ? reviewSummary : summary }) })
+      ]
+    }
+  );
+}
+function Dictation2(props) {
+  const strings = useLkStrings(props.strings);
+  return /* @__PURE__ */ jsx(ActivityErrorBoundary, { activityTitle: props.data?.title, strings, children: /* @__PURE__ */ jsx(Dictation, { ...props }) });
+}
+
+export { Dictation2 as Dictation };
+//# sourceMappingURL=chunk-47HHC4GD.js.map
+//# sourceMappingURL=chunk-47HHC4GD.js.map