@lessonkit/react 0.4.0 → 0.6.0

package/dist/index.cjs

@@ -54,8 +54,153 @@ var import_accessibility = require("@lessonkit/accessibility");
 
 // src/context.tsx
 var import_react = require("react");
-var import_core2 = require("@lessonkit/core");
-var import_xapi2 = require("@lessonkit/xapi");
+var import_core3 = require("@lessonkit/core");
+var import_xapi3 = require("@lessonkit/xapi");
+var import_xapi4 = require("@lessonkit/xapi");
+
+// src/runtime/emitTelemetry.ts
+var import_core = require("@lessonkit/core");
+var import_xapi = require("@lessonkit/xapi");
+
+// src/runtime/lxpackBridge.ts
+var import_bridge = require("@lessonkit/lxpack/bridge");
+function getBridge() {
+  if (typeof window === "undefined") return null;
+  const parent = window.parent;
+  if (!parent || parent === window) return null;
+  return parent.lxpackBridge?.v1 ?? parent.lxpack ?? null;
+}
+function forwardTelemetryToLxpack(event, mode = "auto") {
+  if (mode === "off") return;
+  const bridge = getBridge();
+  if (!bridge) return;
+  switch (event.name) {
+    case "lesson_completed": {
+      const lessonId = event.lessonId;
+      if (lessonId) bridge.completeLesson?.(lessonId);
+      return;
+    }
+    case "course_completed":
+      bridge.completeCourse?.();
+      return;
+    case "quiz_completed": {
+      const data = event.data;
+      if (!data?.checkId) return;
+      const scaled = (0, import_bridge.normalizeAssessmentScore)({
+        score: data.score,
+        maxScore: data.maxScore
+      });
+      if (scaled === null) return;
+      bridge.submitAssessment?.({
+        id: data.checkId,
+        score: scaled,
+        passingScore: (0, import_bridge.normalizeAssessmentPassingScore)(data.passingScore)
+      });
+      return;
+    }
+    default:
+      return;
+  }
+}
+
+// src/runtime/emitTelemetry.ts
+var warnedMissingCourseId = false;
+var warnedMissingQuizLesson = false;
+function isDevEnvironment() {
+  const g = globalThis;
+  return typeof g.process !== "undefined" && g.process.env?.NODE_ENV !== "production";
+}
+function emitTelemetry(tracking, xapi, event, opts) {
+  if (!event.courseId) {
+    if (isDevEnvironment() && !warnedMissingCourseId) {
+      warnedMissingCourseId = true;
+      console.warn("[lessonkit] telemetry event missing courseId");
+    }
+    return;
+  }
+  tracking.track(event);
+  try {
+    const statement = (0, import_xapi.telemetryEventToXAPIStatement)(event);
+    if (statement) xapi?.send(statement);
+  } catch (err) {
+    if (isDevEnvironment()) {
+      console.warn("[lessonkit] xAPI mapping skipped:", err instanceof Error ? err.message : err);
+    }
+  }
+  forwardTelemetryToLxpack(event, opts?.lxpackBridge ?? "auto");
+}
+function buildTrackEvent(opts) {
+  const base = {
+    timestamp: (0, import_core.nowIso)(),
+    courseId: opts.courseId,
+    sessionId: opts.sessionId,
+    attemptId: opts.attemptId,
+    user: opts.user
+  };
+  switch (opts.name) {
+    case "course_started":
+      return { name: "course_started", ...base };
+    case "course_completed":
+      return { name: "course_completed", ...base };
+    case "lesson_started": {
+      const data = opts.data;
+      const lessonId = opts.lessonId ?? data?.lessonId;
+      if (!lessonId) throw new Error("lesson_started requires lessonId");
+      return {
+        name: "lesson_started",
+        ...base,
+        lessonId,
+        data: { ...data, lessonId }
+      };
+    }
+    case "lesson_completed":
+    case "lesson_time_on_task": {
+      const data = opts.data;
+      const lessonId = opts.lessonId ?? data?.lessonId;
+      if (!lessonId) throw new Error(`${opts.name} requires lessonId`);
+      return {
+        name: opts.name,
+        ...base,
+        lessonId,
+        data: { ...data, lessonId }
+      };
+    }
+    case "quiz_answered": {
+      const data = opts.data;
+      const lessonId = opts.lessonId;
+      if (!lessonId) throw new Error("quiz_answered requires active lessonId");
+      return { name: "quiz_answered", ...base, lessonId, data };
+    }
+    case "quiz_completed": {
+      const data = opts.data;
+      const lessonId = opts.lessonId;
+      if (!lessonId) throw new Error("quiz_completed requires active lessonId");
+      return { name: "quiz_completed", ...base, lessonId, data };
+    }
+    case "interaction":
+      return {
+        name: "interaction",
+        ...base,
+        lessonId: opts.lessonId,
+        data: opts.data
+      };
+    default:
+      return { name: opts.name, ...base };
+  }
+}
+function tryBuildTrackEvent(opts) {
+  const isQuiz = opts.name === "quiz_answered" || opts.name === "quiz_completed";
+  if (isQuiz && !opts.lessonId) {
+    if (isDevEnvironment() && !warnedMissingQuizLesson) {
+      warnedMissingQuizLesson = true;
+      console.warn(
+        `[lessonkit] ${opts.name} skipped: wrap <Quiz> in <Lesson> so an active lessonId is available`
+      );
+    }
+    return null;
+  }
+  return buildTrackEvent(opts);
+}
 
 // src/runtime/ports.ts
 function createNoopStorage() {
@@ -84,24 +229,62 @@ function createSessionStoragePort() {
   };
 }
 
