4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:Tf04,"use client"; import { useEffect, useState } from "react"; import { cn } from "@/lib/utils"; import { Progress } from "@/components/ui/8bit/progress"; const DEFAULT_TIPS = [ "Press any key to continue...", "Did you know? Saving often prevents lost progress!", "Tip: Explore every corner for hidden treasures.", "Remember to take breaks during long gaming sessions!", "Pro tip: Read the manual for secret moves.", ]; export interface LoadingScreenProps extends React.ComponentProps<"div"> { title?: string; tips?: string[]; progress?: number; showPercentage?: boolean; tipInterval?: number; variant?: "default" | "fullscreen"; autoProgress?: boolean; autoProgressDuration?: number; } export default function LoadingScreen({ className, title = "LOADING", tips = DEFAULT_TIPS, progress = 0, showPercentage = true, tipInterval = 3000, variant = "default", autoProgress = false, autoProgressDuration = 5000, ...props }: LoadingScreenProps) { const [currentTipIndex, setCurrentTipIndex] = useState(0); const [showCursor, setShowCursor] = useState(true); const [internalProgress, setInternalProgress] = useState( autoProgress ? 0 : progress ); useEffect(() => { if (!autoProgress) { setInternalProgress(progress); return; } setInternalProgress(0); const step = 5; const steps = 100 / step; const intervalTime = autoProgressDuration / steps; const timer = setInterval(() => { setInternalProgress((prev) => { const next = prev + step; if (next >= 100) { clearInterval(timer); return 100; } return next; }); }, intervalTime); return () => clearInterval(timer); }, [autoProgress, autoProgressDuration, progress]); useEffect(() => { if (tips.length === 0) return; const tipTimer = setInterval(() => { setCurrentTipIndex((prev) => (prev + 1) % tips.length); }, tipInterval); return () => clearInterval(tipTimer); }, [tips, tipInterval]); useEffect(() => { const cursorTimer = setInterval(() => { setShowCursor((prev) => !prev); }, 530); return () => clearInterval(cursorTimer); }, []); const isFullscreen = variant === "fullscreen"; const displayProgress = autoProgress ? internalProgress : progress; const content = (

{/* Title */}

{title}

{/* Progress section */}

{showPercentage && (

{Math.round(displayProgress)}%

)}

{/* Tips section */} {tips.length > 0 && (

{tips[currentTipIndex]}

)}

); if (isFullscreen) { return (

{content}

); } return (

{content}

); } 52:Taea,import * as ProgressPrimitive from "@radix-ui/react-progress"; import { type VariantProps, cva } from "class-variance-authority"; import { cn } from "@/lib/utils"; import "@/components/ui/8bit/styles/retro.css"; export const progressVariants = cva("", { variants: { variant: { default: "", retro: "retro", }, font: { normal: "", retro: "retro", }, }, defaultVariants: { font: "retro", }, }); export interface BitProgressProps extends React.ComponentProps, VariantProps { className?: string; font?: VariantProps["font"]; progressBg?: string; } function Progress({ className, font, variant, value, progressBg, ...props }: BitProgressProps) { // Extract height from className if present const heightMatch = className?.match(/h-(\d+|\[.*?\])/); const heightClass = heightMatch ? heightMatch[0] : "h-2"; return (

{variant === "retro" && (

{Array.from({ length: 20 }).map((_, i) => { const filledSquares = Math.round(((value || 0) / 100) * 20); return (

); })}

)}

); } export { Progress }; 4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4f",null,{"namespace":"@8bitcn","registryDependencies":["progress"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"components/ui/8bit/blocks/loading-screen.tsx","content":"$51","type":"registry:block","target":"components/ui/8bit/blocks/loading-screen.tsx"},{"path":"components/ui/8bit/progress.tsx","content":"$52","type":"registry:component","target":"components/ui/8bit/progress.tsx"},{"path":"components/ui/8bit/styles/retro.css","content":"@import url(\"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap\");\n\n.retro {\n font-family:\n \"Press Start 2P\",\n system-ui,\n -apple-system,\n sans-serif;\n line-height: 1.5;\n letter-spacing: 0.5px;\n}\n\n.pixelated {\n image-rendering: pixelated;\n image-rendering: crisp-edges;\n}","type":"registry:component","target":"components/ui/8bit/styles/retro.css"}],"className":"h-[70svh] min-h-80"}]]}]