@lessonkit/react 0.5.0 → 0.6.0

package/README.md

@@ -1,6 +1,6 @@
 # `@lessonkit/react`
 
-[![CI](https://github.com/eddiethedean/lessonkit/actions/workflows/checks.yml/badge.svg)](https://github.com/eddiethedean/lessonkit/actions/workflows/checks.yml)
+[![CI](https://github.com/eddiethedean/lessonkit/actions/workflows/ci.yml/badge.svg)](https://github.com/eddiethedean/lessonkit/actions/workflows/ci.yml)
 [![npm](https://img.shields.io/npm/v/@lessonkit/react.svg)](https://www.npmjs.com/package/@lessonkit/react)
 [![License](https://img.shields.io/github/license/eddiethedean/lessonkit)](../../LICENSE)
 
@@ -56,7 +56,7 @@ export default function App() {
 }
 ```
 
-## API (0.5.0)
+## API (0.6.0)
 
 ### Components
 
@@ -87,6 +87,8 @@ export default function App() {
 - `Course` accepts a `config` prop that is passed through to `LessonkitProvider` (tracking sink,
   optional `xapi.transport` or custom `xapi.client`, session metadata). Hoist `config` with `useMemo`
   so tracking/xAPI clients are not recreated every render.
+- xAPI is enabled by default unless `xapi.enabled: false`. Provide `xapi.transport` or `xapi.client`
+  or statements are queued in memory and never sent (dev warns once).
 - A lesson is marked complete when its `<Lesson>` unmounts (for example, wizard navigation) or when
   another lesson becomes active via `setActiveLesson`. Use stable `lessonId` values so completion and
   time-on-task telemetry stay consistent.

package/dist/index.cjs

@@ -56,16 +56,61 @@ var import_accessibility = require("@lessonkit/accessibility");
 var import_react = require("react");
 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) {
+function emitTelemetry(tracking, xapi, event, opts) {
   if (!event.courseId) {
     if (isDevEnvironment() && !warnedMissingCourseId) {
       warnedMissingCourseId = true;
@@ -82,6 +127,7 @@ function emitTelemetry(tracking, xapi, event) {
       console.warn("[lessonkit] xAPI mapping skipped:", err instanceof Error ? err.message : err);
     }
   }
+  forwardTelemetryToLxpack(event, opts?.lxpackBridge ?? "auto");
 }
 function buildTrackEvent(opts) {
   const base = {
@@ -104,7 +150,7 @@ function buildTrackEvent(opts) {
         name: "lesson_started",
         ...base,
         lessonId,
-        data: { lessonId, ...data }
+        data: { ...data, lessonId }
       };
     }
     case "lesson_completed":
@@ -116,7 +162,7 @@ function buildTrackEvent(opts) {
         name: opts.name,
         ...base,
         lessonId,
-        data: { lessonId, ...data }
+        data: { ...data, lessonId }
       };
     }
     case "quiz_answered": {
@@ -142,6 +188,19 @@ function buildTrackEvent(opts) {
       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() {
@@ -270,6 +329,8 @@ function LessonkitProvider(props) {
   userRef.current = config.session?.user;
   const courseIdRef = (0, import_react.useRef)(config.courseId);
   courseIdRef.current = config.courseId;
+  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)(() => {
@@ -277,6 +338,53 @@ function LessonkitProvider(props) {
   }, []);
   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;
+  const xapiClient = config.xapi?.client;
+  const xapiTransport = config.xapi?.transport;
+  const courseId = config.courseId;
+  useIsoLayoutEffect(() => {
+    const prev = xapiRef.current;
+    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 {
+          await prev.flush();
+        } catch {
+        }
+      }
+      try {
+        await next?.flush();
+      } catch {
+      }
+    })();
+    return () => {
+      void prev?.flush();
+    };
+  }, [xapiEnabled, xapiClient, xapiTransport, courseId]);
   const trackingRef = (0, import_react.useRef)((0, import_core3.createTrackingClient)());
   const [tracking, setTracking] = (0, import_react.useState)(() => trackingRef.current);
   const trackingEnabled = config.tracking?.enabled;
@@ -303,7 +411,8 @@ function LessonkitProvider(props) {
           sessionId,
           attemptId: attemptIdRef.current,
           user: userRef.current
-        })
+        }),
+        { lxpackBridge: lxpackBridgeModeRef.current }
       );
     }
     return () => {
@@ -317,37 +426,17 @@ function LessonkitProvider(props) {
     batchFlushIntervalMs,
     batchMaxBatchSize
   ]);
-  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;
-  const xapiClient = config.xapi?.client;
-  const xapiTransport = config.xapi?.transport;
-  const courseId = config.courseId;
-  useIsoLayoutEffect(() => {
-    const prev = xapiRef.current;
-    const next = createXapiClientFromConfig(config, xapiQueueRef.current);
-    xapiRef.current = next;
-    setXapi(next);
-    void (async () => {
-      if (prev) {
-        try {
-          await prev.flush();
-        } catch {
-        }
-      }
-      try {
-        await next?.flush();
-      } catch {
-      }
-    })();
-    return () => {
-      void prev?.flush();
-    };
-  }, [xapiEnabled, xapiClient, xapiTransport, courseId]);
+  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) => {
-      const event = buildTrackEvent({
+      const event = tryBuildTrackEvent({
         name,
         courseId: courseIdRef.current,
         lessonId: opts?.lessonId ?? activeLessonIdRef.current,
@@ -356,10 +445,35 @@ function LessonkitProvider(props) {
         user: userRef.current,
         data
       });
-      emitTelemetry(trackingRef.current, xapiRef.current, event);
+      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?.();
@@ -407,6 +521,9 @@ function LessonkitProvider(props) {
     syncProgress();
     track("course_completed");
   }, [track, syncProgress]);
+  const sessionUser = config.session?.user;
+  const sessionAttemptId = config.session?.attemptId;
+  const sessionConfiguredId = config.session?.sessionId;
   const runtime = (0, import_react.useMemo)(
     () => ({
       config,
@@ -419,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 });
 }
@@ -573,7 +702,7 @@ function Quiz(props) {
               });
               if (correct && !completedRef.current) {
                 completedRef.current = true;
-                quiz.complete({ checkId: props.checkId, score: 1, maxScore: 1 });
+                quiz.complete({ checkId: props.checkId, score: 1, maxScore: 1, passingScore: 1 });
               }
             }
           }

package/dist/index.d.cts

@@ -34,6 +34,10 @@ type LessonkitConfig = {
         transport?: XAPITransport;
         client?: XAPIClient;
     };
+    lxpack?: {
+        /** Forward completion events to `window.parent.lxpackBridge.v1` when embedded (default `auto`). */
+        bridge?: "auto" | "off";
+    };
 };
 
 type LessonkitRuntime = {
@@ -114,6 +118,7 @@ declare function useQuizState(): {
         checkId: CheckId;
         score?: number;
         maxScore?: number;
+        passingScore?: number;
     }) => void;
 };
 

package/dist/index.d.ts

@@ -34,6 +34,10 @@ type LessonkitConfig = {
         transport?: XAPITransport;
         client?: XAPIClient;
     };
+    lxpack?: {
+        /** Forward completion events to `window.parent.lxpackBridge.v1` when embedded (default `auto`). */
+        bridge?: "auto" | "off";
+    };
 };
 
 type LessonkitRuntime = {
@@ -114,6 +118,7 @@ declare function useQuizState(): {
         checkId: CheckId;
         score?: number;
         maxScore?: number;
+        passingScore?: number;
     }) => void;
 };
 

package/dist/index.js

@@ -14,16 +14,64 @@ import {
 } from "react";
 import { createTrackingClient } from "@lessonkit/core";
 import { createInMemoryXAPIQueue } from "@lessonkit/xapi";
+import { telemetryEventToXAPIStatement as telemetryEventToXAPIStatement2 } from "@lessonkit/xapi";
 
 // src/runtime/emitTelemetry.ts
 import { nowIso } from "@lessonkit/core";
 import { telemetryEventToXAPIStatement } from "@lessonkit/xapi";
+
+// src/runtime/lxpackBridge.ts
+import {
+  normalizeAssessmentPassingScore,
+  normalizeAssessmentScore
+} from "@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 = normalizeAssessmentScore({
+        score: data.score,
+        maxScore: data.maxScore
+      });
+      if (scaled === null) return;
+      bridge.submitAssessment?.({
+        id: data.checkId,
+        score: scaled,
+        passingScore: 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) {
+function emitTelemetry(tracking, xapi, event, opts) {
   if (!event.courseId) {
     if (isDevEnvironment() && !warnedMissingCourseId) {
       warnedMissingCourseId = true;
@@ -40,6 +88,7 @@ function emitTelemetry(tracking, xapi, event) {
       console.warn("[lessonkit] xAPI mapping skipped:", err instanceof Error ? err.message : err);
     }
   }
+  forwardTelemetryToLxpack(event, opts?.lxpackBridge ?? "auto");
 }
 function buildTrackEvent(opts) {
   const base = {
@@ -62,7 +111,7 @@ function buildTrackEvent(opts) {
         name: "lesson_started",
         ...base,
         lessonId,
-        data: { lessonId, ...data }
+        data: { ...data, lessonId }
       };
     }
     case "lesson_completed":
@@ -74,7 +123,7 @@ function buildTrackEvent(opts) {
         name: opts.name,
         ...base,
         lessonId,
-        data: { lessonId, ...data }
+        data: { ...data, lessonId }
       };
     }
     case "quiz_answered": {
@@ -100,6 +149,19 @@ function buildTrackEvent(opts) {
       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() {
@@ -228,6 +290,8 @@ function LessonkitProvider(props) {
   userRef.current = config.session?.user;
   const courseIdRef = useRef(config.courseId);
   courseIdRef.current = config.courseId;
+  const lxpackBridgeModeRef = useRef(config.lxpack?.bridge ?? "auto");
+  lxpackBridgeModeRef.current = config.lxpack?.bridge ?? "auto";
   const progressRef = useRef(createProgressController());
   const [progress, setProgress] = useState(() => progressRef.current.getState());
   const syncProgress = useCallback(() => {
@@ -235,6 +299,53 @@ function LessonkitProvider(props) {
   }, []);
   const activeLessonIdRef = useRef(progress.activeLessonId);
   activeLessonIdRef.current = progress.activeLessonId;
+  const xapiQueueRef = useRef(createInMemoryXAPIQueue());
+  const xapiRef = useRef(null);
+  const [xapi, setXapi] = useState(null);
+  const xapiEnabled = config.xapi?.enabled;
+  const xapiClient = config.xapi?.client;
+  const xapiTransport = config.xapi?.transport;
+  const courseId = config.courseId;
+  useIsoLayoutEffect(() => {
+    const prev = xapiRef.current;
+    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 = telemetryEventToXAPIStatement2(
+            buildTrackEvent({
+              name: "course_started",
+              courseId: cid,
+              sessionId,
+              attemptId: attemptIdRef.current,
+              user: userRef.current
+            })
+          );
+          if (statement) next.send(statement);
+        } catch {
+        }
+      }
+    }
+    void (async () => {
+      if (prev) {
+        try {
+          await prev.flush();
+        } catch {
+        }
+      }
+      try {
+        await next?.flush();
+      } catch {
+      }
+    })();
+    return () => {
+      void prev?.flush();
+    };
+  }, [xapiEnabled, xapiClient, xapiTransport, courseId]);
   const trackingRef = useRef(createTrackingClient());
   const [tracking, setTracking] = useState(() => trackingRef.current);
   const trackingEnabled = config.tracking?.enabled;
@@ -261,7 +372,8 @@ function LessonkitProvider(props) {
           sessionId,
           attemptId: attemptIdRef.current,
           user: userRef.current
-        })
+        }),
+        { lxpackBridge: lxpackBridgeModeRef.current }
       );
     }
     return () => {
@@ -275,37 +387,17 @@ function LessonkitProvider(props) {
     batchFlushIntervalMs,
     batchMaxBatchSize
   ]);
-  const xapiQueueRef = useRef(createInMemoryXAPIQueue());
-  const xapiRef = useRef(null);
-  const [xapi, setXapi] = useState(null);
-  const xapiEnabled = config.xapi?.enabled;
-  const xapiClient = config.xapi?.client;
-  const xapiTransport = config.xapi?.transport;
-  const courseId = config.courseId;
-  useIsoLayoutEffect(() => {
-    const prev = xapiRef.current;
-    const next = createXapiClientFromConfig(config, xapiQueueRef.current);
-    xapiRef.current = next;
-    setXapi(next);
-    void (async () => {
-      if (prev) {
-        try {
-          await prev.flush();
-        } catch {
-        }
-      }
-      try {
-        await next?.flush();
-      } catch {
-      }
-    })();
-    return () => {
-      void prev?.flush();
-    };
-  }, [xapiEnabled, xapiClient, xapiTransport, courseId]);
+  const emitWithBridge = useCallback(
+    (trackingClient, event) => {
+      emitTelemetry(trackingClient, xapiRef.current, event, {
+        lxpackBridge: lxpackBridgeModeRef.current
+      });
+    },
+    []
+  );
   const track = useCallback(
     (name, data, opts) => {
-      const event = buildTrackEvent({
+      const event = tryBuildTrackEvent({
         name,
         courseId: courseIdRef.current,
         lessonId: opts?.lessonId ?? activeLessonIdRef.current,
@@ -314,10 +406,35 @@ function LessonkitProvider(props) {
         user: userRef.current,
         data
       });
-      emitTelemetry(trackingRef.current, xapiRef.current, event);
+      if (!event) return;
+      emitWithBridge(trackingRef.current, event);
     },
-    []
+    [emitWithBridge]
   );
+  const prevCourseIdRef = useRef(config.courseId);
+  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]);
   useEffect(() => {
     return () => {
       trackingRef.current?.flush?.();
@@ -365,6 +482,9 @@ function LessonkitProvider(props) {
     syncProgress();
     track("course_completed");
   }, [track, syncProgress]);
+  const sessionUser = config.session?.user;
+  const sessionAttemptId = config.session?.attemptId;
+  const sessionConfiguredId = config.session?.sessionId;
   const runtime = useMemo(
     () => ({
       config,
@@ -377,7 +497,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__ */ jsx(LessonkitContext.Provider, { value: runtime, children: props.children });
 }
@@ -531,7 +663,7 @@ function Quiz(props) {
               });
               if (correct && !completedRef.current) {
                 completedRef.current = true;
-                quiz.complete({ checkId: props.checkId, score: 1, maxScore: 1 });
+                quiz.complete({ checkId: props.checkId, score: 1, maxScore: 1, passingScore: 1 });
               }
             }
           }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lessonkit/react",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "private": false,
   "description": "React components and hooks for building learning experiences with LessonKit.",
   "license": "Apache-2.0",
@@ -37,8 +37,8 @@
     "dist"
   ],
   "scripts": {
-    "build": "tsup src/index.tsx --format esm,cjs --dts --external react --external react-dom --external @lessonkit/accessibility --external @lessonkit/themes",
-    "dev": "tsup src/index.tsx --format esm,cjs --dts --watch --external react --external react-dom --external @lessonkit/accessibility --external @lessonkit/themes",
+    "build": "tsup src/index.tsx --format esm,cjs --dts --external react --external react-dom --external @lessonkit/accessibility --external @lessonkit/lxpack --external @lessonkit/themes",
+    "dev": "tsup src/index.tsx --format esm,cjs --dts --watch --external react --external react-dom --external @lessonkit/accessibility --external @lessonkit/lxpack --external @lessonkit/themes",
     "prepublishOnly": "npm run build",
     "typecheck": "tsc -p tsconfig.json",
     "test": "vitest run --passWithNoTests",
@@ -50,10 +50,11 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "@lessonkit/accessibility": "0.5.0",
-    "@lessonkit/core": "0.5.0",
-    "@lessonkit/themes": "0.5.0",
-    "@lessonkit/xapi": "0.5.0"
+    "@lessonkit/accessibility": "0.6.0",
+    "@lessonkit/core": "0.6.0",
+    "@lessonkit/lxpack": "0.6.0",
+    "@lessonkit/themes": "0.6.0",
+    "@lessonkit/xapi": "0.6.0"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",