@cuemath/leap 3.1.17 → 3.1.19-as1

package/dist/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.js

@@ -1,8 +1,8 @@
-import { useCallback as a, useRef as C, useEffect as T } from "react";
-import { CircleSoundKeyMapper as A, SWIPE_SOUND_ORDER as E } from "./constants.js";
+import { useCallback as s, useRef as C, useEffect as A } from "react";
+import { CircleSoundKeyMapper as O, SWIPE_SOUND_ORDER as S } from "./constants.js";
 import { CircleSoundKey as e } from "./use-circle-sounds-enums.js";
-let I = 0;
-const r = {
+let d = 0;
+const o = {
   [e.BACKGROUND]: null,
   [e.BACKGROUND_RUSHHOUR]: null,
   [e.TUTORIAL]: null,
@@ -26,93 +26,98 @@ const r = {
   [e.TIME_INTRO]: null,
   [e.TIME_TARGET]: null,
   [e.METER_FILL]: null
-}, f = {}, D = () => {
-  const c = a((n) => {
-    if (!r[n]) {
-      const l = new Audio(A[n]);
-      r[n] = l;
+}, I = {}, G = () => {
+  const c = s((n) => {
+    if (!o[n]) {
+      const l = new Audio(O[n]);
+      o[n] = l;
     }
-  }, []), v = C(/* @__PURE__ */ new Set()), o = C({}), p = a(() => {
-    document.visibilityState === "hidden" ? Object.keys(r).forEach((n) => {
-      const l = r[n];
-      l && !l.paused && (l.pause(), v.current.add(n));
-    }) : document.visibilityState === "visible" && (v.current.forEach((n) => {
-      const l = r[n];
+  }, []), f = C(/* @__PURE__ */ new Set()), r = C({}), p = s(() => {
+    document.visibilityState === "hidden" ? Object.keys(o).forEach((n) => {
+      const l = o[n];
+      l && !l.paused && (l.pause(), f.current.add(n));
+    }) : document.visibilityState === "visible" && (f.current.forEach((n) => {
+      const l = o[n];
       l == null || l.play();
-    }), v.current.clear());
+    }), f.current.clear());
   }, []);
-  T(() => {
+  A(() => {
     document.addEventListener("visibilitychange", p);
-    const n = o.current;
+    const n = r.current;
     return () => {
       document.removeEventListener("visibilitychange", p);
       for (const l of Object.values(n))
         l != null && clearInterval(l);
     };
   }, [p]);
-  const S = a(() => {
+  const _ = s(() => {
     var l;
-    E.forEach((u) => {
+    S.forEach((u) => {
       c(u);
     });
-    const n = E[I] || e.SWIPE_01;
-    I < E.length - 1 ? I++ : I = 0, (l = r[n]) == null || l.play();
-  }, [c]), m = a(() => {
+    const n = S[d] || e.SWIPE_01;
+    d < S.length - 1 ? d++ : d = 0, (l = o[n]) == null || l.play();
+  }, [c]), m = s(() => {
     var l;
-    return c(e.TOGGLE), (l = r[e.TOGGLE]) == null ? void 0 : l.play();
-  }, [c]), _ = a(
+    return c(e.TOGGLE), (l = o[e.TOGGLE]) == null ? void 0 : l.play();
+  }, [c]), R = s(
     (n, l = !0, u = !1) => {
       c(n);
-      const t = r[n];
+      const t = o[n];
       if (!t) return;
-      if (o.current[n] && clearInterval(o.current[n]), !t.paused && t.currentTime > 0 && !t.ended)
+      if (r.current[n] && clearInterval(r.current[n]), !t.paused && t.currentTime > 0 && !t.ended)
         return t;
       if (t.loop = u, l) {
         t.volume = 1;
-        const d = t.play();
-        f[n] = d;
+        const i = t.play();
+        i && (I[n] = i);
         return;
       }
       t.volume = 0;
-      const s = t.play();
-      f[n] = s;
-      const i = setInterval(() => {
+      const a = t.play();
+      I[n] = a;
+      const E = setInterval(() => {
         if (!t) {
-          clearInterval(i);
+          clearInterval(E);
           return;
         }
-        const d = t.volume || 0;
-        d < 1 ? t.volume = Math.min(d + 0.1, 1) : clearInterval(i);
+        const i = t.volume || 0;
+        i < 1 ? t.volume = Math.min(i + 0.1, 1) : clearInterval(E);
       }, 100);
-      return o.current[n] = i, t;
+      return r.current[n] = E, t;
     },
     [c]
-  ), R = a((n, l = !0) => {
-    var t;
-    const u = r[n];
-    f[n] !== void 0 && ((t = f[n]) == null || t.then(() => {
-      if (!u) return;
-      if (o.current[n] && clearInterval(o.current[n]), l) {
-        u.pause();
+  ), v = s((n, l) => {
+    const u = o[n];
+    if (!u) return;
+    if (r.current[n] && clearInterval(r.current[n]), l) {
+      u.pause();
+      return;
+    }
+    let t = u.volume || 0;
+    const a = setInterval(() => {
+      t - 0.1 <= 0 ? (u.volume = 0, u.pause(), clearInterval(a)) : (t = t - 0.1, u.volume = t);
+    }, 100);
+    r.current[n] = a;
+  }, []), T = s(
+    (n, l = !0) => {
+      var u;
+      if (I[n] !== void 0) {
+        (u = I[n]) == null || u.then(() => {
+          v(n, l);
+        }).catch((t) => {
+          console.log("sound not playing", t);
+        });
         return;
       }
-      const s = setInterval(() => {
-        if (!u) {
-          clearInterval(s);
-          return;
-        }
-        const i = u.volume || 0;
-        i - 0.1 <= 0 ? (u.volume = 0, u.pause(), clearInterval(s)) : u.volume = i - 0.1;
-      }, 100);
-      o.current[n] = s;
-    }).catch((s) => {
-      console.log("sound not playing", s);
-    }));
-  }, []);
-  return { playSwipSound: S, play: _, stop: R, playButtonSound: m };
+      v(n, l);
+    },
+    [v]
+  );
+  return { playSwipSound: _, play: R, stop: T, playButtonSound: m };
 };
 export {
-  r as soundMapper,
-  D as useCircleSounds
+  o as soundMapper,
+  G as useCircleSounds
 };
 //# sourceMappingURL=use-circle-sounds.js.map

package/dist/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-circle-sounds.js","sources":["../../../../../src/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.ts"],"sourcesContent":["import type { TimeoutMap } from './use-circle-sound-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { CircleSoundKeyMapper, SWIPE_SOUND_ORDER } from './constants';\nimport { CircleSoundKey } from './use-circle-sounds-enums';\n\nlet swipeSoundIndex = 0;\n\nexport const soundMapper: Record<keyof typeof CircleSoundKeyMapper, null | HTMLAudioElement> = {\n  [CircleSoundKey.BACKGROUND]: null,\n  [CircleSoundKey.BACKGROUND_RUSHHOUR]: null,\n  [CircleSoundKey.TUTORIAL]: null,\n  [CircleSoundKey.SWIPE_01]: null,\n  [CircleSoundKey.SWIPE_02]: null,\n  [CircleSoundKey.SWIPE_03]: null,\n  [CircleSoundKey.SWIPE_04]: null,\n  [CircleSoundKey.SWIPE_DOWN]: null,\n  [CircleSoundKey.TOGGLE]: null,\n  [CircleSoundKey.POINTS_AWARDED]: null,\n  [CircleSoundKey.POINTS_ADDED]: null,\n  [CircleSoundKey.GAME_CARD_CLICK]: null,\n  [CircleSoundKey.CLOCK_IN]: null,\n  [CircleSoundKey.CLOCK_OUT]: null,\n  [CircleSoundKey.ACCURACY_IN]: null,\n  [CircleSoundKey.ACCURACY_OUT]: null,\n  [CircleSoundKey.STREAK_IN]: null,\n  [CircleSoundKey.STREAK_OUT]: null,\n  [CircleSoundKey.ACCURACY_INTRO]: null,\n  [CircleSoundKey.ACCURACY_TARGET]: null,\n  [CircleSoundKey.TIME_INTRO]: null,\n  [CircleSoundKey.TIME_TARGET]: null,\n  [CircleSoundKey.METER_FILL]: null,\n};\n\nconst soundInstancePromise: Partial<Record<keyof typeof CircleSoundKeyMapper, Promise<void>>> = {};\n\nexport const useCircleSounds = () => {\n  const loadSound = useCallback((key: CircleSoundKey) => {\n    if (!soundMapper[key]) {\n      const loadedSound = new Audio(CircleSoundKeyMapper[key]);\n\n      soundMapper[key] = loadedSound;\n    }\n  }, []);\n\n  const pausedSoundsRef = useRef<Set<CircleSoundKey>>(new Set());\n  const timeoutRefs = useRef<TimeoutMap>({});\n\n  const handleVisibilityChange = useCallback(() => {\n    if (document.visibilityState === 'hidden') {\n      (Object.keys(soundMapper) as CircleSoundKey[]).forEach(key => {\n        const sound = soundMapper[key];\n\n        if (sound && !sound.paused) {\n          sound.pause();\n          pausedSoundsRef.current.add(key);\n        }\n      });\n    } else if (document.visibilityState === 'visible') {\n      pausedSoundsRef.current.forEach(key => {\n        const sound = soundMapper[key];\n\n        sound?.play();\n      });\n      pausedSoundsRef.current.clear();\n    }\n  }, []);\n\n  useEffect(() => {\n    document.addEventListener('visibilitychange', handleVisibilityChange);\n    const timeouts = timeoutRefs.current;\n\n    return () => {\n      document.removeEventListener('visibilitychange', handleVisibilityChange);\n      for (const id of Object.values(timeouts)) {\n        if (id != null) clearInterval(id);\n      }\n    };\n  }, [handleVisibilityChange]);\n\n  const playSwipSound = useCallback(() => {\n    SWIPE_SOUND_ORDER.forEach(key => {\n      loadSound(key);\n    });\n\n    const key = SWIPE_SOUND_ORDER[swipeSoundIndex] || CircleSoundKey.SWIPE_01;\n\n    if (swipeSoundIndex < SWIPE_SOUND_ORDER.length - 1) {\n      swipeSoundIndex++;\n    } else {\n      swipeSoundIndex = 0;\n    }\n    soundMapper[key]?.play();\n  }, [loadSound]);\n\n  const playButtonSound = useCallback(() => {\n    loadSound(CircleSoundKey.TOGGLE);\n    const sound = soundMapper[CircleSoundKey.TOGGLE]?.play();\n\n    return sound;\n  }, [loadSound]);\n\n  const play = useCallback(\n    (key: CircleSoundKey, immediately: boolean = true, loop = false) => {\n      loadSound(key);\n      const soundInstance = soundMapper[key];\n\n      if (!soundInstance) return;\n\n      if (timeoutRefs.current[key]) {\n        clearInterval(timeoutRefs.current[key]);\n      }\n\n      if (!soundInstance.paused && soundInstance.currentTime > 0 && !soundInstance.ended) {\n        return soundInstance;\n      }\n\n      soundInstance.loop = loop;\n      if (immediately) {\n        soundInstance.volume = 1;\n        const promise = soundInstance.play();\n\n        soundInstancePromise[key] = promise;\n\n        return;\n      }\n\n      soundInstance.volume = 0;\n      const promise = soundInstance.play();\n\n      soundInstancePromise[key] = promise;\n\n      const intervalId = setInterval(() => {\n        if (!soundInstance) {\n          clearInterval(intervalId);\n\n          return;\n        }\n\n        const vol = soundInstance.volume || 0;\n\n        if (vol < 1) {\n          soundInstance.volume = Math.min(vol + 0.1, 1);\n        } else {\n          clearInterval(intervalId);\n        }\n      }, 100);\n\n      timeoutRefs.current[key] = intervalId;\n\n      return soundInstance;\n    },\n    [loadSound],\n  );\n\n  const stop = useCallback((key: CircleSoundKey, immediately: boolean = true) => {\n    const soundInstance = soundMapper[key];\n\n    if (soundInstancePromise[key] !== undefined) {\n      soundInstancePromise[key]\n        ?.then(() => {\n          if (!soundInstance) return;\n\n          if (timeoutRefs.current[key]) {\n            clearInterval(timeoutRefs.current[key]);\n          }\n\n          if (immediately) {\n            soundInstance.pause();\n\n            return;\n          }\n\n          const intervalId = setInterval(() => {\n            if (!soundInstance) {\n              clearInterval(intervalId);\n\n              return;\n            }\n\n            const vol = soundInstance.volume || 0;\n\n            if (vol - 0.1 <= 0) {\n              soundInstance.volume = 0;\n              soundInstance.pause();\n              clearInterval(intervalId);\n            } else {\n              soundInstance.volume = vol - 0.1;\n            }\n          }, 100);\n\n          timeoutRefs.current[key] = intervalId;\n        })\n        .catch(err => {\n          // eslint-disable-next-line no-console\n          console.log('sound not playing', err);\n        });\n    }\n  }, []);\n\n  return { playSwipSound, play, stop, playButtonSound };\n};\n"],"names":["swipeSoundIndex","soundMapper","CircleSoundKey","soundInstancePromise","useCircleSounds","loadSound","useCallback","key","loadedSound","CircleSoundKeyMapper","pausedSoundsRef","useRef","timeoutRefs","handleVisibilityChange","sound","useEffect","timeouts","id","playSwipSound","SWIPE_SOUND_ORDER","_a","playButtonSound","play","immediately","loop","soundInstance","promise","intervalId","vol","stop","err"],"mappings":"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"}
+{"version":3,"file":"use-circle-sounds.js","sources":["../../../../../src/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.ts"],"sourcesContent":["import type { TimeoutMap } from './use-circle-sound-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { CircleSoundKeyMapper, SWIPE_SOUND_ORDER } from './constants';\nimport { CircleSoundKey } from './use-circle-sounds-enums';\n\nlet swipeSoundIndex = 0;\n\nexport const soundMapper: Record<keyof typeof CircleSoundKeyMapper, null | HTMLAudioElement> = {\n  [CircleSoundKey.BACKGROUND]: null,\n  [CircleSoundKey.BACKGROUND_RUSHHOUR]: null,\n  [CircleSoundKey.TUTORIAL]: null,\n  [CircleSoundKey.SWIPE_01]: null,\n  [CircleSoundKey.SWIPE_02]: null,\n  [CircleSoundKey.SWIPE_03]: null,\n  [CircleSoundKey.SWIPE_04]: null,\n  [CircleSoundKey.SWIPE_DOWN]: null,\n  [CircleSoundKey.TOGGLE]: null,\n  [CircleSoundKey.POINTS_AWARDED]: null,\n  [CircleSoundKey.POINTS_ADDED]: null,\n  [CircleSoundKey.GAME_CARD_CLICK]: null,\n  [CircleSoundKey.CLOCK_IN]: null,\n  [CircleSoundKey.CLOCK_OUT]: null,\n  [CircleSoundKey.ACCURACY_IN]: null,\n  [CircleSoundKey.ACCURACY_OUT]: null,\n  [CircleSoundKey.STREAK_IN]: null,\n  [CircleSoundKey.STREAK_OUT]: null,\n  [CircleSoundKey.ACCURACY_INTRO]: null,\n  [CircleSoundKey.ACCURACY_TARGET]: null,\n  [CircleSoundKey.TIME_INTRO]: null,\n  [CircleSoundKey.TIME_TARGET]: null,\n  [CircleSoundKey.METER_FILL]: null,\n};\n\nconst soundInstancePromise: Partial<Record<keyof typeof CircleSoundKeyMapper, Promise<void>>> = {};\n\nexport const useCircleSounds = () => {\n  const loadSound = useCallback((key: CircleSoundKey) => {\n    if (!soundMapper[key]) {\n      const loadedSound = new Audio(CircleSoundKeyMapper[key]);\n\n      soundMapper[key] = loadedSound;\n    }\n  }, []);\n\n  const pausedSoundsRef = useRef<Set<CircleSoundKey>>(new Set());\n  const timeoutRefs = useRef<TimeoutMap>({});\n\n  const handleVisibilityChange = useCallback(() => {\n    if (document.visibilityState === 'hidden') {\n      (Object.keys(soundMapper) as CircleSoundKey[]).forEach(key => {\n        const sound = soundMapper[key];\n\n        if (sound && !sound.paused) {\n          sound.pause();\n          pausedSoundsRef.current.add(key);\n        }\n      });\n    } else if (document.visibilityState === 'visible') {\n      pausedSoundsRef.current.forEach(key => {\n        const sound = soundMapper[key];\n\n        sound?.play();\n      });\n      pausedSoundsRef.current.clear();\n    }\n  }, []);\n\n  useEffect(() => {\n    document.addEventListener('visibilitychange', handleVisibilityChange);\n    const timeouts = timeoutRefs.current;\n\n    return () => {\n      document.removeEventListener('visibilitychange', handleVisibilityChange);\n      for (const id of Object.values(timeouts)) {\n        if (id != null) clearInterval(id);\n      }\n    };\n  }, [handleVisibilityChange]);\n\n  const playSwipSound = useCallback(() => {\n    SWIPE_SOUND_ORDER.forEach(key => {\n      loadSound(key);\n    });\n\n    const key = SWIPE_SOUND_ORDER[swipeSoundIndex] || CircleSoundKey.SWIPE_01;\n\n    if (swipeSoundIndex < SWIPE_SOUND_ORDER.length - 1) {\n      swipeSoundIndex++;\n    } else {\n      swipeSoundIndex = 0;\n    }\n    soundMapper[key]?.play();\n  }, [loadSound]);\n\n  const playButtonSound = useCallback(() => {\n    loadSound(CircleSoundKey.TOGGLE);\n    const sound = soundMapper[CircleSoundKey.TOGGLE]?.play();\n\n    return sound;\n  }, [loadSound]);\n\n  const play = useCallback(\n    (key: CircleSoundKey, immediately: boolean = true, loop = false) => {\n      loadSound(key);\n      const soundInstance = soundMapper[key];\n\n      if (!soundInstance) return;\n\n      if (timeoutRefs.current[key]) {\n        clearInterval(timeoutRefs.current[key]);\n      }\n\n      if (!soundInstance.paused && soundInstance.currentTime > 0 && !soundInstance.ended) {\n        return soundInstance;\n      }\n\n      soundInstance.loop = loop;\n      if (immediately) {\n        soundInstance.volume = 1;\n        const promise = soundInstance.play();\n\n        if (promise) {\n          soundInstancePromise[key] = promise;\n        }\n\n        return;\n      }\n\n      soundInstance.volume = 0;\n      const promise = soundInstance.play();\n\n      soundInstancePromise[key] = promise;\n\n      const intervalId = setInterval(() => {\n        if (!soundInstance) {\n          clearInterval(intervalId);\n\n          return;\n        }\n\n        const vol = soundInstance.volume || 0;\n\n        if (vol < 1) {\n          soundInstance.volume = Math.min(vol + 0.1, 1);\n        } else {\n          clearInterval(intervalId);\n        }\n      }, 100);\n\n      timeoutRefs.current[key] = intervalId;\n\n      return soundInstance;\n    },\n    [loadSound],\n  );\n\n  const handleSoundStop = useCallback((key: CircleSoundKey, immediately: boolean) => {\n    const soundInstance = soundMapper[key];\n\n    if (!soundInstance) return;\n\n    if (timeoutRefs.current[key]) {\n      clearInterval(timeoutRefs.current[key]);\n    }\n\n    if (immediately) {\n      soundInstance.pause();\n\n      return;\n    }\n\n    let vol = soundInstance.volume || 0;\n    const intervalId = setInterval(() => {\n      if (vol - 0.1 <= 0) {\n        soundInstance.volume = 0;\n        soundInstance.pause();\n        clearInterval(intervalId);\n      } else {\n        vol = vol - 0.1;\n        soundInstance.volume = vol;\n      }\n    }, 100);\n\n    timeoutRefs.current[key] = intervalId;\n  }, []);\n\n  const stop = useCallback(\n    (key: CircleSoundKey, immediately: boolean = true) => {\n      // if play returned a promise\n      if (soundInstancePromise[key] !== undefined) {\n        soundInstancePromise[key]\n          ?.then(() => {\n            handleSoundStop(key, immediately);\n          })\n          .catch(err => {\n            // eslint-disable-next-line no-console\n            console.log('sound not playing', err);\n          });\n\n        return;\n      }\n\n      handleSoundStop(key, immediately);\n    },\n    [handleSoundStop],\n  );\n\n  return { playSwipSound, play, stop, playButtonSound };\n};\n"],"names":["swipeSoundIndex","soundMapper","CircleSoundKey","soundInstancePromise","useCircleSounds","loadSound","useCallback","key","loadedSound","CircleSoundKeyMapper","pausedSoundsRef","useRef","timeoutRefs","handleVisibilityChange","sound","useEffect","timeouts","id","playSwipSound","SWIPE_SOUND_ORDER","_a","playButtonSound","play","immediately","loop","soundInstance","promise","intervalId","vol","handleSoundStop","stop","err"],"mappings":"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"}

package/dist/features/ui/modals/modal-provider.js

@@ -1,48 +1,51 @@
-import { jsxs as k, jsx as C } from "react/jsx-runtime";
-import { memo as E, useState as a, useCallback as M, useMemo as x, useEffect as u } from "react";
-import y from "./modal.js";
-import I from "./modal-context.js";
-import { lockScroll as S, unlockScroll as h } from "./modal-helpers.js";
-const D = 500, T = E(({ children: w, modals: d, isUserAuthenticated: t }) => {
-  const [o, c] = a(null), [f, v] = a(void 0), [s, r] = a(!1), m = M(
-    (n, l) => {
-      const i = d.find((P) => P.name === n);
-      if (!i)
-        throw new Error(`Modal with name "${n}" not found`);
-      if (i.isPrivate && !t)
+import { jsxs as x, jsx as y } from "react/jsx-runtime";
+import { memo as D, useState as d, useRef as I, useCallback as f, useMemo as S, useEffect as w } from "react";
+import b from "./modal.js";
+import h from "./modal-context.js";
+import { lockScroll as R, unlockScroll as T } from "./modal-helpers.js";
+const $ = 500, g = D(({ children: p, modals: u, isUserAuthenticated: t }) => {
+  const [o, M] = d(null), [m, C] = d(void 0), [r, i] = d(!1), l = I(void 0), v = f(
+    (e, s, P) => {
+      const c = u.find((E) => E.name === e);
+      if (!c)
+        throw new Error(`Modal with name "${e}" not found`);
+      if (c.isPrivate && !t)
         throw new Error(
-          `Access violation: Modal "${n}" is private and user is not authenticated`
+          `Access violation: Modal "${e}" is private and user is not authenticated`
         );
-      r(!1), c(i), v(l), S();
+      l.current = P, i(!1), M(c), C(s), R();
     },
-    [t, d]
-  ), e = M(() => {
-    r(!0), h(), setTimeout(() => {
-      c(null), r(!1);
-    }, D);
-  }, []), p = x(
+    [t, u]
+  ), n = f(() => {
+    i(!0), T(), setTimeout(() => {
+      M(null), i(!1);
+    }, $);
+  }, []), k = S(
     () => ({
       modal: o,
-      modalParams: f,
-      openModal: m,
-      closeModal: e,
-      isClosing: s
+      modalParams: m,
+      openModal: v,
+      closeModal: n,
+      isClosing: r
     }),
-    [o, f, m, e, s]
-  );
-  return u(() => {
-    !t && (o != null && o.isPrivate) && e();
-  }, [t, o, e]), u(() => {
-    const n = (l) => {
-      l.key === "Escape" && (o == null ? void 0 : o.isDismissable) !== !1 && !s && e();
+    [o, m, v, n, r]
+  ), a = f(() => {
+    var e, s;
+    (o == null ? void 0 : o.isDismissable) !== !1 && !r && (n(), l.current && ((s = (e = l.current).onCloseModal) == null || s.call(e), l.current.onCloseModal = void 0));
+  }, [o, n, r]);
+  return w(() => {
+    !t && (o != null && o.isPrivate) && n();
+  }, [t, o, n]), w(() => {
+    const e = (s) => {
+      s.key === "Escape" && a();
     };
-    return window.addEventListener("keydown", n), () => window.removeEventListener("keydown", n);
-  }, [o, e, s]), /* @__PURE__ */ k(I.Provider, { value: p, children: [
-    w,
-    o && /* @__PURE__ */ C(y, { modal: o, isClosing: s, onClose: e })
+    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+  }, [a]), /* @__PURE__ */ x(h.Provider, { value: k, children: [
+    p,
+    o && /* @__PURE__ */ y(b, { modal: o, isClosing: r, onClose: a })
   ] });
-}), O = T;
+}), K = g;
 export {
-  O as default
+  K as default
 };
 //# sourceMappingURL=modal-provider.js.map

package/dist/features/ui/modals/modal-provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-provider.js","sources":["../../../../src/features/ui/modals/modal-provider.tsx"],"sourcesContent":["import type { IModal, IModalContext, IModalProviderProps } from './modal-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport Modal from './modal';\nimport ModalContext from './modal-context';\nimport { lockScroll, unlockScroll } from './modal-helpers';\n\nconst ANIMATION_DURATION_MS = 500; // Match the animation duration in modal.tsx\n\n/**\n * Provider component that manages modal state and provides modal context to child components\n */\nconst ModalProvider: FC<IModalProviderProps> = memo(({ children, modals, isUserAuthenticated }) => {\n  const [modal, setModal] = useState<IModal | null>(null);\n  const [modalParams, setModalParams] = useState<Record<string, unknown> | undefined>(undefined);\n  const [isClosing, setIsClosing] = useState(false);\n\n  /**\n   * Opens a modal by name with optional parameters\n   * Handles authentication check for private modals\n   */\n  const openModal = useCallback<IModalContext['openModal']>(\n    (modalName, newModalParams) => {\n      const newModal = modals.find(m => m.name === modalName);\n\n      if (!newModal) {\n        throw new Error(`Modal with name \"${modalName}\" not found`);\n      }\n\n      if (newModal.isPrivate && !isUserAuthenticated) {\n        throw new Error(\n          `Access violation: Modal \"${modalName}\" is private and user is not authenticated`,\n        );\n      }\n\n      setIsClosing(false);\n      setModal(newModal);\n      setModalParams(newModalParams as unknown as Record<string, unknown> | undefined);\n      lockScroll(); // Lock scroll while preserving scrollbar width\n    },\n    [isUserAuthenticated, modals],\n  );\n\n  const closeModal = useCallback(() => {\n    setIsClosing(true);\n    // Wait for the animation to complete before removing the modal\n    unlockScroll();\n    setTimeout(() => {\n      setModal(null);\n      setIsClosing(false);\n    }, ANIMATION_DURATION_MS);\n  }, []);\n\n  const modalContent = useMemo<IModalContext>(\n    () => ({\n      modal,\n      modalParams,\n      openModal,\n      closeModal,\n      isClosing,\n    }),\n    [modal, modalParams, openModal, closeModal, isClosing],\n  );\n\n  useEffect(() => {\n    if (!isUserAuthenticated && modal?.isPrivate) {\n      // If the modal is private and user is not authenticated, close it\n      closeModal();\n    }\n  }, [isUserAuthenticated, modal, closeModal]);\n\n  // Handle ESC key\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape' && modal?.isDismissable !== false && !isClosing) {\n        closeModal();\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyDown);\n\n    return () => window.removeEventListener('keydown', handleKeyDown);\n  }, [modal, closeModal, isClosing]);\n\n  return (\n    <ModalContext.Provider value={modalContent}>\n      {children}\n      {modal && <Modal modal={modal} isClosing={isClosing} onClose={closeModal} />}\n    </ModalContext.Provider>\n  );\n});\n\nexport default ModalProvider;\n"],"names":["ANIMATION_DURATION_MS","ModalProvider","memo","children","modals","isUserAuthenticated","modal","setModal","useState","modalParams","setModalParams","isClosing","setIsClosing","openModal","useCallback","modalName","newModalParams","newModal","m","lockScroll","closeModal","unlockScroll","modalContent","useMemo","useEffect","handleKeyDown","e","jsxs","ModalContext","jsx","Modal","ModalProvider$1"],"mappings":";;;;;AASA,MAAMA,IAAwB,KAKxBC,IAAyCC,EAAK,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,qBAAAC,QAA0B;AACjG,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAwB,IAAI,GAChD,CAACC,GAAaC,CAAc,IAAIF,EAA8C,MAAS,GACvF,CAACG,GAAWC,CAAY,IAAIJ,EAAS,EAAK,GAM1CK,IAAYC;AAAA,IAChB,CAACC,GAAWC,MAAmB;AAC7B,YAAMC,IAAWb,EAAO,KAAK,CAAKc,MAAAA,EAAE,SAASH,CAAS;AAEtD,UAAI,CAACE;AACH,cAAM,IAAI,MAAM,oBAAoBF,CAAS,aAAa;AAGxD,UAAAE,EAAS,aAAa,CAACZ;AACzB,cAAM,IAAI;AAAA,UACR,4BAA4BU,CAAS;AAAA,QAAA;AAIzC,MAAAH,EAAa,EAAK,GAClBL,EAASU,CAAQ,GACjBP,EAAeM,CAAgE,GACpEG;IACb;AAAA,IACA,CAACd,GAAqBD,CAAM;AAAA,EAAA,GAGxBgB,IAAaN,EAAY,MAAM;AACnC,IAAAF,EAAa,EAAI,GAEJS,KACb,WAAW,MAAM;AACf,MAAAd,EAAS,IAAI,GACbK,EAAa,EAAK;AAAA,OACjBZ,CAAqB;AAAA,EAC1B,GAAG,CAAE,CAAA,GAECsB,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,OAAAjB;AAAA,MACA,aAAAG;AAAA,MACA,WAAAI;AAAA,MACA,YAAAO;AAAA,MACA,WAAAT;AAAA,IAAA;AAAA,IAEF,CAACL,GAAOG,GAAaI,GAAWO,GAAYT,CAAS;AAAA,EAAA;AAGvD,SAAAa,EAAU,MAAM;AACV,IAAA,CAACnB,MAAuBC,KAAA,QAAAA,EAAO,cAEtBc;EAEZ,GAAA,CAACf,GAAqBC,GAAOc,CAAU,CAAC,GAG3CI,EAAU,MAAM;AACR,UAAAC,IAAgB,CAACC,MAAqB;AAC1C,MAAIA,EAAE,QAAQ,aAAYpB,KAAA,gBAAAA,EAAO,mBAAkB,MAAS,CAACK,KAChDS;IACb;AAGK,kBAAA,iBAAiB,WAAWK,CAAa,GAEzC,MAAM,OAAO,oBAAoB,WAAWA,CAAa;AAAA,EAC/D,GAAA,CAACnB,GAAOc,GAAYT,CAAS,CAAC,GAG9B,gBAAAgB,EAAAC,EAAa,UAAb,EAAsB,OAAON,GAC3B,UAAA;AAAA,IAAAnB;AAAA,IACAG,KAAU,gBAAAuB,EAAAC,GAAA,EAAM,OAAAxB,GAAc,WAAAK,GAAsB,SAASS,GAAY;AAAA,EAC5E,EAAA,CAAA;AAEJ,CAAC,GAEDW,IAAe9B;"}
+{"version":3,"file":"modal-provider.js","sources":["../../../../src/features/ui/modals/modal-provider.tsx"],"sourcesContent":["import type { IModal, IModalCallbacks, IModalContext, IModalProviderProps } from './modal-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport Modal from './modal';\nimport ModalContext from './modal-context';\nimport { lockScroll, unlockScroll } from './modal-helpers';\n\nconst ANIMATION_DURATION_MS = 500; // Match the animation duration in modal.tsx\n\n/**\n * Provider component that manages modal state and provides modal context to child components\n */\nconst ModalProvider: FC<IModalProviderProps> = memo(({ children, modals, isUserAuthenticated }) => {\n  const [modal, setModal] = useState<IModal | null>(null);\n  const [modalParams, setModalParams] = useState<Record<string, unknown> | undefined>(undefined);\n  const [isClosing, setIsClosing] = useState(false);\n  const callbackRefs = useRef<IModalCallbacks | undefined>(undefined);\n  /**\n   * Opens a modal by name with optional parameters\n   * Handles authentication check for private modals\n   */\n  const openModal = useCallback<IModalContext['openModal']>(\n    (modalName, newModalParams, callback) => {\n      const newModal = modals.find(m => m.name === modalName);\n\n      if (!newModal) {\n        throw new Error(`Modal with name \"${modalName}\" not found`);\n      }\n\n      if (newModal.isPrivate && !isUserAuthenticated) {\n        throw new Error(\n          `Access violation: Modal \"${modalName}\" is private and user is not authenticated`,\n        );\n      }\n\n      callbackRefs.current = callback;\n      setIsClosing(false);\n      setModal(newModal);\n      setModalParams(newModalParams as unknown as Record<string, unknown> | undefined);\n      lockScroll(); // Lock scroll while preserving scrollbar width\n    },\n    [isUserAuthenticated, modals],\n  );\n\n  const closeModal = useCallback(() => {\n    setIsClosing(true);\n    // Wait for the animation to complete before removing the modal\n    unlockScroll();\n    setTimeout(() => {\n      setModal(null);\n      setIsClosing(false);\n    }, ANIMATION_DURATION_MS);\n  }, []);\n\n  const modalContent = useMemo<IModalContext>(\n    () => ({\n      modal,\n      modalParams,\n      openModal,\n      closeModal,\n      isClosing,\n    }),\n    [modal, modalParams, openModal, closeModal, isClosing],\n  );\n\n  const onModalDismiss = useCallback(() => {\n    if (modal?.isDismissable !== false && !isClosing) {\n      closeModal();\n      if (callbackRefs.current) {\n        callbackRefs.current.onCloseModal?.();\n        callbackRefs.current.onCloseModal = undefined; // Clear callback reference\n      }\n    }\n  }, [modal, closeModal, isClosing]);\n\n  useEffect(() => {\n    if (!isUserAuthenticated && modal?.isPrivate) {\n      // If the modal is private and user is not authenticated, close it\n      closeModal();\n    }\n  }, [isUserAuthenticated, modal, closeModal]);\n\n  // Handle ESC key\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        onModalDismiss();\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyDown);\n\n    return () => window.removeEventListener('keydown', handleKeyDown);\n  }, [onModalDismiss]);\n\n  return (\n    <ModalContext.Provider value={modalContent}>\n      {children}\n      {modal && <Modal modal={modal} isClosing={isClosing} onClose={onModalDismiss} />}\n    </ModalContext.Provider>\n  );\n});\n\nexport default ModalProvider;\n"],"names":["ANIMATION_DURATION_MS","ModalProvider","memo","children","modals","isUserAuthenticated","modal","setModal","useState","modalParams","setModalParams","isClosing","setIsClosing","callbackRefs","useRef","openModal","useCallback","modalName","newModalParams","callback","newModal","m","lockScroll","closeModal","unlockScroll","modalContent","useMemo","onModalDismiss","_b","_a","useEffect","handleKeyDown","e","jsxs","ModalContext","jsx","Modal","ModalProvider$1"],"mappings":";;;;;AASA,MAAMA,IAAwB,KAKxBC,IAAyCC,EAAK,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,qBAAAC,QAA0B;AACjG,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAwB,IAAI,GAChD,CAACC,GAAaC,CAAc,IAAIF,EAA8C,MAAS,GACvF,CAACG,GAAWC,CAAY,IAAIJ,EAAS,EAAK,GAC1CK,IAAeC,EAAoC,MAAS,GAK5DC,IAAYC;AAAA,IAChB,CAACC,GAAWC,GAAgBC,MAAa;AACvC,YAAMC,IAAWhB,EAAO,KAAK,CAAKiB,MAAAA,EAAE,SAASJ,CAAS;AAEtD,UAAI,CAACG;AACH,cAAM,IAAI,MAAM,oBAAoBH,CAAS,aAAa;AAGxD,UAAAG,EAAS,aAAa,CAACf;AACzB,cAAM,IAAI;AAAA,UACR,4BAA4BY,CAAS;AAAA,QAAA;AAIzC,MAAAJ,EAAa,UAAUM,GACvBP,EAAa,EAAK,GAClBL,EAASa,CAAQ,GACjBV,EAAeQ,CAAgE,GACpEI;IACb;AAAA,IACA,CAACjB,GAAqBD,CAAM;AAAA,EAAA,GAGxBmB,IAAaP,EAAY,MAAM;AACnC,IAAAJ,EAAa,EAAI,GAEJY,KACb,WAAW,MAAM;AACf,MAAAjB,EAAS,IAAI,GACbK,EAAa,EAAK;AAAA,OACjBZ,CAAqB;AAAA,EAC1B,GAAG,CAAE,CAAA,GAECyB,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,OAAApB;AAAA,MACA,aAAAG;AAAA,MACA,WAAAM;AAAA,MACA,YAAAQ;AAAA,MACA,WAAAZ;AAAA,IAAA;AAAA,IAEF,CAACL,GAAOG,GAAaM,GAAWQ,GAAYZ,CAAS;AAAA,EAAA,GAGjDgB,IAAiBX,EAAY,MAAM;;AACvC,KAAIV,KAAA,gBAAAA,EAAO,mBAAkB,MAAS,CAACK,MAC1BY,KACPV,EAAa,aACfe,KAAAC,IAAAhB,EAAa,SAAQ,iBAArB,QAAAe,EAAA,KAAAC,IACAhB,EAAa,QAAQ,eAAe;AAAA,EAGvC,GAAA,CAACP,GAAOiB,GAAYZ,CAAS,CAAC;AAEjC,SAAAmB,EAAU,MAAM;AACV,IAAA,CAACzB,MAAuBC,KAAA,QAAAA,EAAO,cAEtBiB;EAEZ,GAAA,CAAClB,GAAqBC,GAAOiB,CAAU,CAAC,GAG3CO,EAAU,MAAM;AACR,UAAAC,IAAgB,CAACC,MAAqB;AACtC,MAAAA,EAAE,QAAQ,YACGL;IACjB;AAGK,kBAAA,iBAAiB,WAAWI,CAAa,GAEzC,MAAM,OAAO,oBAAoB,WAAWA,CAAa;AAAA,EAAA,GAC/D,CAACJ,CAAc,CAAC,GAGhB,gBAAAM,EAAAC,EAAa,UAAb,EAAsB,OAAOT,GAC3B,UAAA;AAAA,IAAAtB;AAAA,IACAG,KAAU,gBAAA6B,EAAAC,GAAA,EAAM,OAAA9B,GAAc,WAAAK,GAAsB,SAASgB,GAAgB;AAAA,EAChF,EAAA,CAAA;AAEJ,CAAC,GAEDU,IAAepC;"}

package/dist/features/ui/modals/modal-styled.js

@@ -1,6 +1,6 @@
 import o from "styled-components";
 const s = o.div(
-  ({ theme: { colors: a }, $isClosing: t }) => `
+  ({ theme: { colors: a, zIndex: t }, $isClosing: i }) => `
   position: fixed;
   top: 0;
   left: 0;
@@ -9,8 +9,9 @@ const s = o.div(
   background-color: ${a.BLACK_T_60};
   backdrop-filter: blur(40px);
   display: flex;
-  animation: ${t ? "backdropFadeOut" : "backdropFadeIn"} 0.2s ease-out forwards;
-  
+  animation: ${i ? "backdropFadeOut" : "backdropFadeIn"} 0.2s ease-out forwards;
+  z-index: ${t.MODAL};
+
   @keyframes backdropFadeIn {
     from {
       opacity: 0;

package/dist/features/ui/modals/modal-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-styled.js","sources":["../../../../src/features/ui/modals/modal-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nconst ModalContainer = styled.div<{ $isClosing?: boolean }>(\n  ({ theme: { colors }, $isClosing }) => `\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: ${colors.BLACK_T_60};\n  backdrop-filter: blur(40px);\n  display: flex;\n  animation: ${$isClosing ? 'backdropFadeOut' : 'backdropFadeIn'} 0.2s ease-out forwards;\n  \n  @keyframes backdropFadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  \n  @keyframes backdropFadeOut {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n`,\n);\n\n/**\n * Base modal container with customizable width and animation state\n */\nconst BaseModal = styled.div<{\n  $isClosing?: boolean;\n  $width: string;\n}>(\n  ({ theme: { colors }, $isClosing, $width }) => `\n  position: relative;\n  align-self: center;\n  margin: 0 auto;\n  width: ${$width};\n  background-color: ${colors.WHITE_1};\n  border: 1px solid ${colors.BLACK_1};\n  transform-origin: center center;\n  animation: ${\n    $isClosing ? 'modalDisappear' : 'modalAppear'\n  } 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;\n  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.20);\n  \n  /* Responsive behavior for smaller screens */\n  @media (max-width: calc(${$width} + 80px)) {\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    border: none;\n  }\n  \n  @keyframes modalAppear {\n    0% {\n      opacity: 0;\n      transform: perspective(1200px) translateZ(-50px) translateY(10px) scale(0.98);\n    }\n    100% {\n      opacity: 1;\n      transform: perspective(1200px) translateZ(0) translateY(0) scale(1);\n    }\n  }\n  \n  @keyframes modalDisappear {\n    0% {\n      opacity: 1;\n      transform: perspective(1200px) translateZ(0) translateY(0) scale(1);\n    }\n    100% {\n      opacity: 0;\n      transform: perspective(1200px) translateZ(-50px) translateY(10px) scale(0.98);\n    }\n  }\n`,\n);\n\n/**\n * Scrollable content container inside the modal\n */\nconst BaseModalContent = styled.div<{ $modalWidth: string }>(\n  ({ $modalWidth }) => `\n  max-height: calc(100vh - 142px);\n  overflow-y: auto;\n\n  @media (max-width: calc(${$modalWidth} + 80px)) {\n    max-height: 100vh;\n  }\n}`,\n);\n\n/**\n * Container for the close button with responsive positioning\n */\nconst CloseButtonContainer = styled.div<{ $modalWidth: string }>(\n  ({ theme: { colors }, $modalWidth }) => `\n  position: absolute;\n  top: -56px;\n  right: -40px;\n  color: ${colors.WHITE_1};\n  transition: all 0.2s ease;\n  \n  &:hover {\n    transform: scale(1.05);\n  }\n\n  @media (max-width: calc(${$modalWidth} + 80px)) {\n    top: 16px;\n    right: 16px;\n    color: ${colors.BLACK_1};\n  }\n`,\n);\n\nconst spotlightWidth = 720;\nconst spotlightAnimationStartDuration = 800;\nconst spotlightAnimationEndDuration = 500;\n\nconst SpotlightModal = styled.div<{\n  $isClosing?: boolean;\n}>(\n  ({ $isClosing }) => `\n  position: absolute;\n  width: ${spotlightWidth}px;\n  height: 100%;\n  left: 50%;\n  margin-left: ${-(spotlightWidth / 2)}px;\n  clip-path: polygon(calc(50% - 100px) 0, calc(50% + 100px) 0, 100% 100%, 0 100%);\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 1) 0%,\n    rgba(0, 0, 0, 0) 100%\n  );\n  animation: openSpotlight;\n  animation-duration: ${spotlightAnimationStartDuration}ms;\n  animation-timing-function: linear;\n  animation-fill-mode: forwards;\n  opacity: 0;\n  ${\n    $isClosing\n      ? `\n      animation: closeSpotlight;\n      animation-duration: ${spotlightAnimationEndDuration}ms;\n      animation-timing-function: linear;\n      animation-fill-mode: forwards;\n      opacity: 1;\n    `\n      : ''\n  }\n\n  @keyframes openSpotlight {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n\n  @keyframes closeSpotlight {\n    from {\n      transform: rotateY(0);\n    }\n    to {\n      transform: rotateY(90deg);\n    }\n  }\n`,\n);\n\nexport { ModalContainer, BaseModal, BaseModalContent, CloseButtonContainer, SpotlightModal };\n"],"names":["ModalContainer","styled","colors","$isClosing","BaseModal","$width","BaseModalContent","$modalWidth","CloseButtonContainer","spotlightWidth","spotlightAnimationStartDuration","spotlightAnimationEndDuration","SpotlightModal"],"mappings":";AAEA,MAAMA,IAAiBC,EAAO;AAAA,EAC5B,CAAC,EAAE,OAAO,EAAE,QAAAC,EAAO,GAAG,YAAAC,EAAiB,MAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMnBD,EAAO,UAAU;AAAA;AAAA;AAAA,eAGxBC,IAAa,oBAAoB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBhE,GAKMC,IAAYH,EAAO;AAAA,EAIvB,CAAC,EAAE,OAAO,EAAE,QAAAC,EAAU,GAAA,YAAAC,GAAY,QAAAE,QAAa;AAAA;AAAA;AAAA;AAAA,WAItCA,CAAM;AAAA,sBACKH,EAAO,OAAO;AAAA,sBACdA,EAAO,OAAO;AAAA;AAAA,eAGhCC,IAAa,mBAAmB,aAClC;AAAA;AAAA;AAAA;AAAA,4BAI0BE,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8BlC,GAKMC,IAAmBL,EAAO;AAAA,EAC9B,CAAC,EAAE,aAAAM,EAAA,MAAkB;AAAA;AAAA;AAAA;AAAA,4BAIKA,CAAW;AAAA;AAAA;AAAA;AAIvC,GAKMC,IAAuBP,EAAO;AAAA,EAClC,CAAC,EAAE,OAAO,EAAE,QAAAC,EAAO,GAAG,aAAAK,EAAkB,MAAA;AAAA;AAAA;AAAA;AAAA,WAI/BL,EAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAOGK,CAAW;AAAA;AAAA;AAAA,aAG1BL,EAAO,OAAO;AAAA;AAAA;AAG3B,GAEMO,IAAiB,KACjBC,IAAkC,KAClCC,IAAgC,KAEhCC,IAAiBX,EAAO;AAAA,EAG5B,CAAC,EAAE,YAAAE,EAAA,MAAiB;AAAA;AAAA,WAEXM,CAAc;AAAA;AAAA;AAAA,iBAGR,EAAEA,IAAiB,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAQdC,CAA+B;AAAA;AAAA;AAAA;AAAA,IAKnDP,IACI;AAAA;AAAA,4BAEoBQ,CAA6B;AAAA;AAAA;AAAA;AAAA,QAKjD,EACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBF;"}
+{"version":3,"file":"modal-styled.js","sources":["../../../../src/features/ui/modals/modal-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nconst ModalContainer = styled.div<{ $isClosing?: boolean }>(\n  ({ theme: { colors, zIndex }, $isClosing }) => `\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: ${colors.BLACK_T_60};\n  backdrop-filter: blur(40px);\n  display: flex;\n  animation: ${$isClosing ? 'backdropFadeOut' : 'backdropFadeIn'} 0.2s ease-out forwards;\n  z-index: ${zIndex.MODAL};\n\n  @keyframes backdropFadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  \n  @keyframes backdropFadeOut {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n`,\n);\n\n/**\n * Base modal container with customizable width and animation state\n */\nconst BaseModal = styled.div<{\n  $isClosing?: boolean;\n  $width: string;\n}>(\n  ({ theme: { colors }, $isClosing, $width }) => `\n  position: relative;\n  align-self: center;\n  margin: 0 auto;\n  width: ${$width};\n  background-color: ${colors.WHITE_1};\n  border: 1px solid ${colors.BLACK_1};\n  transform-origin: center center;\n  animation: ${\n    $isClosing ? 'modalDisappear' : 'modalAppear'\n  } 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;\n  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.20);\n  \n  /* Responsive behavior for smaller screens */\n  @media (max-width: calc(${$width} + 80px)) {\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    border: none;\n  }\n  \n  @keyframes modalAppear {\n    0% {\n      opacity: 0;\n      transform: perspective(1200px) translateZ(-50px) translateY(10px) scale(0.98);\n    }\n    100% {\n      opacity: 1;\n      transform: perspective(1200px) translateZ(0) translateY(0) scale(1);\n    }\n  }\n  \n  @keyframes modalDisappear {\n    0% {\n      opacity: 1;\n      transform: perspective(1200px) translateZ(0) translateY(0) scale(1);\n    }\n    100% {\n      opacity: 0;\n      transform: perspective(1200px) translateZ(-50px) translateY(10px) scale(0.98);\n    }\n  }\n`,\n);\n\n/**\n * Scrollable content container inside the modal\n */\nconst BaseModalContent = styled.div<{ $modalWidth: string }>(\n  ({ $modalWidth }) => `\n  max-height: calc(100vh - 142px);\n  overflow-y: auto;\n\n  @media (max-width: calc(${$modalWidth} + 80px)) {\n    max-height: 100vh;\n  }\n}`,\n);\n\n/**\n * Container for the close button with responsive positioning\n */\nconst CloseButtonContainer = styled.div<{ $modalWidth: string }>(\n  ({ theme: { colors }, $modalWidth }) => `\n  position: absolute;\n  top: -56px;\n  right: -40px;\n  color: ${colors.WHITE_1};\n  transition: all 0.2s ease;\n  \n  &:hover {\n    transform: scale(1.05);\n  }\n\n  @media (max-width: calc(${$modalWidth} + 80px)) {\n    top: 16px;\n    right: 16px;\n    color: ${colors.BLACK_1};\n  }\n`,\n);\n\nconst spotlightWidth = 720;\nconst spotlightAnimationStartDuration = 800;\nconst spotlightAnimationEndDuration = 500;\n\nconst SpotlightModal = styled.div<{\n  $isClosing?: boolean;\n}>(\n  ({ $isClosing }) => `\n  position: absolute;\n  width: ${spotlightWidth}px;\n  height: 100%;\n  left: 50%;\n  margin-left: ${-(spotlightWidth / 2)}px;\n  clip-path: polygon(calc(50% - 100px) 0, calc(50% + 100px) 0, 100% 100%, 0 100%);\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 1) 0%,\n    rgba(0, 0, 0, 0) 100%\n  );\n  animation: openSpotlight;\n  animation-duration: ${spotlightAnimationStartDuration}ms;\n  animation-timing-function: linear;\n  animation-fill-mode: forwards;\n  opacity: 0;\n  ${\n    $isClosing\n      ? `\n      animation: closeSpotlight;\n      animation-duration: ${spotlightAnimationEndDuration}ms;\n      animation-timing-function: linear;\n      animation-fill-mode: forwards;\n      opacity: 1;\n    `\n      : ''\n  }\n\n  @keyframes openSpotlight {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n\n  @keyframes closeSpotlight {\n    from {\n      transform: rotateY(0);\n    }\n    to {\n      transform: rotateY(90deg);\n    }\n  }\n`,\n);\n\nexport { ModalContainer, BaseModal, BaseModalContent, CloseButtonContainer, SpotlightModal };\n"],"names":["ModalContainer","styled","colors","zIndex","$isClosing","BaseModal","$width","BaseModalContent","$modalWidth","CloseButtonContainer","spotlightWidth","spotlightAnimationStartDuration","spotlightAnimationEndDuration","SpotlightModal"],"mappings":";AAEA,MAAMA,IAAiBC,EAAO;AAAA,EAC5B,CAAC,EAAE,OAAO,EAAE,QAAAC,GAAQ,QAAAC,EAAO,GAAG,YAAAC,QAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAM3BF,EAAO,UAAU;AAAA;AAAA;AAAA,eAGxBE,IAAa,oBAAoB,gBAAgB;AAAA,aACnDD,EAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBzB,GAKME,IAAYJ,EAAO;AAAA,EAIvB,CAAC,EAAE,OAAO,EAAE,QAAAC,EAAU,GAAA,YAAAE,GAAY,QAAAE,QAAa;AAAA;AAAA;AAAA;AAAA,WAItCA,CAAM;AAAA,sBACKJ,EAAO,OAAO;AAAA,sBACdA,EAAO,OAAO;AAAA;AAAA,eAGhCE,IAAa,mBAAmB,aAClC;AAAA;AAAA;AAAA;AAAA,4BAI0BE,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8BlC,GAKMC,IAAmBN,EAAO;AAAA,EAC9B,CAAC,EAAE,aAAAO,EAAA,MAAkB;AAAA;AAAA;AAAA;AAAA,4BAIKA,CAAW;AAAA;AAAA;AAAA;AAIvC,GAKMC,IAAuBR,EAAO;AAAA,EAClC,CAAC,EAAE,OAAO,EAAE,QAAAC,EAAO,GAAG,aAAAM,EAAkB,MAAA;AAAA;AAAA;AAAA;AAAA,WAI/BN,EAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAOGM,CAAW;AAAA;AAAA;AAAA,aAG1BN,EAAO,OAAO;AAAA;AAAA;AAG3B,GAEMQ,IAAiB,KACjBC,IAAkC,KAClCC,IAAgC,KAEhCC,IAAiBZ,EAAO;AAAA,EAG5B,CAAC,EAAE,YAAAG,EAAA,MAAiB;AAAA;AAAA,WAEXM,CAAc;AAAA;AAAA;AAAA,iBAGR,EAAEA,IAAiB,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAQdC,CAA+B;AAAA;AAAA;AAAA;AAAA,IAKnDP,IACI;AAAA;AAAA,4BAEoBQ,CAA6B;AAAA;AAAA;AAAA;AAAA,QAKjD,EACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBF;"}

package/dist/features/ui/modals/use-modal-actions.js

@@ -1,9 +1,9 @@
-import { useContext as e } from "react";
-import n from "./modal-context.js";
-const l = () => {
-  const { openModal: o, closeModal: t, isClosing: s } = e(n);
-  return { openModal: o, closeModal: t, isClosing: s };
-}, c = l;
+import { useContext as n } from "react";
+import l from "./modal-context.js";
+const a = () => {
+  const { openModal: o, closeModal: t, isClosing: s, modal: e } = n(l);
+  return { openModal: o, closeModal: t, isClosing: s, modal: e };
+}, c = a;
 export {
   c as default
 };

package/dist/features/ui/modals/use-modal-actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-modal-actions.js","sources":["../../../../src/features/ui/modals/use-modal-actions.ts"],"sourcesContent":["import type { IUseModalActions } from './modal-types';\n\nimport { useContext } from 'react';\n\nimport ModalContext from './modal-context';\n\nconst useModalActions: IUseModalActions = () => {\n  const { openModal, closeModal, isClosing } = useContext(ModalContext);\n\n  return { openModal, closeModal, isClosing };\n};\n\nexport default useModalActions;\n"],"names":["useModalActions","openModal","closeModal","isClosing","useContext","ModalContext","useModalActions$1"],"mappings":";;AAMA,MAAMA,IAAoC,MAAM;AAC9C,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,WAAAC,EAAU,IAAIC,EAAWC,CAAY;AAE7D,SAAA,EAAE,WAAAJ,GAAW,YAAAC,GAAY,WAAAC;AAClC,GAEAG,IAAeN;"}
+{"version":3,"file":"use-modal-actions.js","sources":["../../../../src/features/ui/modals/use-modal-actions.ts"],"sourcesContent":["import type { IUseModalActions } from './modal-types';\n\nimport { useContext } from 'react';\n\nimport ModalContext from './modal-context';\n\nconst useModalActions: IUseModalActions = () => {\n  const { openModal, closeModal, isClosing, modal } = useContext(ModalContext);\n\n  return { openModal, closeModal, isClosing, modal };\n};\n\nexport default useModalActions;\n"],"names":["useModalActions","openModal","closeModal","isClosing","modal","useContext","ModalContext","useModalActions$1"],"mappings":";;AAMA,MAAMA,IAAoC,MAAM;AAC9C,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,WAAAC,GAAW,OAAAC,MAAUC,EAAWC,CAAY;AAE3E,SAAO,EAAE,WAAAL,GAAW,YAAAC,GAAY,WAAAC,GAAW,OAAAC,EAAM;AACnD,GAEAG,IAAeP;"}

package/dist/features/worksheet/worksheet-preview/api/get-dynamic-sheet.js

@@ -0,0 +1,9 @@
+import { createGetAPI as t } from "@cuemath/rest-api";
+import { BASE_URL_V2 as o } from "../../../../constants/api.js";
+const { useGet: s } = t({
+  getURL: (e) => `${o}/student-nodes/${e}/`
+});
+export {
+  s as useGetDynamicSheetData
+};
+//# sourceMappingURL=get-dynamic-sheet.js.map

package/dist/features/worksheet/worksheet-preview/api/get-dynamic-sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-dynamic-sheet.js","sources":["../../../../../src/features/worksheet/worksheet-preview/api/get-dynamic-sheet.ts"],"sourcesContent":["import type { INodeDataProps } from '../../../chapters-v2/comps/node-card/node-card-types';\n\nimport { createGetAPI } from '@cuemath/rest-api';\n\nimport { BASE_URL_V2 } from '../../../../constants/api';\n\nconst { useGet: useGetDynamicSheetData } = createGetAPI<INodeDataProps, void>({\n  getURL: userNodeId => `${BASE_URL_V2}/student-nodes/${userNodeId}/`,\n});\n\nexport { useGetDynamicSheetData };\n"],"names":["useGetDynamicSheetData","createGetAPI","userNodeId","BASE_URL_V2"],"mappings":";;AAMA,MAAM,EAAE,QAAQA,EAAuB,IAAIC,EAAmC;AAAA,EAC5E,QAAQ,CAAAC,MAAc,GAAGC,CAAW,kBAAkBD,CAAU;AAClE,CAAC;"}

package/dist/features/worksheet/worksheet-preview/dynamic-worksheet-preview/dynamic-worksheet-preview.js

@@ -0,0 +1,57 @@
+import { jsx as e, jsxs as g } from "react/jsx-runtime";
+import { memo as y, useCallback as D, useEffect as w } from "react";
+import k from "../../../ui/buttons/button/button.js";
+import b from "../../../ui/layout/flex-view.js";
+import v from "../../../ui/loader/app-loader/app-loader.js";
+import x from "../../../ui/text/text.js";
+import { useGetDynamicSheetData as A } from "../api/get-dynamic-sheet.js";
+import C from "../worksheet-preview.js";
+const I = y((o) => {
+  const { studentId: t, userNodeId: i, onBackIconClick: m } = o, {
+    get: n,
+    data: c,
+    isProcessing: l,
+    isProcessingFailed: d,
+    error: s
+  } = A(), {
+    items: f = [],
+    title: h,
+    node_type: p = "DYNAMIC"
+  } = c || {}, a = f.map(({ ref: u }) => u), r = D(() => {
+    t && i && n(i);
+  }, [n, t, i]);
+  return w(() => {
+    r();
+  }, [r]), l ? /* @__PURE__ */ e(v, { height: "100%" }) : d ? /* @__PURE__ */ g(b, { $flexGapX: 1.5, $height: "100vh", $justifyContent: "center", $alignItems: "center", children: [
+    /* @__PURE__ */ e(x, { $renderAs: "h6", children: (s == null ? void 0 : s.message) || "Oops! Something went wrong. Please try again later." }),
+    /* @__PURE__ */ e(
+      k,
+      {
+        widthX: 14,
+        size: "small",
+        shape: "square",
+        renderAs: "primary",
+        label: "Try again",
+        onClick: r
+      }
+    )
+  ] }) : a ? /* @__PURE__ */ e(
+    C,
+    {
+      activityReference: "test",
+      action: "review",
+      nodeType: p,
+      userType: "TEACHER",
+      studentId: t ?? "student-id",
+      isLessonV3Enabled: !1,
+      worksheetName: h,
+      scribblingEnabled: !1,
+      items: a,
+      onBackIconClick: m
+    }
+  ) : null;
+}), R = I;
+export {
+  R as default
+};
+//# sourceMappingURL=dynamic-worksheet-preview.js.map

package/dist/features/worksheet/worksheet-preview/dynamic-worksheet-preview/dynamic-worksheet-preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dynamic-worksheet-preview.js","sources":["../../../../../src/features/worksheet/worksheet-preview/dynamic-worksheet-preview/dynamic-worksheet-preview.tsx"],"sourcesContent":["import type { TNodeTypes } from '../../../../types/models/worksheet';\nimport type { IDynamicWorksheetPreview } from './dynamic-worksheet-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport AppLoader from '../../../ui/loader/app-loader/app-loader';\nimport Text from '../../../ui/text/text';\nimport { useGetDynamicSheetData } from '../api/get-dynamic-sheet';\nimport PreviewWorksheet from '../worksheet-preview';\n\nconst DynamicWorksheetPreview: FC<IDynamicWorksheetPreview> = memo(props => {\n  const { studentId, userNodeId, onBackIconClick } = props;\n\n  const {\n    get: getDynamicSheetData,\n    data: dynamicSheetData,\n    isProcessing,\n    isProcessingFailed,\n    error,\n  } = useGetDynamicSheetData();\n\n  const {\n    items: itemsToBeAssigned = [],\n    title,\n    node_type: nodeType = 'DYNAMIC',\n  } = dynamicSheetData || {};\n  const itemRefs = itemsToBeAssigned.map(({ ref }) => ref);\n\n  const fetchDynamicSheetData = useCallback(() => {\n    if (studentId && userNodeId) {\n      getDynamicSheetData(userNodeId);\n    }\n  }, [getDynamicSheetData, studentId, userNodeId]);\n\n  useEffect(() => {\n    fetchDynamicSheetData();\n  }, [fetchDynamicSheetData]);\n\n  if (isProcessing) {\n    return <AppLoader height=\"100%\" />;\n  }\n\n  if (isProcessingFailed) {\n    return (\n      <FlexView $flexGapX={1.5} $height=\"100vh\" $justifyContent=\"center\" $alignItems=\"center\">\n        <Text $renderAs=\"h6\">\n          {error?.message || 'Oops! Something went wrong. Please try again later.'}\n        </Text>\n        <Button\n          widthX={14}\n          size=\"small\"\n          shape=\"square\"\n          renderAs=\"primary\"\n          label=\"Try again\"\n          onClick={fetchDynamicSheetData}\n        />\n      </FlexView>\n    );\n  }\n\n  if (!itemRefs) {\n    return null;\n  }\n\n  return (\n    <PreviewWorksheet\n      activityReference=\"test\"\n      action=\"review\"\n      nodeType={nodeType as TNodeTypes}\n      userType=\"TEACHER\"\n      studentId={studentId ?? 'student-id'}\n      isLessonV3Enabled={false}\n      worksheetName={title}\n      scribblingEnabled={false}\n      items={itemRefs}\n      onBackIconClick={onBackIconClick}\n    />\n  );\n});\n\nexport default DynamicWorksheetPreview;\n"],"names":["DynamicWorksheetPreview","memo","props","studentId","userNodeId","onBackIconClick","getDynamicSheetData","dynamicSheetData","isProcessing","isProcessingFailed","error","useGetDynamicSheetData","itemsToBeAssigned","title","nodeType","itemRefs","ref","fetchDynamicSheetData","useCallback","useEffect","jsx","AppLoader","jsxs","FlexView","Text","Button","PreviewWorksheet","DynamicWorksheetPreview$1"],"mappings":";;;;;;;;AAaA,MAAMA,IAAwDC,EAAK,CAASC,MAAA;AAC1E,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,iBAAAC,EAAA,IAAoBH,GAE7C;AAAA,IACJ,KAAKI;AAAA,IACL,MAAMC;AAAA,IACN,cAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,OAAAC;AAAA,MACEC,EAAuB,GAErB;AAAA,IACJ,OAAOC,IAAoB,CAAC;AAAA,IAC5B,OAAAC;AAAA,IACA,WAAWC,IAAW;AAAA,EAAA,IACpBP,KAAoB,CAAA,GAClBQ,IAAWH,EAAkB,IAAI,CAAC,EAAE,KAAAI,EAAA,MAAUA,CAAG,GAEjDC,IAAwBC,EAAY,MAAM;AAC9C,IAAIf,KAAaC,KACfE,EAAoBF,CAAU;AAAA,EAE/B,GAAA,CAACE,GAAqBH,GAAWC,CAAU,CAAC;AAM/C,SAJAe,EAAU,MAAM;AACQ,IAAAF;EAAA,GACrB,CAACA,CAAqB,CAAC,GAEtBT,IACK,gBAAAY,EAACC,GAAU,EAAA,QAAO,OAAO,CAAA,IAG9BZ,IAEA,gBAAAa,EAACC,KAAS,WAAW,KAAK,SAAQ,SAAQ,iBAAgB,UAAS,aAAY,UAC7E,UAAA;AAAA,IAAA,gBAAAH,EAACI,GAAK,EAAA,WAAU,MACb,WAAAd,KAAA,gBAAAA,EAAO,YAAW,uDACrB;AAAA,IACA,gBAAAU;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,QAAQ;AAAA,QACR,MAAK;AAAA,QACL,OAAM;AAAA,QACN,UAAS;AAAA,QACT,OAAM;AAAA,QACN,SAASR;AAAA,MAAA;AAAA,IACX;AAAA,EACF,EAAA,CAAA,IAICF,IAKH,gBAAAK;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,mBAAkB;AAAA,MAClB,QAAO;AAAA,MACP,UAAAZ;AAAA,MACA,UAAS;AAAA,MACT,WAAWX,KAAa;AAAA,MACxB,mBAAmB;AAAA,MACnB,eAAeU;AAAA,MACf,mBAAmB;AAAA,MACnB,OAAOE;AAAA,MACP,iBAAAV;AAAA,IAAA;AAAA,EAAA,IAdK;AAiBX,CAAC,GAEDsB,IAAe3B;"}

package/dist/index.d.ts

@@ -334,6 +334,8 @@ export declare const DraftIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
 export declare const DragIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
+export declare const DynamicPreviewWorksheet: FC<IDynamicWorksheetPreview>;
+
 export declare enum EClassTimeAlertLevel {
     FIVE_MIN = "5min",
     FIFTEEN_MIN = "15min"
@@ -1296,6 +1298,12 @@ declare interface IDigitalMeterProps {
     actAsTimer?: boolean;
 }
 
+declare interface IDynamicWorksheetPreview {
+    studentId: string;
+    userNodeId: string;
+    onBackIconClick: () => void;
+}
+
 declare interface IEditMilestoneModalProps extends IMilestoneEditProps {
     studentId: string;
     isUsingAlternateCurriculum: boolean;
@@ -2381,6 +2389,11 @@ export declare interface IModal {
     modalWidth: string;
 }
 
+declare interface IModalCallbacks {
+    /** Callback when the modal is closed */
+    onCloseModal?: () => void;
+}
+
 /**
  * Context for managing modals throughout the application
  */
@@ -2390,7 +2403,7 @@ declare interface IModalContext {
     /** Parameters passed to the modal when opened */
     modalParams?: Record<string, unknown>;
     /** Opens a modal by name with optional parameters */
-    openModal: <T = undefined>(name: string, params?: T) => void;
+    openModal: <T = undefined>(name: string, params?: T, callbacks?: IModalCallbacks) => void;
     /** Closes the currently open modal */
     closeModal: () => void;
     /** Whether the modal is in the process of closing (for animation) */
@@ -3608,7 +3621,7 @@ declare interface IUseIsTabBlocked {
 }
 
 declare interface IUseModalActions {
-    (): Pick<IModalContext, 'openModal' | 'closeModal' | 'isClosing'>;
+    (): Pick<IModalContext, 'openModal' | 'closeModal' | 'isClosing' | 'modal'>;
 }
 
 declare interface IUseModalParams {

package/dist/index.js

@@ -14,9 +14,9 @@ import { default as L } from "./assets/line-icons/icons/bookmark.js";
 import { default as k } from "./assets/line-icons/icons/bulb.js";
 import { default as O } from "./assets/line-icons/icons/bulb2.js";
 import { default as D } from "./assets/line-icons/icons/calendar.js";
-import { default as g } from "./assets/line-icons/icons/check.js";
+import { default as y } from "./assets/line-icons/icons/check.js";
 import { default as U } from "./assets/line-icons/icons/check2.js";
-import { default as v } from "./assets/line-icons/icons/clipboard.js";
+import { default as B } from "./assets/line-icons/icons/clipboard.js";
 import { default as w } from "./assets/line-icons/icons/clock.js";
 import { default as V } from "./assets/line-icons/icons/clock2.js";
 import { default as Y } from "./assets/line-icons/icons/code.js";
@@ -41,9 +41,9 @@ import { default as Le } from "./assets/line-icons/icons/home.js";
 import { default as ke } from "./assets/line-icons/icons/image.js";
 import { default as Oe } from "./assets/line-icons/icons/info.js";
 import { default as De } from "./assets/line-icons/icons/info2.js";
-import { default as ge } from "./assets/line-icons/icons/left.js";
+import { default as ye } from "./assets/line-icons/icons/left.js";
 import { default as Ue } from "./assets/line-icons/icons/lock.js";
-import { default as ve } from "./assets/line-icons/icons/lock2.js";
+import { default as Be } from "./assets/line-icons/icons/lock2.js";
 import { default as we } from "./assets/line-icons/icons/lock3.js";
 import { default as Ve } from "./assets/line-icons/icons/minus.js";
 import { default as Ye } from "./assets/line-icons/icons/minus2.js";
@@ -68,8 +68,8 @@ import { default as Mo } from "./assets/line-icons/icons/search.js";
 import { default as No } from "./assets/line-icons/icons/sheet.js";
 import { default as Ho } from "./assets/line-icons/icons/star.js";
 import { default as Go } from "./assets/line-icons/icons/skip-colored.js";
-import { default as yo } from "./assets/line-icons/icons/skip.js";
-import { default as Bo } from "./assets/line-icons/icons/skip2.js";
+import { default as go } from "./assets/line-icons/icons/skip.js";
+import { default as vo } from "./assets/line-icons/icons/skip2.js";
 import { default as bo } from "./assets/line-icons/icons/star2.js";
 import { default as Wo } from "./assets/line-icons/icons/status.js";
 import { default as Fo } from "./assets/line-icons/icons/striked-eye.js";
@@ -94,9 +94,9 @@ import { default as Lr } from "./assets/line-icons/icons/cuemath-logo.js";
 import { default as kr } from "./assets/line-icons/icons/next2.js";
 import { AutoPlayPermissionProvider as Or } from "./features/hooks/use-auto-play-permission/use-auto-play-permission-context-provider.js";
 import { default as Dr } from "./features/hooks/use-zoom-disable.js";
-import { default as gr } from "./features/hooks/use-force-reload.js";
+import { default as yr } from "./features/hooks/use-force-reload.js";
 import { default as Ur } from "./features/ui/accordion-section/accordion-section.js";
-import { default as vr } from "./features/ui/arrow-tooltip/arrow-tooltip.js";
+import { default as Br } from "./features/ui/arrow-tooltip/arrow-tooltip.js";
 import { default as wr } from "./features/ui/context-menu/context-menu.js";
 import { default as Vr } from "./features/ui/timers/countdown-timer/countdown-timer.js";
 import { default as Yr } from "./features/ui/nudge/nudge.js";
@@ -121,9 +121,9 @@ import { default as Lt } from "./features/ui/layout/flex-view.js";
 import { default as kt } from "./features/ui/loader/app-loader/app-loader.js";
 import { CircularLoader as Ot } from "./features/ui/loader/circular-loader/circular-loader.js";
 import { default as Dt } from "./features/ui/modals/modal-provider.js";
-import { default as gt } from "./features/ui/modals/use-modal-actions.js";
+import { default as yt } from "./features/ui/modals/use-modal-actions.js";
 import { default as Ut } from "./features/ui/modals/use-modal-params.js";
-import { default as vt } from "./features/ui/radio-cards/radio-cards.js";
+import { default as Bt } from "./features/ui/radio-cards/radio-cards.js";
 import { default as wt } from "./features/ui/section-list/section-list.js";
 import { default as Vt } from "./features/ui/text/text.js";
 import { default as Yt } from "./features/ui/tag/tag.js";
@@ -148,8 +148,8 @@ import { default as Ma } from "./features/auth/comps/tabs/tabs.js";
 import { default as Na } from "./features/auth/comps/input-status-icon/input-status-icon.js";
 import { default as Ha } from "./features/auth/comps/resend-otp/resend-otp.js";
 import { default as Ga } from "./features/auth/signup/user-type-selector/user-type-selector.js";
-import { default as ya } from "./features/auth/signup/claim-user-account/claim-user-account.js";
-import { default as Ba } from "./features/auth/signup/custom-input-field/grade-input/grade-input.js";
+import { default as ga } from "./features/auth/signup/claim-user-account/claim-user-account.js";
+import { default as va } from "./features/auth/signup/custom-input-field/grade-input/grade-input.js";
 import { default as ba } from "./features/auth/signup/custom-input-field/date-picker-input/date-picker-input.js";
 import { default as Wa } from "./features/auth/signup/custom-input-field/custom-input-field.js";
 import { default as Fa } from "./features/auth/signup/circular-step-wrapper/circular-step-wrapper.js";
@@ -174,9 +174,9 @@ import { default as Lf } from "./features/chapters/chapters-list/chapters-list.j
 import { default as kf } from "./features/chapters/lpar-chapter/lpar-chapter.js";
 import { default as Of } from "./features/chapters/lpar-milestone-chapter/lpar-milestone-chapter.js";
 import { default as Df } from "./features/chapters/lpar-chapter/block-section/sat-sheet-item/sat-sheet-summary/sat-sheet-summary.js";
-import { checkIfPPTNodeType as gf } from "./features/chapters/lpar-chapter/utils/index.js";
+import { checkIfPPTNodeType as yf } from "./features/chapters/lpar-chapter/utils/index.js";
 import { default as Uf } from "./features/chapters-v2/chapter-details/chapter-details.js";
-import { invalidateGetChapterDetails as vf } from "./features/chapters-v2/api/chapter.js";
+import { invalidateGetChapterDetails as Bf } from "./features/chapters-v2/api/chapter.js";
 import { GAME_LAUNCHER_ASSET_PADDING as wf } from "./features/circle-games/game-launcher/comps/segmented-game-card/constants.js";
 import { GAME_LAUNCHER_SIZE as Vf } from "./features/circle-games/game-launcher/comps/card-container/constants.js";
 import { useCircleSounds as Yf } from "./features/circle-games/hooks/use-circle-sounds/use-circle-sounds.js";
@@ -201,8 +201,8 @@ import { SplashScreen as Ms } from "./features/circle-games/sign-up/comp/splash-
 import { SignUp as Ns } from "./features/circle-games/sign-up/sign-up.js";
 import { default as Hs } from "./features/cue-canvas/cue-canvas-provider.js";
 import { default as Gs } from "./features/cue-canvas/toolbar/toolbar.js";
-import { default as ys } from "./features/cue-canvas/cue-canvas.js";
-import { default as Bs } from "./features/cue-canvas/hooks/use-canvas-sync-broker.js";
+import { default as gs } from "./features/cue-canvas/cue-canvas.js";
+import { default as vs } from "./features/cue-canvas/hooks/use-canvas-sync-broker.js";
 import { default as bs } from "./features/cue-canvas/sidebar/sidebar.js";
 import { default as Ws } from "./features/cue-canvas/bottombar/homework-controls.js";
 import { default as Fs } from "./features/communication/hooks/use-inclass-message-broker/use-inclass-message-broker.js";
@@ -227,9 +227,9 @@ import { Coachmark as Ll } from "./features/journey/comps/coachmark/coachmark.js
 import { useHomePageJourney as kl } from "./features/journey/hooks/use-home-page-journey/use-home-page-journey.js";
 import { useChapterPageJourney as Ol } from "./features/journey/hooks/use-chapter-journey.js";
 import { default as Dl } from "./features/maintenance/maintenance.js";
-import { default as gl } from "./features/milestone/create/submit-modal/submit-modal.js";
+import { default as yl } from "./features/milestone/create/submit-modal/submit-modal.js";
 import { default as Ul } from "./features/milestone/create/comps/confirmation-modals/goal-creation-confirmation.js";
-import { default as vl } from "./features/milestone/create/comps/confirmation-modals/chapter-clearance-confirmation.js";
+import { default as Bl } from "./features/milestone/create/comps/confirmation-modals/chapter-clearance-confirmation.js";
 import { default as wl } from "./features/milestone/create/milestone-create-container.js";
 import { default as Vl } from "./features/milestone/edit/goal-drafts/goal-draft-edit-container.js";
 import { default as Yl } from "./features/milestone/outcome/milestone-outcome-container.js";
@@ -252,8 +252,8 @@ import { default as Mp } from "./features/pointer-sync/pointer.js";
 import { default as Np } from "./features/pointer-sync/hooks/use-pointer-sync.js";
 import { DigitalMeter as Hp } from "./features/post-game-stats/digital-meter/digital-meter.js";
 import { EPostGameStat as Gp } from "./features/post-game-stats/enums/post-game-stats-enum.js";
-import { PostGameStats as yp } from "./features/post-game-stats/post-game-stats.js";
-import { default as Bp } from "./features/recent-chapters/recent-chapters.js";
+import { PostGameStats as gp } from "./features/post-game-stats/post-game-stats.js";
+import { default as vp } from "./features/recent-chapters/recent-chapters.js";
 import { SENTRY_DENIED_URLS as bp, SENTRY_IGNORED_ERRORS as wp } from "./features/sentry/constants/ignored.js";
 import { default as Vp } from "./features/sheet-tools/desmos-calculator/desmos-calculator.js";
 import { default as Yp } from "./features/sheet-tools/tool-header/tool-header.js";
@@ -268,13 +268,14 @@ import { ACTION_BAR_HEIGHT as Tm, QUESTIONS_GAP as Sm, QUESTION_WIDTH as Em, TOP
 import { isOkayTypeQuestion as Pm } from "./features/worksheet/worksheet/worksheet-helpers.js";
 import { default as hm } from "./features/worksheet/worksheet/worksheet-container.js";
 import { default as Lm } from "./features/worksheet/worksheet-preview/worksheet-preview.js";
-import { default as km } from "./features/worksheet/worksheet/worksheet-permissions/sheet-locked.js";
-import { default as Om } from "./features/worksheet/worksheet/worksheet-permissions/error.js";
-import { default as Dm } from "./features/worksheet/learnosity-preloader/learnosity-preloader.js";
-import { default as gm } from "./features/worksheet/learnosity-preloader/use-is-learnosity-loaded.js";
-import { default as Um } from "./features/worksheet/worksheet-preview/hooks/use-worksheet-layout.js";
-import { default as vm } from "./features/hooks/use-viewport/use-viewport.js";
-import { COUNTRY_CODE_MAP as wm } from "./constants/country.js";
+import { default as km } from "./features/worksheet/worksheet-preview/dynamic-worksheet-preview/dynamic-worksheet-preview.js";
+import { default as Om } from "./features/worksheet/worksheet/worksheet-permissions/sheet-locked.js";
+import { default as Dm } from "./features/worksheet/worksheet/worksheet-permissions/error.js";
+import { default as ym } from "./features/worksheet/learnosity-preloader/learnosity-preloader.js";
+import { default as Um } from "./features/worksheet/learnosity-preloader/use-is-learnosity-loaded.js";
+import { default as Bm } from "./features/worksheet/worksheet-preview/hooks/use-worksheet-layout.js";
+import { default as wm } from "./features/hooks/use-viewport/use-viewport.js";
+import { COUNTRY_CODE_MAP as Vm } from "./constants/country.js";
 export {
   xp as ACHIEVEMENT_ACTIONS,
   mf as AUTH_TABS,
@@ -286,7 +287,7 @@ export {
   Ea as AnimatedArc,
   kt as AppLoader,
   et as ArcButton,
-  vr as ArrowTooltip,
+  Br as ArrowTooltip,
   df as AuthApiErrorCode,
   _a as AuthPageLayout,
   Aa as AuthStaticPanel,
@@ -307,17 +308,17 @@ export {
   Is as CIRCLE_ACTION_IDS,
   cs as CIRCLE_ONBOARDING_ANALYTICS_STEPS,
   Xp as COMPLETED_SHEET_STATE,
-  wm as COUNTRY_CODE_MAP,
+  Vm as COUNTRY_CODE_MAP,
   D as CalendarIcon,
   Qt as Callout,
   St as CascadingSelectInput,
   hf as Chapter,
-  vl as ChapterClearanceConfirmationModal,
+  Bl as ChapterClearanceConfirmationModal,
   Uf as ChapterDetails,
   Lf as ChaptersList,
   hr as ChatIcon,
   U as Check2Icon,
-  g as CheckIcon,
+  y as CheckIcon,
   at as CheckboxInput,
   st as CheckboxInputList,
   Sr as ChevronDownIcon,
@@ -327,9 +328,9 @@ export {
   Ot as CircularLoader,
   Fa as CircularStepWrapper,
   Rs as CircularSteps,
-  ya as ClaimUserAccount,
+  ga as ClaimUserAccount,
   jr as Clickable,
-  v as ClipboardIcon,
+  B as ClipboardIcon,
   V as Clock2Icon,
   w as ClockIcon,
   Ll as Coachmark,
@@ -338,7 +339,7 @@ export {
   Q as CopyIcon,
   Vr as CountdownTimer,
   j as CrossIcon,
-  ys as CueCanvas,
+  gs as CueCanvas,
   Gs as CueCanvasController,
   Ws as CueCanvasHomeworkController,
   Hs as CueCanvasProvider,
@@ -353,6 +354,7 @@ export {
   ee as DownIcon,
   re as DraftIcon,
   ae as DragIcon,
+  km as DynamicPreviewWorksheet,
   el as EClassTimeAlertLevel,
   qf as ELeaderboardType,
   up as EPResourceAssign,
@@ -378,7 +380,7 @@ export {
   Vl as GoalDraftEdit,
   Xl as GoalEdit,
   ct as GooglePlacesSearchInput,
-  Ba as GradeInput,
+  va as GradeInput,
   r as GradeSelector,
   Ce as HandIcon,
   Pe as HelpIcon,
@@ -403,9 +405,9 @@ export {
   kf as LPARChapter,
   Of as LPARMilestoneChapter,
   Ps as Leaderboard,
-  Dm as LearnosityPreloader,
-  ge as LeftIcon,
-  ve as Lock2Icon,
+  ym as LearnosityPreloader,
+  ye as LeftIcon,
+  Be as Lock2Icon,
   we as Lock3Icon,
   Ue as LockIcon,
   Dl as Maintenance,
@@ -443,7 +445,7 @@ export {
   uo as Plus2Icon,
   po as PlusIcon,
   ro as PointerIcon,
-  yp as PostGameStats,
+  gp as PostGameStats,
   no as PracticeIcon,
   Lm as PreviewWorksheet,
   io as ProgressIcon,
@@ -452,9 +454,9 @@ export {
   To as QuestionIcon,
   Eo as QuestionLetterIcon,
   tm as REWARDS_LIST,
-  vt as RadioCard,
+  Bt as RadioCard,
   pt as RadioInput,
-  Bp as RecentChapters,
+  vp as RecentChapters,
   Ao as RedoIcon,
   jp as ReferenceSheet,
   Mp as RemotePeerPointer,
@@ -479,16 +481,16 @@ export {
   ut as SelectInput,
   ht as SelectionCards,
   da as Separator,
-  Om as SheetError,
+  Dm as SheetError,
   No as SheetIcon,
   Qp as SheetList,
-  km as SheetLocked,
+  Om as SheetLocked,
   Ns as SignUp,
   Ja as SignupMethods,
   ur as SketchIcon,
-  Bo as Skip2Icon,
+  vo as Skip2Icon,
   Go as SkipColoredIcon,
-  yo as SkipIcon,
+  go as SkipIcon,
   za as SocialAccountNotFound,
   Za as SocialLoginMethods,
   Ms as SplashScreen,
@@ -500,7 +502,7 @@ export {
   Xf as StreakReductionLocalStorageUtil,
   Fo as StrikedEyeIcon,
   dm as StudentDetails,
-  gl as SubmitMilestoneModal,
+  yl as SubmitMilestoneModal,
   Jo as SwitchIcon,
   la as TabComponent,
   Ma as Tabs,
@@ -536,9 +538,9 @@ export {
   rs as WebView,
   ss as WebViewEvent,
   hm as Worksheet,
-  gf as checkIfPPTNodeType,
+  yf as checkIfPPTNodeType,
   oa as getTheme,
-  vf as invalidateGetChapterDetails,
+  Bf as invalidateGetChapterDetails,
   ul as invalidateHomeworks,
   hp as invalidateMilestoneResources,
   ip as invalidateMilestonesData,
@@ -548,12 +550,12 @@ export {
   nm as loadScript,
   im as media,
   xl as useAutoPlayPermission,
-  Bs as useCanvasSyncBroker,
+  vs as useCanvasSyncBroker,
   Ol as useChapterPageJourney,
   Yf as useCircleSounds,
   rl as useClassTimeAlerts,
   $t as useContextMenuClickHandler,
-  gr as useForceReload,
+  yr as useForceReload,
   Ip as useGetAllMilestonesdata,
   Cs as useGetCircleHomeDetailsDal,
   Cl as useGetEligibleJourneysViaRoute,
@@ -565,17 +567,17 @@ export {
   Zs as useInClassActionDispatcher,
   qs as useInClassActionListener,
   Fs as useInClassMessageBroker,
-  gm as useIsLearnosityLoaded,
+  Um as useIsLearnosityLoaded,
   Cf as useIsTabBlocked,
   Sl as useJourney,
-  gt as useModalActions,
+  yt as useModalActions,
   Ut as useModalParams,
   Np as usePointerSync,
   zt as useTrackingContext,
   Js as useTrialSessionMessageBroker,
   Zt as useUIContext,
-  vm as useViewport,
-  Um as useWorksheetLayout,
+  wm as useViewport,
+  Bm as useWorksheetLayout,
   Dr as useZoomDisable
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuemath/leap",
-  "version": "3.1.17",
+  "version": "3.1.19-as1",
   "type": "module",
   "files": [
     "dist"