+// src/runtime/progress.ts
+function createProgressController() {
+  let activeLessonId;
+  let completedLessonIds = /* @__PURE__ */ new Set();
+  let courseCompleted = false;
+  const lessonStartTimes = /* @__PURE__ */ new Map();
+  return {
+    getState: () => ({
+      activeLessonId,
+      completedLessonIds: new Set(completedLessonIds),
+      courseCompleted
+    }),
+    setActiveLesson: (lessonId, startedAtMs) => {
+      const previousLessonId = activeLessonId;
+      activeLessonId = lessonId;
+      lessonStartTimes.set(lessonId, startedAtMs);
+      return { previousLessonId };
+    },
+    completeLesson: (lessonId, completedAtMs) => {
+      if (completedLessonIds.has(lessonId)) return { didComplete: false };
+      completedLessonIds = new Set(completedLessonIds).add(lessonId);
+      const startedAt = lessonStartTimes.get(lessonId);
+      lessonStartTimes.delete(lessonId);
+      const durationMs = typeof startedAt === "number" ? Math.max(0, completedAtMs - startedAt) : void 0;
+      return { durationMs, didComplete: true };
+    },
+    completeCourse: () => {
+      if (courseCompleted) return { didComplete: false };
+      courseCompleted = true;
+      return { didComplete: true };
+    }
+  };
+}
+
 // src/runtime/xapi.ts
-var import_xapi = require("@lessonkit/xapi");
+var import_xapi2 = require("@lessonkit/xapi");
 function createXapiClientFromConfig(config, queue) {
   if (config.xapi?.enabled === false) return null;
   if (config.xapi?.client) return config.xapi.client;
-  const baseId = config.courseId ? `urn:lessonkit:course:${config.courseId}` : void 0;
-  return (0, import_xapi.createXAPIClient)({ baseId, transport: config.xapi?.transport, queue });
+  if (!config.courseId) return null;
+  return (0, import_xapi2.createXAPIClient)({
+    courseId: config.courseId,
+    transport: config.xapi?.transport,
+    queue
+  });
 }
 
 // src/runtime/session.ts
-var import_core = require("@lessonkit/core");
+var import_core2 = require("@lessonkit/core");
 var SESSION_STORAGE_KEY = "lessonkit:sessionId";
 var COURSE_STARTED_PREFIX = "lessonkit:course_started:";
 function resolveSessionId(storage, provided) {
   if (provided) return provided;
   const existing = storage.getItem(SESSION_STORAGE_KEY);
   if (existing) return existing;
-  const id = (0, import_core.createSessionId)();
+  const id = (0, import_core2.createSessionId)();
   storage.setItem(SESSION_STORAGE_KEY, id);
   return id;
 }
