analytica-frontend-lib 1.1.18 → 1.1.20

package/dist/index.js

@@ -129,11 +129,13 @@ __export(src_exports, {
   VideoPlayer: () => VideoPlayer_default,
   Whiteboard: () => Whiteboard_default,
   createZustandAuthAdapter: () => createZustandAuthAdapter,
+  getDeviceType: () => getDeviceType,
   getRootDomain: () => getRootDomain,
   getStatusBadge: () => getStatusBadge,
   useApiConfig: () => useApiConfig,
   useAuth: () => useAuth,
   useAuthGuard: () => useAuthGuard,
+  useMobile: () => useMobile,
   useQuizStore: () => useQuizStore,
   useRouteAuth: () => useRouteAuth,
   useToastStore: () => ToastStore_default,
@@ -5974,9 +5976,66 @@ var IconRender = ({
 };
 var IconRender_default = IconRender;
 
+// src/hooks/useMobile.ts
+var import_react19 = require("react");
+var MOBILE_WIDTH = 500;
+var TABLET_WIDTH = 931;
+var DEFAULT_WIDTH = 1200;
+var getWindowWidth = () => {
+  if (typeof window === "undefined") {
+    return DEFAULT_WIDTH;
+  }
+  return window.innerWidth;
+};
+var getDeviceType = () => {
+  const width = getWindowWidth();
+  return width < TABLET_WIDTH ? "responsive" : "desktop";
+};
+var useMobile = () => {
+  const [isMobile, setIsMobile] = (0, import_react19.useState)(false);
+  const [isTablet, setIsTablet] = (0, import_react19.useState)(false);
+  (0, import_react19.useEffect)(() => {
+    const checkScreenSize = () => {
+      const width = getWindowWidth();
+      setIsMobile(width < MOBILE_WIDTH);
+      setIsTablet(width < TABLET_WIDTH);
+    };
+    checkScreenSize();
+    window.addEventListener("resize", checkScreenSize);
+    return () => window.removeEventListener("resize", checkScreenSize);
+  }, []);
+  const getFormContainerClasses = () => {
+    if (isMobile) {
+      return "w-full px-4";
+    }
+    if (isTablet) {
+      return "w-full px-6";
+    }
+    return "w-full max-w-[992px] mx-auto px-0";
+  };
+  const getMobileHeaderClasses = () => {
+    return "flex flex-col items-start gap-4 mb-6";
+  };
+  const getDesktopHeaderClasses = () => {
+    return "flex flex-row justify-between items-center gap-6 mb-8";
+  };
+  const getHeaderClasses = () => {
+    return isMobile ? getMobileHeaderClasses() : getDesktopHeaderClasses();
+  };
+  return {
+    isMobile,
+    isTablet,
+    getFormContainerClasses,
+    getHeaderClasses,
+    getMobileHeaderClasses,
+    getDesktopHeaderClasses,
+    getDeviceType
+  };
+};
+
 // src/components/Select/Select.tsx
 var import_zustand5 = require("zustand");
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_phosphor_react16 = require("phosphor-react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
 var VARIANT_CLASSES4 = {
@@ -6036,13 +6095,13 @@ function getLabelAsNode(children) {
   if (typeof children === "string" || typeof children === "number") {
     return children;
   }
-  const flattened = import_react19.Children.toArray(children);
+  const flattened = import_react20.Children.toArray(children);
   if (flattened.length === 1) return flattened[0];
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_jsx_runtime32.Fragment, { children: flattened });
 }
 var injectStore4 = (children, store, size, selectId) => {
-  return import_react19.Children.map(children, (child) => {
-    if ((0, import_react19.isValidElement)(child)) {
+  return import_react20.Children.map(children, (child) => {
+    if ((0, import_react20.isValidElement)(child)) {
       const typedChild = child;
       const newProps = {
         store
@@ -6059,7 +6118,7 @@ var injectStore4 = (children, store, size, selectId) => {
           selectId
         );
       }
-      return (0, import_react19.cloneElement)(typedChild, newProps);
+      return (0, import_react20.cloneElement)(typedChild, newProps);
     }
     return child;
   });
@@ -6076,18 +6135,18 @@ var Select = ({
   errorMessage,
   id
 }) => {
-  const storeRef = (0, import_react19.useRef)(null);
+  const storeRef = (0, import_react20.useRef)(null);
   storeRef.current ??= createSelectStore(onValueChange);
   const store = storeRef.current;
-  const selectRef = (0, import_react19.useRef)(null);
+  const selectRef = (0, import_react20.useRef)(null);
   const { open, setOpen, setValue, selectedLabel } = (0, import_zustand5.useStore)(store, (s) => s);
-  const generatedId = (0, import_react19.useId)();
+  const generatedId = (0, import_react20.useId)();
   const selectId = id ?? `select-${generatedId}`;
   const findLabelForValue = (children2, targetValue) => {
     let found = null;
     const search = (nodes) => {
-      import_react19.Children.forEach(nodes, (child) => {
-        if (!(0, import_react19.isValidElement)(child)) return;
+      import_react20.Children.forEach(nodes, (child) => {
+        if (!(0, import_react20.isValidElement)(child)) return;
         const typedChild = child;
         if (typedChild.type === SelectItem && typedChild.props.value === targetValue) {
           if (typeof typedChild.props.children === "string")
@@ -6100,13 +6159,13 @@ var Select = ({
     search(children2);
     return found;
   };
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (!selectedLabel && defaultValue) {
       const label2 = findLabelForValue(children, defaultValue);
       if (label2) store.setState({ selectedLabel: label2 });
     }
   }, [children, defaultValue, selectedLabel]);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     const handleClickOutside = (event) => {
       if (selectRef.current && !selectRef.current.contains(event.target)) {
         setOpen(false);
@@ -6141,7 +6200,7 @@ var Select = ({
       document.removeEventListener("keydown", handleArrowKeys);
     };
   }, [open]);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react20.useEffect)(() => {
     if (propValue) {
       setValue(propValue);
       const label2 = findLabelForValue(children, propValue);
@@ -6178,7 +6237,7 @@ var SelectValue = ({
   const value = (0, import_zustand5.useStore)(store, (s) => s.value);
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-inherit", children: selectedLabel || placeholder || value });
 };
-var SelectTrigger = (0, import_react19.forwardRef)(
+var SelectTrigger = (0, import_react20.forwardRef)(
   ({
     className,
     invalid = false,
@@ -6232,7 +6291,7 @@ var SelectTrigger = (0, import_react19.forwardRef)(
   }
 );
 SelectTrigger.displayName = "SelectTrigger";
-var SelectContent = (0, import_react19.forwardRef)(
+var SelectContent = (0, import_react20.forwardRef)(
   ({
     children,
     className,
@@ -6262,7 +6321,7 @@ var SelectContent = (0, import_react19.forwardRef)(
   }
 );
 SelectContent.displayName = "SelectContent";
-var SelectItem = (0, import_react19.forwardRef)(
+var SelectItem = (0, import_react20.forwardRef)(
   ({
     className,
     children,
@@ -6323,7 +6382,7 @@ var Select_default = Select;
 
 // src/components/Menu/Menu.tsx
 var import_zustand6 = require("zustand");
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_phosphor_react17 = require("phosphor-react");
 var import_jsx_runtime33 = require("react/jsx-runtime");
 var createMenuStore = (onValueChange) => (0, import_zustand6.create)((set) => ({
@@ -6343,7 +6402,7 @@ var VARIANT_CLASSES5 = {
   menu2: "",
   breadcrumb: "bg-transparent shadow-none !px-0 !-ml-2"
 };
-var Menu = (0, import_react20.forwardRef)(
+var Menu = (0, import_react21.forwardRef)(
   ({
     className,
     children,
@@ -6353,11 +6412,11 @@ var Menu = (0, import_react20.forwardRef)(
     onValueChange,
     ...props
   }, ref) => {
-    const storeRef = (0, import_react20.useRef)(null);
+    const storeRef = (0, import_react21.useRef)(null);
     storeRef.current ??= createMenuStore(onValueChange);
     const store = storeRef.current;
     const { setValue } = (0, import_zustand6.useStore)(store, (s) => s);
-    (0, import_react20.useEffect)(() => {
+    (0, import_react21.useEffect)(() => {
       setValue(propValue ?? defaultValue);
     }, [defaultValue, propValue, setValue]);
     const baseClasses = "w-full py-2 flex flex-row items-center justify-center";
@@ -6378,7 +6437,7 @@ var Menu = (0, import_react20.forwardRef)(
   }
 );
 Menu.displayName = "Menu";
-var MenuContent = (0, import_react20.forwardRef)(
+var MenuContent = (0, import_react21.forwardRef)(
   ({ className, children, variant = "menu", ...props }, ref) => {
     const baseClasses = "w-full flex flex-row items-center gap-2";
     const variantClasses = variant === "menu2" ? "overflow-x-auto scroll-smooth" : "";
@@ -6400,7 +6459,7 @@ var MenuContent = (0, import_react20.forwardRef)(
   }
 );
 MenuContent.displayName = "MenuContent";
-var MenuItem = (0, import_react20.forwardRef)(
+var MenuItem = (0, import_react21.forwardRef)(
   ({
     className,
     children,
@@ -6533,10 +6592,10 @@ var MenuOverflow = ({
   onValueChange,
   ...props
 }) => {
-  const containerRef = (0, import_react20.useRef)(null);
-  const [showLeftArrow, setShowLeftArrow] = (0, import_react20.useState)(false);
-  const [showRightArrow, setShowRightArrow] = (0, import_react20.useState)(false);
-  (0, import_react20.useEffect)(() => {
+  const containerRef = (0, import_react21.useRef)(null);
+  const [showLeftArrow, setShowLeftArrow] = (0, import_react21.useState)(false);
+  const [showRightArrow, setShowRightArrow] = (0, import_react21.useState)(false);
+  (0, import_react21.useEffect)(() => {
     const checkScroll = () => internalCheckScroll(
       containerRef.current,
       setShowLeftArrow,
@@ -6596,11 +6655,11 @@ var MenuOverflow = ({
     }
   );
 };
-var injectStore5 = (children, store) => import_react20.Children.map(children, (child) => {
-  if (!(0, import_react20.isValidElement)(child)) return child;
+var injectStore5 = (children, store) => import_react21.Children.map(children, (child) => {
+  if (!(0, import_react21.isValidElement)(child)) return child;
   const typedChild = child;
   const shouldInject = typedChild.type === MenuItem;
-  return (0, import_react20.cloneElement)(typedChild, {
+  return (0, import_react21.cloneElement)(typedChild, {
     ...shouldInject ? { store } : {},
     ...typedChild.props.children ? { children: injectStore5(typedChild.props.children, store) } : {}
   });
@@ -6608,7 +6667,7 @@ var injectStore5 = (children, store) => import_react20.Children.map(children, (c
 var Menu_default = Menu;
 
 // src/components/Skeleton/Skeleton.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime34 = require("react/jsx-runtime");
 var SKELETON_ANIMATION_CLASSES = {
   pulse: "animate-pulse",
@@ -6626,7 +6685,7 @@ var SPACING_CLASSES = {
   medium: "space-y-2",
   large: "space-y-3"
 };
-var Skeleton = (0, import_react21.forwardRef)(
+var Skeleton = (0, import_react22.forwardRef)(
   ({
     variant = "text",
     width,
@@ -6675,13 +6734,13 @@ var Skeleton = (0, import_react21.forwardRef)(
     );
   }
 );
-var SkeletonText = (0, import_react21.forwardRef)(
+var SkeletonText = (0, import_react22.forwardRef)(
   (props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "text", ...props })
 );
-var SkeletonCircle = (0, import_react21.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "circular", ...props }));
-var SkeletonRectangle = (0, import_react21.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "rectangular", ...props }));
-var SkeletonRounded = (0, import_react21.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "rounded", ...props }));
-var SkeletonCard = (0, import_react21.forwardRef)(
+var SkeletonCircle = (0, import_react22.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "circular", ...props }));
+var SkeletonRectangle = (0, import_react22.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "rectangular", ...props }));
+var SkeletonRounded = (0, import_react22.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Skeleton, { ref, variant: "rounded", ...props }));
+var SkeletonCard = (0, import_react22.forwardRef)(
   ({
     showAvatar = true,
     showTitle = true,
@@ -6717,7 +6776,7 @@ var SkeletonCard = (0, import_react21.forwardRef)(
     );
   }
 );
-var SkeletonList = (0, import_react21.forwardRef)(
+var SkeletonList = (0, import_react22.forwardRef)(
   ({
     items = 3,
     showAvatar = true,
@@ -6736,7 +6795,7 @@ var SkeletonList = (0, import_react21.forwardRef)(
     ] }, index)) });
   }
 );
-var SkeletonTable = (0, import_react21.forwardRef)(
+var SkeletonTable = (0, import_react22.forwardRef)(
   ({ rows = 5, columns = 4, showHeader = true, className = "", ...props }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { ref, className: cn("w-full", className), ...props, children: [
       showHeader && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
@@ -6861,7 +6920,7 @@ var NotFound = ({
 var NotFound_default = NotFound;
 
 // src/components/VideoPlayer/VideoPlayer.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 var import_phosphor_react18 = require("phosphor-react");
 var import_jsx_runtime36 = require("react/jsx-runtime");
 var CONTROLS_HIDE_TIMEOUT = 3e3;
@@ -6966,26 +7025,26 @@ var VideoPlayer = ({
   autoSave = true,
   storageKey = "video-progress"
 }) => {
-  const videoRef = (0, import_react22.useRef)(null);
-  const [isPlaying, setIsPlaying] = (0, import_react22.useState)(false);
-  const [currentTime, setCurrentTime] = (0, import_react22.useState)(0);
-  const [duration, setDuration] = (0, import_react22.useState)(0);
-  const [isMuted, setIsMuted] = (0, import_react22.useState)(false);
-  const [volume, setVolume] = (0, import_react22.useState)(1);
-  const [isFullscreen, setIsFullscreen] = (0, import_react22.useState)(false);
-  const [showControls, setShowControls] = (0, import_react22.useState)(true);
-  const [hasCompleted, setHasCompleted] = (0, import_react22.useState)(false);
-  const [showCaptions, setShowCaptions] = (0, import_react22.useState)(false);
-  (0, import_react22.useEffect)(() => {
+  const videoRef = (0, import_react23.useRef)(null);
+  const [isPlaying, setIsPlaying] = (0, import_react23.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react23.useState)(0);
+  const [duration, setDuration] = (0, import_react23.useState)(0);
+  const [isMuted, setIsMuted] = (0, import_react23.useState)(false);
+  const [volume, setVolume] = (0, import_react23.useState)(1);
+  const [isFullscreen, setIsFullscreen] = (0, import_react23.useState)(false);
+  const [showControls, setShowControls] = (0, import_react23.useState)(true);
+  const [hasCompleted, setHasCompleted] = (0, import_react23.useState)(false);
+  const [showCaptions, setShowCaptions] = (0, import_react23.useState)(false);
+  (0, import_react23.useEffect)(() => {
     setHasCompleted(false);
   }, [src]);
-  const [playbackRate, setPlaybackRate] = (0, import_react22.useState)(1);
-  const [showSpeedMenu, setShowSpeedMenu] = (0, import_react22.useState)(false);
-  const lastSaveTimeRef = (0, import_react22.useRef)(0);
-  const trackRef = (0, import_react22.useRef)(null);
-  const controlsTimeoutRef = (0, import_react22.useRef)(null);
-  const lastMousePositionRef = (0, import_react22.useRef)({ x: 0, y: 0 });
-  const isUserInteracting = (0, import_react22.useCallback)(() => {
+  const [playbackRate, setPlaybackRate] = (0, import_react23.useState)(1);
+  const [showSpeedMenu, setShowSpeedMenu] = (0, import_react23.useState)(false);
+  const lastSaveTimeRef = (0, import_react23.useRef)(0);
+  const trackRef = (0, import_react23.useRef)(null);
+  const controlsTimeoutRef = (0, import_react23.useRef)(null);
+  const lastMousePositionRef = (0, import_react23.useRef)({ x: 0, y: 0 });
+  const isUserInteracting = (0, import_react23.useCallback)(() => {
     if (showSpeedMenu) {
       return true;
     }
@@ -7002,13 +7061,13 @@ var VideoPlayer = ({
     }
     return false;
   }, [showSpeedMenu]);
-  const clearControlsTimeout = (0, import_react22.useCallback)(() => {
+  const clearControlsTimeout = (0, import_react23.useCallback)(() => {
     if (controlsTimeoutRef.current) {
       clearTimeout(controlsTimeoutRef.current);
       controlsTimeoutRef.current = null;
     }
   }, []);
-  const showControlsWithTimer = (0, import_react22.useCallback)(() => {
+  const showControlsWithTimer = (0, import_react23.useCallback)(() => {
     setShowControls(true);
     clearControlsTimeout();
     if (isFullscreen) {
@@ -7023,7 +7082,7 @@ var VideoPlayer = ({
       }, CONTROLS_HIDE_TIMEOUT);
     }
   }, [isFullscreen, isPlaying, clearControlsTimeout]);
-  const handleMouseMove = (0, import_react22.useCallback)(
+  const handleMouseMove = (0, import_react23.useCallback)(
     (event) => {
       const currentX = event.clientX;
       const currentY = event.clientY;
@@ -7036,10 +7095,10 @@ var VideoPlayer = ({
     },
     [showControlsWithTimer]
   );
-  const handleMouseEnter = (0, import_react22.useCallback)(() => {
+  const handleMouseEnter = (0, import_react23.useCallback)(() => {
     showControlsWithTimer();
   }, [showControlsWithTimer]);
-  const handleMouseLeave = (0, import_react22.useCallback)(() => {
+  const handleMouseLeave = (0, import_react23.useCallback)(() => {
     const userInteracting = isUserInteracting();
     clearControlsTimeout();
     if (!isFullscreen && !userInteracting) {
@@ -7048,13 +7107,13 @@ var VideoPlayer = ({
       }, LEAVE_HIDE_TIMEOUT);
     }
   }, [isFullscreen, clearControlsTimeout, isUserInteracting]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (videoRef.current) {
       videoRef.current.volume = volume;
       videoRef.current.muted = isMuted;
     }
   }, [volume, isMuted]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const video = videoRef.current;
     if (!video) return;
     const onPlay = () => setIsPlaying(true);
@@ -7069,7 +7128,7 @@ var VideoPlayer = ({
       video.removeEventListener("ended", onEnded);
     };
   }, []);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (isPlaying) {
       showControlsWithTimer();
     } else {
@@ -7081,7 +7140,7 @@ var VideoPlayer = ({
       }
     }
   }, [isPlaying, isFullscreen, showControlsWithTimer, clearControlsTimeout]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const handleFullscreenChange = () => {
       const isCurrentlyFullscreen = !!document.fullscreenElement;
       setIsFullscreen(isCurrentlyFullscreen);
@@ -7094,7 +7153,7 @@ var VideoPlayer = ({
       document.removeEventListener("fullscreenchange", handleFullscreenChange);
     };
   }, [showControlsWithTimer]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const init = () => {
       if (!isFullscreen) {
         showControlsWithTimer();
@@ -7116,7 +7175,7 @@ var VideoPlayer = ({
       };
     }
   }, []);
-  const getInitialTime = (0, import_react22.useCallback)(() => {
+  const getInitialTime = (0, import_react23.useCallback)(() => {
     if (!autoSave || !storageKey) {
       return Number.isFinite(initialTime) && initialTime >= 0 ? initialTime : void 0;
     }
@@ -7127,14 +7186,14 @@ var VideoPlayer = ({
     if (hasValidSaved) return saved;
     return void 0;
   }, [autoSave, storageKey, src, initialTime]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const start = getInitialTime();
     if (start !== void 0 && videoRef.current) {
       videoRef.current.currentTime = start;
       setCurrentTime(start);
     }
   }, [getInitialTime]);
-  const saveProgress = (0, import_react22.useCallback)(
+  const saveProgress = (0, import_react23.useCallback)(
     (time) => {
       if (!autoSave || !storageKey) return;
       const now = Date.now();
@@ -7145,7 +7204,7 @@ var VideoPlayer = ({
     },
     [autoSave, storageKey, src]
   );
-  const togglePlayPause = (0, import_react22.useCallback)(async () => {
+  const togglePlayPause = (0, import_react23.useCallback)(async () => {
     const video = videoRef.current;
     if (!video) return;
     if (!video.paused) {
@@ -7157,7 +7216,7 @@ var VideoPlayer = ({
     } catch {
     }
   }, []);
-  const handleVolumeChange = (0, import_react22.useCallback)(
+  const handleVolumeChange = (0, import_react23.useCallback)(
     (newVolume) => {
       const video = videoRef.current;
       if (!video) return;
@@ -7176,7 +7235,7 @@ var VideoPlayer = ({
     },
     [isMuted]
   );
-  const toggleMute = (0, import_react22.useCallback)(() => {
+  const toggleMute = (0, import_react23.useCallback)(() => {
     const video = videoRef.current;
     if (!video) return;
     if (isMuted) {
@@ -7190,13 +7249,13 @@ var VideoPlayer = ({
       setIsMuted(true);
     }
   }, [isMuted, volume]);
-  const handleSeek = (0, import_react22.useCallback)((newTime) => {
+  const handleSeek = (0, import_react23.useCallback)((newTime) => {
     const video = videoRef.current;
     if (video) {
       video.currentTime = newTime;
     }
   }, []);
-  const toggleFullscreen = (0, import_react22.useCallback)(() => {
+  const toggleFullscreen = (0, import_react23.useCallback)(() => {
     const container = videoRef.current?.parentElement;
     if (!container) return;
     if (!isFullscreen && container.requestFullscreen) {
@@ -7205,23 +7264,23 @@ var VideoPlayer = ({
       document.exitFullscreen();
     }
   }, [isFullscreen]);
-  const handleSpeedChange = (0, import_react22.useCallback)((speed) => {
+  const handleSpeedChange = (0, import_react23.useCallback)((speed) => {
     if (videoRef.current) {
       videoRef.current.playbackRate = speed;
       setPlaybackRate(speed);
       setShowSpeedMenu(false);
     }
   }, []);
-  const toggleSpeedMenu = (0, import_react22.useCallback)(() => {
+  const toggleSpeedMenu = (0, import_react23.useCallback)(() => {
     setShowSpeedMenu(!showSpeedMenu);
   }, [showSpeedMenu]);
-  const toggleCaptions = (0, import_react22.useCallback)(() => {
+  const toggleCaptions = (0, import_react23.useCallback)(() => {
     if (!trackRef.current?.track || !subtitles) return;
     const newShowCaptions = !showCaptions;
     setShowCaptions(newShowCaptions);
     trackRef.current.track.mode = newShowCaptions && subtitles ? "showing" : "hidden";
   }, [showCaptions, subtitles]);
-  const checkVideoCompletion = (0, import_react22.useCallback)(
+  const checkVideoCompletion = (0, import_react23.useCallback)(
     (progressPercent) => {
       if (progressPercent >= 95 && !hasCompleted) {
         setHasCompleted(true);
@@ -7230,7 +7289,7 @@ var VideoPlayer = ({
     },
     [hasCompleted, onVideoComplete]
   );
-  const handleTimeUpdate = (0, import_react22.useCallback)(() => {
+  const handleTimeUpdate = (0, import_react23.useCallback)(() => {
     const video = videoRef.current;
     if (!video) return;
     const current = video.currentTime;
@@ -7243,17 +7302,17 @@ var VideoPlayer = ({
       checkVideoCompletion(progressPercent);
     }
   }, [duration, saveProgress, onTimeUpdate, onProgress, checkVideoCompletion]);
-  const handleLoadedMetadata = (0, import_react22.useCallback)(() => {
+  const handleLoadedMetadata = (0, import_react23.useCallback)(() => {
     if (videoRef.current) {
       setDuration(videoRef.current.duration);
     }
   }, []);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (trackRef.current?.track) {
       trackRef.current.track.mode = showCaptions && subtitles ? "showing" : "hidden";
     }
   }, [subtitles, showCaptions]);
-  (0, import_react22.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     const handleVisibilityChange = () => {
       if (document.hidden && isPlaying && videoRef.current) {
         videoRef.current.pause();
@@ -7275,13 +7334,13 @@ var VideoPlayer = ({
     };
   }, [isPlaying, clearControlsTimeout]);
   const progressPercentage = duration > 0 ? currentTime / duration * 100 : 0;
-  const getTopControlsOpacity = (0, import_react22.useCallback)(() => {
+  const getTopControlsOpacity = (0, import_react23.useCallback)(() => {
     return showControls ? "opacity-100" : "opacity-0";
   }, [showControls]);
-  const getBottomControlsOpacity = (0, import_react22.useCallback)(() => {
+  const getBottomControlsOpacity = (0, import_react23.useCallback)(() => {
     return showControls ? "opacity-100" : "opacity-0";
   }, [showControls]);
-  const handleVideoKeyDown = (0, import_react22.useCallback)(
+  const handleVideoKeyDown = (0, import_react23.useCallback)(
     (e) => {
       if (e.key) {
         e.stopPropagation();
@@ -7506,7 +7565,7 @@ var VideoPlayer = ({
 var VideoPlayer_default = VideoPlayer;
 
 // src/components/Whiteboard/Whiteboard.tsx
-var import_react23 = require("react");
+var import_react24 = require("react");
 var import_phosphor_react19 = require("phosphor-react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var IMAGE_WIDTH = 225;
@@ -7519,8 +7578,8 @@ var Whiteboard = ({
   imagesPerRow = 2,
   ...rest
 }) => {
-  const [imageErrors, setImageErrors] = (0, import_react23.useState)(/* @__PURE__ */ new Set());
-  const handleDownload = (0, import_react23.useCallback)(
+  const [imageErrors, setImageErrors] = (0, import_react24.useState)(/* @__PURE__ */ new Set());
+  const handleDownload = (0, import_react24.useCallback)(
     (image) => {
       if (onDownload) {
         onDownload(image);
@@ -7537,7 +7596,7 @@ var Whiteboard = ({
     },
     [onDownload]
   );
-  const handleImageError = (0, import_react23.useCallback)((imageId) => {
+  const handleImageError = (0, import_react24.useCallback)((imageId) => {
     setImageErrors((prev) => new Set(prev).add(imageId));
   }, []);
   const gridColsClass = images?.length === 1 ? "grid-cols-1" : {
@@ -7624,10 +7683,10 @@ var Whiteboard = ({
 var Whiteboard_default = Whiteboard;
 
 // src/components/Auth/Auth.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 var import_react_router_dom = require("react-router-dom");
 var import_jsx_runtime38 = require("react/jsx-runtime");
-var AuthContext = (0, import_react24.createContext)(void 0);
+var AuthContext = (0, import_react25.createContext)(void 0);
 var AuthProvider = ({
   children,
   checkAuthFn,
@@ -7637,12 +7696,12 @@ var AuthProvider = ({
   getSessionFn,
   getTokensFn
 }) => {
-  const [authState, setAuthState] = (0, import_react24.useState)({
+  const [authState, setAuthState] = (0, import_react25.useState)({
     isAuthenticated: false,
     isLoading: true,
     ...initialAuthState
   });
-  const checkAuth = (0, import_react24.useCallback)(async () => {
+  const checkAuth = (0, import_react25.useCallback)(async () => {
     try {
       setAuthState((prev) => ({ ...prev, isLoading: true }));
       if (!checkAuthFn) {
@@ -7673,7 +7732,7 @@ var AuthProvider = ({
       return false;
     }
   }, [checkAuthFn, getUserFn, getSessionFn, getTokensFn]);
-  const signOut = (0, import_react24.useCallback)(() => {
+  const signOut = (0, import_react25.useCallback)(() => {
     if (signOutFn) {
       signOutFn();
     }
@@ -7685,10 +7744,10 @@ var AuthProvider = ({
       tokens: void 0
     }));
   }, [signOutFn]);
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     checkAuth();
   }, [checkAuth]);
-  const contextValue = (0, import_react24.useMemo)(
+  const contextValue = (0, import_react25.useMemo)(
     () => ({
       ...authState,
       checkAuth,
@@ -7699,7 +7758,7 @@ var AuthProvider = ({
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AuthContext.Provider, { value: contextValue, children });
 };
 var useAuth = () => {
-  const context = (0, import_react24.useContext)(AuthContext);
+  const context = (0, import_react25.useContext)(AuthContext);
   if (context === void 0) {
     throw new Error("useAuth deve ser usado dentro de um AuthProvider");
   }
@@ -7839,7 +7898,7 @@ function createZustandAuthAdapter(useAuthStore) {
 }
 
 // src/components/Auth/useUrlAuthentication.ts
-var import_react25 = require("react");
+var import_react26 = require("react");
 var import_react_router_dom2 = require("react-router-dom");
 var getAuthParams = (location, extractParams) => {
   const searchParams = new URLSearchParams(location.search);
@@ -7887,7 +7946,7 @@ var handleUserData = (responseData, setUser) => {
 };
 function useUrlAuthentication(options) {
   const location = (0, import_react_router_dom2.useLocation)();
-  (0, import_react25.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     const handleAuthentication = async () => {
       const authParams = getAuthParams(location, options.extractParams);
       if (!hasValidAuthParams(authParams)) {
@@ -7926,9 +7985,9 @@ function useUrlAuthentication(options) {
 }
 
 // src/components/Auth/useApiConfig.ts
-var import_react26 = require("react");
+var import_react27 = require("react");
 function useApiConfig(api) {
-  return (0, import_react26.useMemo)(
+  return (0, import_react27.useMemo)(
     () => ({
       get: (endpoint, config) => api.get(endpoint, config)
     }),
@@ -7938,7 +7997,7 @@ function useApiConfig(api) {
 
 // src/components/Quiz/Quiz.tsx
 var import_phosphor_react20 = require("phosphor-react");
-var import_react27 = require("react");
+var import_react28 = require("react");
 
 // src/components/Quiz/useQuizStore.ts
 var import_zustand7 = require("zustand");
@@ -8508,9 +8567,6 @@ var useQuizStore = (0, import_zustand7.create)()(
   )
 );
 
-// src/assets/img/simulated-result.png
-var simulated_result_default = "./simulated-result-QN5HCUY5.png";
-
 // src/assets/img/mock-image-question.png
 var mock_image_question_default = "./mock-image-question-HEZCLFDL.png";
 
@@ -8534,9 +8590,9 @@ var getStatusStyles = (variantCorrect) => {
       return "bg-error-background border-error-300";
   }
 };
-var Quiz = (0, import_react27.forwardRef)(({ children, className, variant = "default", ...props }, ref) => {
+var Quiz = (0, import_react28.forwardRef)(({ children, className, variant = "default", ...props }, ref) => {
   const { setVariant } = useQuizStore();
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     setVariant(variant);
   }, [variant, setVariant]);
   return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
@@ -8552,11 +8608,11 @@ var Quiz = (0, import_react27.forwardRef)(({ children, className, variant = "def
     }
   );
 });
-var QuizHeaderResult = (0, import_react27.forwardRef)(
+var QuizHeaderResult = (0, import_react28.forwardRef)(
   ({ className, ...props }, ref) => {
     const { getQuestionResultByQuestionId, getCurrentQuestion } = useQuizStore();
-    const [isCorrect, setIsCorrect] = (0, import_react27.useState)(false);
-    (0, import_react27.useEffect)(() => {
+    const [isCorrect, setIsCorrect] = (0, import_react28.useState)(false);
+    (0, import_react28.useEffect)(() => {
       const cq = getCurrentQuestion();
       if (!cq) {
         setIsCorrect(false);
@@ -8587,7 +8643,7 @@ var QuizHeaderResult = (0, import_react27.forwardRef)(
     );
   }
 );
-var QuizTitle = (0, import_react27.forwardRef)(
+var QuizTitle = (0, import_react28.forwardRef)(
   ({ className, ...props }, ref) => {
     const {
       currentQuestionIndex,
@@ -8619,7 +8675,7 @@ var QuizTitle = (0, import_react27.forwardRef)(
     );
   }
 );
-var QuizSubTitle = (0, import_react27.forwardRef)(
+var QuizSubTitle = (0, import_react28.forwardRef)(
   ({ subTitle, ...props }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "px-4 pb-2 pt-6", ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: "font-bold text-lg text-text-950", children: subTitle }) });
   }
@@ -8636,7 +8692,7 @@ var QuizHeader = () => {
     }
   );
 };
-var QuizContainer = (0, import_react27.forwardRef)(({ children, className, ...props }, ref) => {
+var QuizContainer = (0, import_react28.forwardRef)(({ children, className, ...props }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     "div",
     {
@@ -8650,7 +8706,7 @@ var QuizContainer = (0, import_react27.forwardRef)(({ children, className, ...pr
     }
   );
 });
-var QuizContent = (0, import_react27.forwardRef)(({ paddingBottom }) => {
+var QuizContent = (0, import_react28.forwardRef)(({ paddingBottom }) => {
   const { getCurrentQuestion } = useQuizStore();
   const currentQuestion = getCurrentQuestion();
   const questionComponents = {
@@ -8735,15 +8791,15 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
   const currentQuestionResult = getQuestionResultByQuestionId(
     currentQuestion?.id || ""
   );
-  const prevSelectedValuesRef = (0, import_react27.useRef)([]);
-  const prevQuestionIdRef = (0, import_react27.useRef)("");
-  const allCurrentAnswerIds = (0, import_react27.useMemo)(() => {
+  const prevSelectedValuesRef = (0, import_react28.useRef)([]);
+  const prevQuestionIdRef = (0, import_react28.useRef)("");
+  const allCurrentAnswerIds = (0, import_react28.useMemo)(() => {
     return allCurrentAnswers?.map((answer) => answer.optionId) || [];
   }, [allCurrentAnswers]);
-  const selectedValues = (0, import_react27.useMemo)(() => {
+  const selectedValues = (0, import_react28.useMemo)(() => {
     return allCurrentAnswerIds?.filter((id) => id !== null) || [];
   }, [allCurrentAnswerIds]);
-  const stableSelectedValues = (0, import_react27.useMemo)(() => {
+  const stableSelectedValues = (0, import_react28.useMemo)(() => {
     const currentQuestionId = currentQuestion?.id || "";
     const hasQuestionChanged = prevQuestionIdRef.current !== currentQuestionId;
     if (hasQuestionChanged) {
@@ -8767,7 +8823,7 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
     variant,
     currentQuestionResult?.selectedOptions
   ]);
-  const handleSelectedValues = (0, import_react27.useCallback)(
+  const handleSelectedValues = (0, import_react28.useCallback)(
     (values) => {
       if (currentQuestion) {
         selectMultipleAnswer(currentQuestion.id, values);
@@ -8775,7 +8831,7 @@ var QuizMultipleChoice = ({ paddingBottom }) => {
     },
     [currentQuestion, selectMultipleAnswer]
   );
-  const questionKey = (0, import_react27.useMemo)(
+  const questionKey = (0, import_react28.useMemo)(
     () => `question-${currentQuestion?.id || "1"}`,
     [currentQuestion?.id]
   );
@@ -8830,13 +8886,13 @@ var QuizDissertative = ({ paddingBottom }) => {
     currentQuestion?.id || ""
   );
   const currentAnswer = getCurrentAnswer();
-  const textareaRef = (0, import_react27.useRef)(null);
+  const textareaRef = (0, import_react28.useRef)(null);
   const handleAnswerChange = (value) => {
     if (currentQuestion) {
       selectDissertativeAnswer(currentQuestion.id, value);
     }
   };
-  const adjustTextareaHeight = (0, import_react27.useCallback)(() => {
+  const adjustTextareaHeight = (0, import_react28.useCallback)(() => {
     if (textareaRef.current) {
       textareaRef.current.style.height = "auto";
       const scrollHeight = textareaRef.current.scrollHeight;
@@ -8846,7 +8902,7 @@ var QuizDissertative = ({ paddingBottom }) => {
       textareaRef.current.style.height = `${newHeight}px`;
     }
   }, []);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     adjustTextareaHeight();
   }, [currentAnswer, adjustTextareaHeight]);
   if (!currentQuestion) {
@@ -8985,7 +9041,7 @@ var QuizConnectDots = ({ paddingBottom }) => {
       isCorrect: false
     }
   ];
-  const [userAnswers, setUserAnswers] = (0, import_react27.useState)(() => {
+  const [userAnswers, setUserAnswers] = (0, import_react28.useState)(() => {
     if (variant === "result") {
       return mockUserAnswers;
     }
@@ -9104,8 +9160,8 @@ var QuizFill = ({ paddingBottom }) => {
       isCorrect: true
     }
   ];
-  const [answers, setAnswers] = (0, import_react27.useState)({});
-  const baseId = (0, import_react27.useId)();
+  const [answers, setAnswers] = (0, import_react28.useState)({});
+  const baseId = (0, import_react28.useId)();
   const getAvailableOptionsForSelect = (selectId) => {
     const usedOptions = Object.entries(answers).filter(([key]) => key !== selectId).map(([, value]) => value);
     return options.filter((option) => !usedOptions.includes(option));
@@ -9242,7 +9298,7 @@ var QuizImageQuestion = ({ paddingBottom }) => {
   };
   const correctRadiusRelative = calculateCorrectRadiusRelative();
   const mockUserAnswerRelative = { x: 0.72, y: 0.348 };
-  const [clickPositionRelative, setClickPositionRelative] = (0, import_react27.useState)(variant == "result" ? mockUserAnswerRelative : null);
+  const [clickPositionRelative, setClickPositionRelative] = (0, import_react28.useState)(variant == "result" ? mockUserAnswerRelative : null);
   const convertToRelativeCoordinates = (x, y, rect) => {
     const safeWidth = Math.max(rect.width, 1e-3);
     const safeHeight = Math.max(rect.height, 1e-3);
@@ -9439,12 +9495,13 @@ var QuizQuestionList = ({
     ] }, subjectId)
   ) });
 };
-var QuizFooter = (0, import_react27.forwardRef)(
+var QuizFooter = (0, import_react28.forwardRef)(
   ({
     className,
     onGoToSimulated,
     onDetailResult,
     handleFinishSimulated,
+    resultImageComponent,
     ...props
   }, ref) => {
     const {
@@ -9466,11 +9523,11 @@ var QuizFooter = (0, import_react27.forwardRef)(
     const currentAnswer = getCurrentAnswer();
     const currentQuestion = getCurrentQuestion();
     const isCurrentQuestionSkipped = currentQuestion ? getQuestionStatusFromUserAnswers(currentQuestion.id) === "skipped" : false;
-    const [alertDialogOpen, setAlertDialogOpen] = (0, import_react27.useState)(false);
-    const [modalResultOpen, setModalResultOpen] = (0, import_react27.useState)(false);
-    const [modalNavigateOpen, setModalNavigateOpen] = (0, import_react27.useState)(false);
-    const [modalResolutionOpen, setModalResolutionOpen] = (0, import_react27.useState)(false);
-    const [filterType, setFilterType] = (0, import_react27.useState)(void 0);
+    const [alertDialogOpen, setAlertDialogOpen] = (0, import_react28.useState)(false);
+    const [modalResultOpen, setModalResultOpen] = (0, import_react28.useState)(false);
+    const [modalNavigateOpen, setModalNavigateOpen] = (0, import_react28.useState)(false);
+    const [modalResolutionOpen, setModalResolutionOpen] = (0, import_react28.useState)(false);
+    const [filterType, setFilterType] = (0, import_react28.useState)(void 0);
     const unansweredQuestions = getUnansweredQuestionsFromUserAnswers();
     const allQuestions = getTotalQuestions();
     const handleFinishQuiz = async () => {
@@ -9618,14 +9675,7 @@ var QuizFooter = (0, import_react27.forwardRef)(
           hideCloseButton: true,
           size: "md",
           children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex flex-col w-full h-full items-center justify-center gap-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-              "img",
-              {
-                src: simulated_result_default,
-                alt: "Simulated Result",
-                className: "w-[282px] h-auto object-cover"
-              }
-            ),
+            resultImageComponent ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "w-[282px] h-auto", children: resultImageComponent }) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "w-[282px] h-[200px] bg-gray-100 rounded-md flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-gray-500 text-sm", children: "Imagem de resultado" }) }),
             /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex flex-col gap-2 text-center", children: [
               /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("h2", { className: "text-text-950 font-bold text-lg", children: "Voc\xEA concluiu o simulado!" }),
               /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("p", { className: "text-text-500 font-sm", children: [
@@ -9696,7 +9746,7 @@ var QuizFooter = (0, import_react27.forwardRef)(
     ] });
   }
 );
-var QuizResultHeaderTitle = (0, import_react27.forwardRef)(({ className, ...props }, ref) => {
+var QuizResultHeaderTitle = (0, import_react28.forwardRef)(({ className, ...props }, ref) => {
   const { bySimulated } = useQuizStore();
   return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
     "div",
@@ -9711,7 +9761,7 @@ var QuizResultHeaderTitle = (0, import_react27.forwardRef)(({ className, ...prop
     }
   );
 });
-var QuizResultTitle = (0, import_react27.forwardRef)(({ className, ...props }, ref) => {
+var QuizResultTitle = (0, import_react28.forwardRef)(({ className, ...props }, ref) => {
   const { getQuizTitle } = useQuizStore();
   const quizTitle = getQuizTitle();
   return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
@@ -9724,7 +9774,7 @@ var QuizResultTitle = (0, import_react27.forwardRef)(({ className, ...props }, r
     }
   );
 });
-var QuizResultPerformance = (0, import_react27.forwardRef)(
+var QuizResultPerformance = (0, import_react28.forwardRef)(
   ({ ...props }, ref) => {
     const {
       getTotalQuestions,
@@ -9848,7 +9898,7 @@ var QuizResultPerformance = (0, import_react27.forwardRef)(
     );
   }
 );
-var QuizListResult = (0, import_react27.forwardRef)(({ className, onSubjectClick, ...props }, ref) => {
+var QuizListResult = (0, import_react28.forwardRef)(({ className, onSubjectClick, ...props }, ref) => {
   const { getQuestionsGroupedBySubject } = useQuizStore();
   const groupedQuestions = getQuestionsGroupedBySubject();
   const subjectsStats = Object.entries(groupedQuestions).map(
@@ -10025,11 +10075,13 @@ var QuizListResultByMateria = ({
   VideoPlayer,
   Whiteboard,
   createZustandAuthAdapter,
+  getDeviceType,
   getRootDomain,
   getStatusBadge,
   useApiConfig,
   useAuth,
   useAuthGuard,
+  useMobile,
   useQuizStore,
   useRouteAuth,
   useToastStore,