@@ -128,16 +311,16 @@ function disposeTrackingClient(client) {
 var defaultStorage = createSessionStoragePort();
 function createTrackingClientFromConfig(config) {
   if (config.tracking?.enabled === false) {
-    return (0, import_core2.createTrackingClient)();
+    return (0, import_core3.createTrackingClient)();
   }
-  return (0, import_core2.createTrackingClient)({
+  return (0, import_core3.createTrackingClient)({
     sink: config.tracking?.sink,
     batchSink: config.tracking?.batchSink,
     batch: config.tracking?.batch
   });
 }
 function LessonkitProvider(props) {
-  const config = props.config ?? {};
+  const config = props.config;
   const sessionIdRef = (0, import_react.useRef)(resolveSessionId(defaultStorage, config.session?.sessionId));
   if (config.session?.sessionId) sessionIdRef.current = config.session.sessionId;
   const attemptIdRef = (0, import_react.useRef)(config.session?.attemptId);
@@ -146,50 +329,16 @@ function LessonkitProvider(props) {
   userRef.current = config.session?.user;
   const courseIdRef = (0, import_react.useRef)(config.courseId);
   courseIdRef.current = config.courseId;
-  const trackingRef = (0, import_react.useRef)((0, import_core2.createTrackingClient)());
-  const [tracking, setTracking] = (0, import_react.useState)(() => trackingRef.current);
-  const courseStartedInProviderRef = (0, import_react.useRef)(false);
-  const trackingEnabled = config.tracking?.enabled;
-  const trackingSink = config.tracking?.sink;
-  const trackingBatchSink = config.tracking?.batchSink;
-  const batchEnabled = config.tracking?.batch?.enabled;
-  const batchFlushIntervalMs = config.tracking?.batch?.flushIntervalMs;
-  const batchMaxBatchSize = config.tracking?.batch?.maxBatchSize;
-  useIsoLayoutEffect(() => {
-    const prev = trackingRef.current;
-    const next = createTrackingClientFromConfig(config);
-    trackingRef.current = next;
-    setTracking(next);
-    const sessionId = sessionIdRef.current;
-    const cid = courseIdRef.current;
-    const shouldEmitCourseStarted = cid ? !hasCourseStarted(defaultStorage, sessionId, cid) : !courseStartedInProviderRef.current;
-    if (shouldEmitCourseStarted) {
-      if (cid) {
-        markCourseStarted(defaultStorage, sessionId, cid);
-      } else {
-        courseStartedInProviderRef.current = true;
-      }
-      next.track({
-        name: "course_started",
-        timestamp: (0, import_core2.nowIso)(),
-        courseId: cid,
-        sessionId,
-        attemptId: attemptIdRef.current,
-        user: userRef.current
-      });
-    }
-    return () => {
-      disposeTrackingClient(prev);
-    };
-  }, [
-    trackingEnabled,
-    trackingSink,
-    trackingBatchSink,
-    batchEnabled,
-    batchFlushIntervalMs,
-    batchMaxBatchSize
-  ]);
-  const xapiQueueRef = (0, import_react.useRef)((0, import_xapi2.createInMemoryXAPIQueue)());
+  const lxpackBridgeModeRef = (0, import_react.useRef)(config.lxpack?.bridge ?? "auto");
+  lxpackBridgeModeRef.current = config.lxpack?.bridge ?? "auto";
+  const progressRef = (0, import_react.useRef)(createProgressController());
+  const [progress, setProgress] = (0, import_react.useState)(() => progressRef.current.getState());
+  const syncProgress = (0, import_react.useCallback)(() => {
+    setProgress(progressRef.current.getState());
+  }, []);
+  const activeLessonIdRef = (0, import_react.useRef)(progress.activeLessonId);
+  activeLessonIdRef.current = progress.activeLessonId;
+  const xapiQueueRef = (0, import_react.useRef)((0, import_xapi3.createInMemoryXAPIQueue)());
   const xapiRef = (0, import_react.useRef)(null);
   const [xapi, setXapi] = (0, import_react.useState)(null);
   const xapiEnabled = config.xapi?.enabled;
@@ -201,6 +350,25 @@ function LessonkitProvider(props) {
     const next = createXapiClientFromConfig(config, xapiQueueRef.current);
     xapiRef.current = next;
     setXapi(next);
+    if (next && !prev) {
+      const sessionId = sessionIdRef.current;
+      const cid = courseIdRef.current;
+      if (hasCourseStarted(defaultStorage, sessionId, cid)) {
+        try {
+          const statement = (0, import_xapi4.telemetryEventToXAPIStatement)(
+            buildTrackEvent({
+              name: "course_started",
+              courseId: cid,
+              sessionId,
+              attemptId: attemptIdRef.current,
+              user: userRef.current
+            })
+          );
+          if (statement) next.send(statement);
+        } catch {
+        }
+      }
+    }
     void (async () => {
       if (prev) {
         try {
@@ -217,21 +385,59 @@ function LessonkitProvider(props) {
       void prev?.flush();
     };
   }, [xapiEnabled, xapiClient, xapiTransport, courseId]);
-  const [completedLessonIds, setCompletedLessonIds] = (0, import_react.useState)(() => /* @__PURE__ */ new Set());
-  const completedLessonIdsRef = (0, import_react.useRef)(completedLessonIds);
-  completedLessonIdsRef.current = completedLessonIds;
-  const [activeLessonId, setActiveLessonId] = (0, import_react.useState)(void 0);
-  const [courseCompleted, setCourseCompleted] = (0, import_react.useState)(false);
-  const courseCompletedRef = (0, import_react.useRef)(false);
-  courseCompletedRef.current = courseCompleted;
-  const activeLessonIdRef = (0, import_react.useRef)(void 0);
-  activeLessonIdRef.current = activeLessonId;
-  const lessonStartTimesRef = (0, import_react.useRef)(/* @__PURE__ */ new Map());
+  const trackingRef = (0, import_react.useRef)((0, import_core3.createTrackingClient)());
+  const [tracking, setTracking] = (0, import_react.useState)(() => trackingRef.current);
+  const trackingEnabled = config.tracking?.enabled;
+  const trackingSink = config.tracking?.sink;
+  const trackingBatchSink = config.tracking?.batchSink;
+  const batchEnabled = config.tracking?.batch?.enabled;
+  const batchFlushIntervalMs = config.tracking?.batch?.flushIntervalMs;
+  const batchMaxBatchSize = config.tracking?.batch?.maxBatchSize;
+  useIsoLayoutEffect(() => {
+    const prev = trackingRef.current;
+    const next = createTrackingClientFromConfig(config);
+    trackingRef.current = next;
+    setTracking(next);
+    const sessionId = sessionIdRef.current;
+    const cid = courseIdRef.current;
+    if (!hasCourseStarted(defaultStorage, sessionId, cid)) {
+      markCourseStarted(defaultStorage, sessionId, cid);
+      emitTelemetry(
+        next,
+        xapiRef.current,
+        buildTrackEvent({
+          name: "course_started",
+          courseId: cid,
+          sessionId,
+          attemptId: attemptIdRef.current,
+          user: userRef.current
+        }),
+        { lxpackBridge: lxpackBridgeModeRef.current }
+      );
+    }
+    return () => {
+      disposeTrackingClient(prev);
+    };
+  }, [
+    trackingEnabled,
+    trackingSink,
+    trackingBatchSink,
+    batchEnabled,
+    batchFlushIntervalMs,
+    batchMaxBatchSize
+  ]);
+  const emitWithBridge = (0, import_react.useCallback)(
+    (trackingClient, event) => {
+      emitTelemetry(trackingClient, xapiRef.current, event, {
+        lxpackBridge: lxpackBridgeModeRef.current
+      });
+    },
+    []
+  );
   const track = (0, import_react.useCallback)(
     (name, data, opts) => {
-      trackingRef.current?.track({
+      const event = tryBuildTrackEvent({
         name,
-        timestamp: (0, import_core2.nowIso)(),
         courseId: courseIdRef.current,
         lessonId: opts?.lessonId ?? activeLessonIdRef.current,
         sessionId: sessionIdRef.current,
@@ -239,54 +445,85 @@ function LessonkitProvider(props) {
         user: userRef.current,
         data
       });
+      if (!event) return;
+      emitWithBridge(trackingRef.current, event);
     },
-    []
+    [emitWithBridge]
   );
+  const prevCourseIdRef = (0, import_react.useRef)(config.courseId);
+  (0, import_react.useEffect)(() => {
+    if (prevCourseIdRef.current === config.courseId) return;
+    prevCourseIdRef.current = config.courseId;
+    progressRef.current = createProgressController();
+    syncProgress();
+    const sessionId = sessionIdRef.current;
+    const cid = config.courseId;
+    if (!hasCourseStarted(defaultStorage, sessionId, cid)) {
+      markCourseStarted(defaultStorage, sessionId, cid);
+      emitTelemetry(
+        trackingRef.current,
+        xapiRef.current,
+        buildTrackEvent({
+          name: "course_started",
+          courseId: cid,
+          sessionId,
+          attemptId: attemptIdRef.current,
+          user: userRef.current
+        }),
+        { lxpackBridge: lxpackBridgeModeRef.current }
+      );
+    }
+  }, [config.courseId, syncProgress]);
   (0, import_react.useEffect)(() => {
     return () => {
       trackingRef.current?.flush?.();
       void xapiRef.current?.flush();
     };
   }, []);
-  const setActiveLesson = (0, import_react.useCallback)((lessonId) => {
-    if (activeLessonIdRef.current === lessonId) return;
-    activeLessonIdRef.current = lessonId;
-    setActiveLessonId(lessonId);
-    lessonStartTimesRef.current.set(lessonId, Date.now());
-    track("lesson_started", { lessonId }, { lessonId });
-    xapiRef.current?.startedLesson({ lessonId });
-  }, [track]);
-  const completeLesson = (0, import_react.useCallback)(
-    (lessonId) => {
-      if (completedLessonIdsRef.current.has(lessonId)) return;
-      completedLessonIdsRef.current = new Set(completedLessonIdsRef.current).add(lessonId);
-      setCompletedLessonIds(completedLessonIdsRef.current);
-      const startedAt = lessonStartTimesRef.current.get(lessonId);
-      lessonStartTimesRef.current.delete(lessonId);
-      const durationMs = typeof startedAt === "number" ? Math.max(0, Date.now() - startedAt) : void 0;
+  const emitLessonCompleted = (0, import_react.useCallback)(
+    (lessonId, durationMs) => {
       track("lesson_completed", { lessonId, durationMs }, { lessonId });
       if (durationMs !== void 0) {
         track("lesson_time_on_task", { lessonId, durationMs }, { lessonId });
       }
-      xapiRef.current?.completeLesson({ lessonId, durationMs });
     },
     [track]
   );
+  const completeLesson = (0, import_react.useCallback)(
+    (lessonId) => {
+      const result = progressRef.current.completeLesson(lessonId, Date.now());
+      if (!result.didComplete) return;
+      syncProgress();
+      emitLessonCompleted(lessonId, result.durationMs);
+    },
+    [syncProgress, emitLessonCompleted]
+  );
+  const setActiveLesson = (0, import_react.useCallback)(
+    (lessonId) => {
+      const current = progressRef.current.getState();
+      if (current.activeLessonId === lessonId) return;
+      const previous = current.activeLessonId;
+      if (previous && previous !== lessonId) {
+        const completed = progressRef.current.completeLesson(previous, Date.now());
+        if (completed.didComplete) {
+          emitLessonCompleted(previous, completed.durationMs);
+        }
+      }
+      progressRef.current.setActiveLesson(lessonId, Date.now());
+      syncProgress();
+      track("lesson_started", { lessonId }, { lessonId });
+    },
+    [track, syncProgress, emitLessonCompleted]
+  );
   const completeCourse = (0, import_react.useCallback)(() => {
-    if (courseCompletedRef.current) return;
-    courseCompletedRef.current = true;
-    setCourseCompleted(true);
+    const result = progressRef.current.completeCourse();
+    if (!result.didComplete) return;
+    syncProgress();
     track("course_completed");
-    xapiRef.current?.completeCourse();
-  }, [track]);
-  const progress = (0, import_react.useMemo)(
-    () => ({
-      activeLessonId,
-      completedLessonIds: new Set(completedLessonIds),
-      courseCompleted
-    }),
-    [activeLessonId, completedLessonIds, courseCompleted]
-  );
+  }, [track, syncProgress]);
+  const sessionUser = config.session?.user;
+  const sessionAttemptId = config.session?.attemptId;
+  const sessionConfiguredId = config.session?.sessionId;
   const runtime = (0, import_react.useMemo)(
     () => ({
       config,
@@ -299,7 +536,19 @@ function LessonkitProvider(props) {
       completeCourse,
       track
     }),
-    [config, tracking, xapi, progress, setActiveLesson, completeLesson, completeCourse, track]
+    [
+      config,
+      tracking,
+      xapi,
+      progress,
+      setActiveLesson,
+      completeLesson,
+      completeCourse,
+      track,
+      sessionUser,
+      sessionAttemptId,
+      sessionConfiguredId
+    ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LessonkitContext.Provider, { value: runtime, children: props.children });
 }
@@ -338,9 +587,28 @@ function useQuizState() {
   );
 }
 
+// src/runtime/validateComponentId.ts
+var import_core4 = require("@lessonkit/core");
+var warnedPaths = /* @__PURE__ */ new Set();
+function isDevEnvironment2() {
+  const g = globalThis;
+  return typeof g.process !== "undefined" && g.process.env?.NODE_ENV !== "production";
+}
+function warnInvalidComponentId(id, path) {
+  if (!isDevEnvironment2()) return;
+  const key = `${path}:${String(id)}`;
+  if (warnedPaths.has(key)) return;
+  const result = (0, import_core4.validateId)(id, path);
+  if (result.ok) return;
+  warnedPaths.add(key);
+  const detail = result.issues.map((i) => `${i.path}: ${i.message}`).join("; ");
+  console.warn(`[lessonkit] invalid ${path} \u2014 ${detail}`);
+}
+
 // src/components.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function Course(props) {
+  warnInvalidComponentId(props.courseId, "courseId");
   const providerConfig = (0, import_react3.useMemo)(
     () => ({ ...props.config, courseId: props.courseId }),
     [props.config, props.courseId]
@@ -351,15 +619,23 @@ function Course(props) {
   ] }) });
 }
 function Lesson(props) {
+  warnInvalidComponentId(props.lessonId, "lessonId");
   const { setActiveLesson } = useLessonkit();
   const { completeLesson } = useCompletion();
-  const reactId = (0, import_react3.useId)();
-  const generatedId = (0, import_react3.useMemo)(() => `lesson-${sanitizeLessonId(reactId)}`, [reactId]);
-  const id = props.lessonId ?? generatedId;
+  const id = props.lessonId;
+  const pendingCompleteRef = (0, import_react3.useRef)(null);
   (0, import_react3.useEffect)(() => {
+    if (pendingCompleteRef.current !== null) {
+      clearTimeout(pendingCompleteRef.current);
+      pendingCompleteRef.current = null;
+    }
     setActiveLesson(id);
     return () => {
-      completeLesson(id);
+      const lessonId = id;
+      pendingCompleteRef.current = setTimeout(() => {
+        pendingCompleteRef.current = null;
+        completeLesson(lessonId);
+      }, 0);
     };
   }, [id, setActiveLesson, completeLesson]);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("article", { "aria-label": props.title, children: [
@@ -368,11 +644,13 @@ function Lesson(props) {
   ] });
 }
 function Scenario(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("section", { "aria-label": "Scenario", children: props.children });
+  if (props.blockId !== void 0) warnInvalidComponentId(props.blockId, "blockId");
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("section", { "aria-label": "Scenario", "data-lk-block-id": props.blockId, children: props.children });
 }
 function Reflection(props) {
+  if (props.blockId !== void 0) warnInvalidComponentId(props.blockId, "blockId");
   const promptId = (0, import_react3.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { "aria-label": "Reflection", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { "aria-label": "Reflection", "data-lk-block-id": props.blockId, children: [
     props.prompt ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { id: promptId, children: props.prompt }) : null,
     props.children,
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
@@ -385,14 +663,23 @@ function Reflection(props) {
   ] });
 }
 function KnowledgeCheck(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Quiz, { question: props.question, choices: props.choices, answer: props.answer });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    Quiz,
+    {
+      checkId: props.checkId,
+      question: props.question,
+      choices: props.choices,
+      answer: props.answer
+    }
+  );
 }
 function Quiz(props) {
+  warnInvalidComponentId(props.checkId, "checkId");
   const quiz = useQuizState();
   const [selected, setSelected] = (0, import_react3.useState)(null);
   const completedRef = (0, import_react3.useRef)(false);
   const questionId = (0, import_react3.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { "aria-label": "Quiz", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { "aria-label": "Quiz", "data-lk-check-id": props.checkId, children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { id: questionId, children: props.question }),
     /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("fieldset", { "aria-labelledby": questionId, children: [
       /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("legend", { style: import_accessibility.visuallyHiddenStyle, children: "Quiz choices" }),
@@ -407,10 +694,15 @@ function Quiz(props) {
             onChange: () => {
               setSelected(c);
               const correct = c === props.answer;
-              quiz.answer({ question: props.question, choice: c, correct });
+              quiz.answer({
+                checkId: props.checkId,
+                question: props.question,
+                choice: c,
+                correct
+              });
               if (correct && !completedRef.current) {
                 completedRef.current = true;
-                quiz.complete({ score: 1, maxScore: 1 });
+                quiz.complete({ checkId: props.checkId, score: 1, maxScore: 1, passingScore: 1 });
               }
             }
           }
@@ -429,10 +721,6 @@ function ProgressTracker() {
     completed
   ] }) });
 }
-function sanitizeLessonId(id) {
-  const s = id.replace(/[^a-zA-Z0-9_-]/g, "");
-  return s.length ? s : "id";
-}
 
 // src/theme/ThemeProvider.tsx
 var import_react4 = __toESM(require("react"), 1);