@devvistatech/devvista-kit 0.0.9 → 0.0.10

package/dist/components/footers/footer.jsx

@@ -0,0 +1,217 @@
+"use client";
+import Link from "next/link";
+import Image from "next/image";
+import { Mail, Phone, MapPin, Facebook, X } from "lucide-react";
+import { useState, useEffect } from "react";
+import { SignIn, SignUp, SignedIn, SignedOut, SignOutButton as ClerkSignOutButton, useAuth } from "@clerk/nextjs";
+import { useStrapiAuth } from "@/lib/auth-context";
+import { motion, AnimatePresence } from "framer-motion";
+import AdminMenu from "../other/admin-menu";
+import { SignInButton, SignUpButton, SignOutButton, SettingsButton } from "../other/button";
+var baseLinks = [
+    { href: "/", label: "Home" },
+    { href: "/about", label: "About" },
+    { href: "/contact", label: "Contact" },
+    { href: "/gallery", label: "Gallery" },
+    { href: "/schedule", label: "Schedule & Rates" },
+    { href: "/faq", label: "FAQ" },
+];
+export default function Footer() {
+    var isSignedIn = useAuth().isSignedIn;
+    var _a = useStrapiAuth(), user = _a.user, authLoading = _a.authLoading, checkSession = _a.checkSession;
+    var _b = useState(false), isLoginOpen = _b[0], setIsLoginOpen = _b[1];
+    var _c = useState(false), isSignupOpen = _c[0], setIsSignupOpen = _c[1];
+    var _d = useState(false), isAdminMenuOpen = _d[0], setIsAdminMenuOpen = _d[1];
+    var _e = useState(null), error = _e[0], setError = _e[1];
+    useEffect(function () {
+        if (isSignedIn) {
+            setIsLoginOpen(false);
+            setIsSignupOpen(false);
+            setIsAdminMenuOpen(false);
+        }
+    }, [isSignedIn]);
+    useEffect(function () {
+        if (isLoginOpen || isSignupOpen || isAdminMenuOpen) {
+            document.body.style.overflow = "hidden";
+        }
+        else {
+            document.body.style.overflow = "auto";
+        }
+        return function () {
+            document.body.style.overflow = "auto";
+        };
+    }, [isLoginOpen, isSignupOpen, isAdminMenuOpen]);
+    useEffect(function () {
+        var event = new CustomEvent("modalStateChange", {
+            detail: { isOpen: isLoginOpen || isSignupOpen || isAdminMenuOpen },
+        });
+        window.dispatchEvent(event);
+    }, [isLoginOpen, isSignupOpen, isAdminMenuOpen]);
+    useEffect(function () {
+        if (!authLoading) {
+            if (isSignedIn && !user) {
+                checkSession().catch(function (err) {
+                    console.error("Footer: Failed to sync user data", err);
+                    setError("Failed to load user data. Please try logging out and back in.");
+                });
+            }
+            else {
+                setError(null);
+            }
+        }
+    }, [isSignedIn, user, authLoading, checkSession]);
+    var isAdmin = isSignedIn && !!(user === null || user === void 0 ? void 0 : user.businessAdminId) && (user === null || user === void 0 ? void 0 : user.userRole) === "admin";
+    if (authLoading) {
+        return <div>Loading...</div>;
+    }
+    if (error) {
+        return <div className="text-red-500">Error: {error}</div>;
+    }
+    return (<footer className="w-full bg-[#2D2D2D] text-gray-300 border-t border-gray-700">
+      <style jsx>{"\n        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');\n\n        :root {\n          --caviar: #2D2D2D;\n          --natural-white: #F7F7F7;\n          --blue-500: #3B82F6;\n          --blue-600: #2563EB;\n          --blue-700: #1D4ED8;\n        }\n\n        * {\n          font-family: 'Inter', sans-serif;\n        }\n\n        .glassmorphism {\n          background: rgba(255, 255, 255, 0.08);\n          backdrop-filter: blur(10px);\n          -webkit-backdrop-filter: blur(10px);\n          border: 1px solid rgba(255, 255, 255, 0.2);\n          box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);\n        }\n\n        .modal-glassmorphism {\n          background: rgba(255, 255, 255, 0.08);\n          backdrop-filter: blur(10px);\n          -webkit-backdrop-filter: blur(10px);\n          border: 2px solid transparent;\n          border-image: linear-gradient(45deg, var(--blue-500), var(--blue-600), var(--blue-700)) 1;\n          box-shadow: 0 16px 48px rgba(0, 0, 0, 0.1);\n          border-radius: 2rem;\n          max-height: 90vh;\n          overflow: hidden;\n        }\n\n        .gradient-text {\n          background: linear-gradient(90deg, var(--blue-500), var(--blue-600));\n          -webkit-background-clip: text;\n          background-clip: text;\n          color: transparent;\n        }\n\n        .contact-icon {\n          display: inline-flex;\n          align-items: center;\n          justify-content: center;\n          padding: 0.75rem;\n          border-radius: 0.5rem;\n          background: rgba(255, 255, 255, 0.1);\n          transition: color 0.2s ease, transform 0.2s ease;\n        }\n\n        .contact-icon:hover {\n          color: var(--blue-500);\n          transform: scale(1.1);\n        }\n\n        .cl-signIn-root,\n        .cl-signUp-root {\n          background: rgba(17, 24, 39, 0.95);\n          border: 1px solid #374151;\n          border-radius: 0.5rem;\n          color: white;\n          font-family: 'Inter', sans-serif;\n          max-height: 80vh;\n          overflow-y: auto;\n          max-width: 90vw;\n          box-sizing: border-box;\n        }\n\n        .cl-button {\n          background: var(--blue-500);\n        }\n\n        .cl-button:hover {\n          background: var(--blue-600);\n        }\n\n        .admin-menu-container {\n          position: relative;\n        }\n\n        @media (max-width: 640px) {\n          .cl-signIn-root,\n          .cl-signUp-root {\n            max-width: 95vw;\n            max-height: 80vh;\n            overflow-y: auto;\n            padding: 0.5rem;\n          }\n\n          .cl-signIn-root .cl-main,\n          .cl-signUp-root .cl-main {\n            font-size: 0.9rem;\n          }\n\n          .cl-signIn-root .cl-headerTitle,\n          .cl-signUp-root .cl-headerTitle {\n            font-size: 1.25rem;\n          }\n\n          .cl-signIn-root .cl-formFieldInput,\n          .cl-signUp-root .cl-formFieldInput {\n            padding: 0.5rem;\n            font-size: 0.9rem;\n            background: #1f2937;\n            color: #ffffff;\n            border: 1px solid #4b5563;\n          }\n\n          .cl-button {\n            padding: 0.5rem;\n            font-size: 0.9rem;\n          }\n\n          .modal-glassmorphism {\n            backdrop-filter: none;\n            background: rgba(255, 255, 255, 0.2);\n            padding: 1rem;\n            max-height: 85vh;\n          }\n        }\n\n        @supports not (backdrop-filter: blur(10px)) {\n          .glassmorphism,\n          .modal-glassmorphism {\n            background: rgba(255, 255, 255, 0.2);\n          }\n        }\n      "}</style>
+
+      <div className="w-full px-4 sm:px-6 lg:px-8 2xl:px-24 py-12 sm:py-16 glassmorphism">
+        <div className="grid grid-cols-1 2xl:grid-cols-3 gap-8 sm:gap-12">
+          <div className="flex flex-col items-center 2xl:items-start">
+            <Link href="/" className="flex items-center space-x-4 mb-6">
+              <Image src="/images/FitStop.png" alt="DevVista Kit Logo" width={64} height={64} className="h-20 w-20 rounded-full shadow-md transition-transform duration-300 ease-in-out transform hover:scale-105" quality={80} loading="lazy"/>
+              <div>
+                <span className="text-lg sm:text-xl 2xl:text-2xl font-extrabold text-blue-500 uppercase tracking-tight">
+                  DevVista&apos;s
+                </span>
+                <br />
+                <span className="text-2xl sm:text-3xl 2xl:text-4xl font-extrabold text-blue-500 uppercase tracking-tight">
+                  Kit
+                </span>
+              </div>
+            </Link>
+            <p className="text-sm sm:text-base 2xl:text-lg text-gray-400 text-center 2xl:text-left font-medium">
+              24/7 Fitness Access & Diverse Classes
+            </p>
+          </div>
+
+          <div className="flex flex-col items-center">
+            <h3 className="text-lg sm:text-xl 2xl:text-2xl font-bold gradient-text mb-6 uppercase tracking-tight">
+              Quick Links
+            </h3>
+            <ul className="grid grid-cols-2 gap-x-4 gap-y-3 text-center">
+              {baseLinks.map(function (link) { return (<li key={link.href}>
+                  <Link href={link.href} className="text-sm sm:text-base 2xl:text-lg font-medium uppercase text-gray-300 hover:text-blue-400 transition-all">
+                    {link.label}
+                  </Link>
+                </li>); })}
+            </ul>
+          </div>
+
+          <div className="flex flex-col items-center 2xl:items-end">
+            <h3 className="text-lg sm:text-xl 2xl:text-2xl font-bold gradient-text mb-6 uppercase tracking-tight">
+              Reach Out
+            </h3>
+            <ul className="flex space-x-4 2xl:hidden">
+              <li>
+                <a href="tel:3154154043" className="contact-icon text-gray-300" aria-label="Call 315-415-4043">
+                  <Phone className="h-6 w-6 sm:h-8 sm:w-8 text-blue-500"/>
+                </a>
+              </li>
+              <li>
+                <a href="mailto:devvistainfo@gmail.com" className="contact-icon text-gray-300" aria-label="Email devvistainfo@gmail.com">
+                  <Mail className="h-6 w-6 sm:h-8 sm:w-8 text-blue-500"/>
+                </a>
+              </li>
+              <li>
+                <a href="https://www.google.com/maps/place/215+W+Manlius+St,+East+Syracuse,+NY+13057" className="contact-icon text-gray-300" aria-label="View 215 W. Manlius St, East Syracuse, NY 13057 on Google Maps" target="_blank" rel="noopener noreferrer">
+                  <MapPin className="h-6 w-6 sm:h-8 sm:w-8 text-blue-500"/>
+                </a>
+              </li>
+              <li>
+                <a href="https://www.facebook.com/KathyCaiellosFitStop" className="contact-icon text-gray-300" aria-label="Visit our Facebook page" target="_blank" rel="noopener noreferrer">
+                  <Facebook className="h-6 w-6 sm:h-8 sm:w-8 text-blue-500"/>
+                </a>
+              </li>
+            </ul>
+            <ul className="space-y-3 text-center 2xl:text-right hidden 2xl:block">
+              <li className="text-sm sm:text-base 2xl:text-lg text-gray-300 font-medium">
+                215 W. Manlius St, East Syracuse, NY 13057
+              </li>
+              <li className="flex items-center justify-center 2xl:justify-end space-x-3">
+                <Phone className="h-4 w-4 sm:h-5 sm:w-5 text-blue-500"/>
+                <a href="tel:3152145466" className="text-sm sm:text-base 2xl:text-lg text-gray-300 font-medium hover:text-blue-400 transition-all">
+                  315-214-5466
+                </a>
+              </li>
+              <li className="flex items-center justify-center 2xl:justify-end space-x-3">
+                <Phone className="h-4 w-4 sm:h-5 sm:w-5 text-blue-500"/>
+                <a href="tel:3154154043" className="text-sm sm:text-base 2xl:text-lg text-gray-300 font-medium hover:text-blue-400 transition-all">
+                  315-415-4043
+                </a>
+              </li>
+              <li className="flex items-center justify-center 2xl:justify-end space-x-3">
+                <Mail className="h-4 w-4 sm:h-5 sm:w-5 text-blue-500"/>
+                <a href="mailto:devvistainfo@gmail.com" className="text-sm sm:text-base 2xl:text-lg text-gray-300 font-medium hover:text-blue-400 transition-all">
+                  devvistainfo@gmail.com
+                </a>
+              </li>
+              <li className="flex items-center justify-center 2xl:justify-end space-x-3">
+                <Facebook className="h-4 w-4 sm:h-5 sm:w-5 text-blue-500"/>
+                <a href="https://www.facebook.com/KathyCaiellosFitStop" className="text-sm sm:text-base 2xl:text-lg text-gray-300 font-medium hover:text-blue-400 transition-all" target="_blank" rel="noopener noreferrer">
+                  Facebook
+                </a>
+              </li>
+            </ul>
+          </div>
+        </div>
+
+        {/* Authentication Buttons Moved Above the Bordered Div */}
+        <div className="flex justify-center 2xl:justify-start mt-8 space-x-4 admin-menu-container">
+          {!authLoading && (<SignedIn>
+              <div className="flex items-center space-x-2">
+                <ClerkSignOutButton redirectUrl="/">
+                  <SignOutButton size="sm" aria-label="Logout">
+                    Logout
+                  </SignOutButton>
+                </ClerkSignOutButton>
+                {isAdmin && (<SettingsButton size="sm" onClick={function () { return setIsAdminMenuOpen(true); }} aria-label="Admin Menu">
+                  </SettingsButton>)}
+              </div>
+            </SignedIn>)}
+          {!authLoading && (<SignedOut>
+              <SignInButton size="sm" onClick={function () { return setIsLoginOpen(true); }} aria-label="Login">
+                Login
+              </SignInButton>
+              <SignUpButton size="sm" onClick={function () { return setIsSignupOpen(true); }} aria-label="Sign Up">
+                Sign Up
+              </SignUpButton>
+            </SignedOut>)}
+        </div>
+
+        {/* Bordered Div Now Only Contains Copyright Text */}
+        <div className="mt-8 pt-6 border-t border-gray-700 relative">
+          <div className="flex justify-center items-center w-full mx-auto max-w-full">
+            <p className="text-sm sm:text-base 2xl:text-lg text-gray-400 font-medium text-center">
+              © {new Date().getFullYear()} DevVista Kit. All rights reserved.
+            </p>
+          </div>
+        </div>
+      </div>
+
+      <AnimatePresence>
+        {isLoginOpen && (<motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }} exit={{ opacity: 0 }} className="fixed inset-0 bg-black/90 flex items-center justify-center z-[10000] p-4 isolate" onClick={function () { return setIsLoginOpen(false); }}>
+            <motion.div initial={{ scale: 0.9, y: 20 }} animate={{ scale: 1, y: 0 }} exit={{ scale: 0.9, y: 20 }} transition={{ type: "spring", damping: 25, stiffness: 300 }} className="relative max-w-md w-full mx-4 modal-glassmorphism" onClick={function (e) { return e.stopPropagation(); }}>
+              <button onClick={function () { return setIsLoginOpen(false); }} className="absolute right-2 md:right-14 top-2 z-50 text-gray-600 hover:text-white hover:bg-gray-700/50 rounded-full p-3 transition-all duration-200 w-12 h-12 flex items-center justify-center" aria-label="Close login modal">
+                <X className="h-6 w-6"/>
+              </button>
+              <SignIn routing="hash"/>
+            </motion.div>
+          </motion.div>)}
+        {isSignupOpen && (<motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }} exit={{ opacity: 0 }} className="fixed inset-0 bg-black/90 flex items-center justify-center z-[10000] p-4 isolate" onClick={function () { return setIsSignupOpen(false); }}>
+            <motion.div initial={{ scale: 0.9, y: 20 }} animate={{ scale: 1, y: 0 }} exit={{ scale: 0.9, y: 20 }} transition={{ type: "spring", damping: 25, stiffness: 300 }} className="relative max-w-md w-full mx-4 modal-glassmorphism" onClick={function (e) { return e.stopPropagation(); }}>
+              <button onClick={function () { return setIsSignupOpen(false); }} className="absolute right-2 md:right-14 top-2 z-50 text-gray-600 hover:text-white hover:bg-gray-700/50 rounded-full p-3 transition-all duration-200 w-12 h-12 flex items-center justify-center" aria-label="Close signup modal">
+                <X className="h-6 w-6"/>
+              </button>
+              <SignUp routing="hash"/>
+            </motion.div>
+          </motion.div>)}
+        {isAdminMenuOpen && isAdmin && (<AdminMenu onClose={function () { return setIsAdminMenuOpen(false); }}/>)}
+      </AnimatePresence>
+    </footer>);
+}

package/dist/components/navBars/navbar.jsx

@@ -0,0 +1,159 @@
+"use client";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import Link from "next/link";
+import Image from "next/image";
+import { cn } from "@/lib/utils";
+import { usePathname } from "next/navigation";
+import { useState, useRef, useEffect } from "react";
+import { AnimatePresence, motion } from "framer-motion";
+import { Facebook } from "lucide-react";
+var Navbar = function () {
+    var pathname = usePathname();
+    var _a = useState(false), isOpen = _a[0], setIsOpen = _a[1];
+    var _b = useState(false), isModalOpen = _b[0], setIsModalOpen = _b[1];
+    var menuRef = useRef(null);
+    var leftLinks = [
+        { href: "/", label: "Home" },
+        { href: "/about", label: "About" },
+        { href: "/contact", label: "Contact" },
+    ];
+    var rightLinks = [
+        { href: "/gallery", label: "Gallery" },
+        { href: "/schedule", label: "Schedule & Rates" },
+        //testing
+    ];
+    var mobileLinks = __spreadArray(__spreadArray(__spreadArray([], leftLinks, true), rightLinks, true), [
+        { href: "/faq", label: "FAQ" },
+    ], false);
+    var menuVariants = {
+        closed: { x: "100%" },
+        open: {
+            x: 0,
+            transition: { type: "spring", stiffness: 100, damping: 20 },
+        },
+    };
+    var hamburgerLine = "h-1 w-8 transition-all duration-300 ease-in-out";
+    useEffect(function () {
+        var handleModalStateChange = function (e) {
+            var customEvent = e;
+            setIsModalOpen(customEvent.detail.isOpen);
+        };
+        window.addEventListener("modalStateChange", handleModalStateChange);
+        return function () {
+            window.removeEventListener("modalStateChange", handleModalStateChange);
+        };
+    }, []);
+    useEffect(function () {
+        var handleClickOutside = function (event) {
+            if (menuRef.current &&
+                !menuRef.current.contains(event.target)) {
+                setIsOpen(false);
+            }
+        };
+        if (isOpen) {
+            document.addEventListener("mousedown", handleClickOutside);
+        }
+        else {
+            document.removeEventListener("mousedown", handleClickOutside);
+        }
+        return function () {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [isOpen]);
+    return (<nav className="fixed top-0 z-[1100] w-full bg-[#2D2D2D]/80 border-b-2 border-gray-800/50 shadow-lg py-6 transition-transform duration-300 ease-in-out" style={{
+            transform: isModalOpen && !isOpen ? "translateY(-100%)" : "translateY(0)",
+        }}>
+      <style jsx>{"\n        @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap\");\n\n        :root {\n          --jubilee: #F47C7C;\n          --natural-white: #F7F7F7;\n          --caviar: #2D2D2D;\n          --storm-cloud: #4A636E;\n          --exuberant-blue: #FF69B4;\n        }\n\n        * {\n          font-family: \"Inter\", sans-serif;\n        }\n\n        .gradient-text {\n          background: linear-gradient(90deg, var(--jubilee), --exuberant-blue));\n          -webkit-background-clip: text;\n          background-clip: text;\n          color: transparent;\n        }\n\n        @media (max-width: 360px) {\n          .mobile-menu-link {\n            font-size: 1.25rem;\n          }\n          .mobile-menu-button {\n            font-size: 1rem;\n            padding: 0.5rem 1rem;\n          }\n        }\n      "}</style>
+
+      <div className="w-full px-8 relative">
+        {/* Desktop View */}
+        <div className="hidden 2xl:flex h-28 items-center justify-center gap-8">
+          <div className="flex items-center space-x-4">
+            {leftLinks.map(function (link) { return (<Link key={link.href} href={link.href} className={cn("relative text-xl sm:text-2xl font-extrabold uppercase tracking-wider transition-all duration-300 px-4", pathname === link.href
+                ? "text-white"
+                : "text-gray-300 hover:text-blue-400 hover:scale-105", "after:content-[''] after:absolute after:bottom-[-8px] after:left-0 after:h-1 after:bg-blue-500 after:transition-all after:duration-300", pathname === link.href
+                ? "after:w-full"
+                : "after:w-0 hover:after:w-full")}>
+                {link.label}
+              </Link>); })}
+          </div>
+
+          <Link href="/" className="flex items-center relative group">
+            <Image src="/images/FitStop.png" alt="DevVista Kit Logo" width={192} height={192} className="h-40 w-40 rounded-full transition-transform group-hover:scale-110 shadow-2xl"/>
+            <div className="absolute -inset-4 bg-blue-500/30 rounded-full blur-2xl opacity-0 group-hover:opacity-100 transition-opacity"/>
+          </Link>
+
+          <div className="flex items-center space-x-4">
+            {rightLinks.map(function (link) { return (<Link key={link.href} href={link.href} className={cn("relative text-xl sm:text-2xl font-extrabold uppercase tracking-wider transition-all duration-300 px-4", pathname === link.href
+                ? "text-white"
+                : "text-gray-300 hover:text-blue-400 hover:scale-105", "after:content-[''] after:absolute after:bottom-[-8px] after:left-0 after:h-1 after:bg-blue-500 after:transition-all after:duration-300", pathname === link.href
+                ? "after:w-full"
+                : "after:w-0 hover:after:w-full")}>
+                {link.label}
+              </Link>); })}
+          </div>
+        </div>
+
+        {/* Mobile View */}
+        <div className="2xl:hidden flex h-20 items-center justify-between">
+          <Link href="/" className="flex items-center relative group">
+            <Image src="/images/FitStop.png" alt="DevVista Kit Logo" width={120} height={120} className="h-30 w-30 rounded-full transition-transform group-hover:scale-110 shadow-2xl"/>
+            <div className="absolute -inset-4 bg-gray-500/30 rounded-full blur-2xl opacity-0 group-hover:opacity-100 transition-opacity"/>
+          </Link>
+
+          <button className="flex flex-col space-y-2 p-4 relative z-[1200]" onClick={function () { return setIsOpen(!isOpen); }} aria-label="Toggle menu">
+            <span className={cn(hamburgerLine, isOpen ? "rotate-45 translate-y-3 bg-white" : "bg-blue-500")}/>
+            <span className={cn(hamburgerLine, isOpen ? "opacity-0" : "bg-blue-500")}/>
+            <span className={cn(hamburgerLine, isOpen ? "-rotate-45 -translate-y-3 bg-white" : "bg-blue-500")}/>
+          </button>
+        </div>
+
+        {/* Social Links */}
+        <div className="absolute bottom-4 right-8 flex items-center space-x-6 pr-16">
+          <a href="https://www.facebook.com/KathyCaiellosFitStop" className="flex items-center justify-center text-gray-300 hover:text-blue-400 transition-all text-lg sm:text-xl font-bold uppercase hover:scale-105" aria-label="Visit our Facebook page" role="link" target="_blank" rel="noopener noreferrer">
+            <Facebook className="ml-3 h-6 w-6 max-[1535px]:hidden"/>
+          </a>
+          <div className="hidden 2xl:block">
+            <Link href="/faq" className={cn("relative text-lg sm:text-xl font-bold uppercase tracking-wider transition-all", pathname === "/faq"
+            ? "text-white"
+            : "text-gray-300 hover:text-blue-400 hover:scale-105", "after:content-[''] after:absolute after:bottom-[-8px] after:left-0 after:h-1 after:bg-blue-500 after:transition-all after:duration-300", pathname === "/faq"
+            ? "after:w-full"
+            : "after:w-0 hover:after:w-full")}>
+              FAQ
+            </Link>
+          </div>
+        </div>
+
+        {/* Mobile Menu */}
+        <AnimatePresence>
+          {isOpen && (<motion.div ref={menuRef} variants={menuVariants} initial="closed" animate="open" exit="closed" className="fixed top-0 right-0 h-screen w-3/4 max-w-[280px] min-w-[200px] 2xl:hidden pt-24 px-4 shadow-2xl border-l-2 border-gray-700 bg-[#2D2D2D] z-[1200] overflow-y-auto">
+              <button className="absolute top-6 right-6 text-gray-300 hover:text-blue-400 transition-all z-[1210]" onClick={function () { return setIsOpen(false); }} aria-label="Close menu">
+                <svg className="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12"/>
+                </svg>
+              </button>
+
+              <div className="flex flex-col space-y-6">
+                {mobileLinks.map(function (link) { return (<Link key={link.href} href={link.href} onClick={function () { return setIsOpen(false); }} className={cn("text-xl sm:text-2xl font-extrabold uppercase tracking-wider transition-all mobile-menu-link", pathname === link.href
+                    ? "text-white"
+                    : "text-gray-300 hover:text-blue-400 hover:scale-105")}>
+                    {link.label}
+                  </Link>); })}
+                <Link href="https://www.facebook.com/KathyCaiellosFitStop" className="text-xl sm:text-2xl font-extrabold uppercase tracking-wider text-gray-300 hover:text-blue-400 transition-all hover:scale-105 mobile-menu-link" aria-label="Visit our Facebook page" role="link" target="_blank" rel="noopener noreferrer" onClick={function () { return setIsOpen(false); }}>
+                  Facebook
+                </Link>
+              </div>
+            </motion.div>)}
+        </AnimatePresence>
+      </div>
+    </nav>);
+};
+export default Navbar;

package/dist/components/other/accordion.jsx

@@ -0,0 +1,40 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDown } from 'lucide-react';
+import { cn } from '@/lib/utils';
+var Accordion = AccordionPrimitive.Root;
+var AccordionItem = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AccordionPrimitive.Item ref={ref} className={cn('border-b', className)} {...props}/>);
+});
+AccordionItem.displayName = 'AccordionItem';
+var AccordionTrigger = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
+    return (<AccordionPrimitive.Header className="flex">
+    <AccordionPrimitive.Trigger ref={ref} className={cn('flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180', className)} {...props}>
+      {children}
+      <ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200"/>
+    </AccordionPrimitive.Trigger>
+  </AccordionPrimitive.Header>);
+});
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+var AccordionContent = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
+    return (<AccordionPrimitive.Content ref={ref} className="overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down" {...props}>
+    <div className={cn('pb-4 pt-0', className)}>{children}</div>
+  </AccordionPrimitive.Content>);
+});
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/components/other/admin-menu.jsx

@@ -0,0 +1,34 @@
+// src/components/AdminMenu.tsx
+"use client";
+import Link from "next/link";
+import { motion } from "framer-motion";
+import { X } from "lucide-react";
+import { CloseButton } from "@/components/other/button";
+var menuItems = [
+    { href: "/analytics", label: "Analytics" },
+    { href: "/blog", label: "Blog" },
+    { href: "/adRequest", label: "Ad Requests" },
+];
+var modalVariants = {
+    hidden: { opacity: 0, y: "100vh" },
+    visible: { opacity: 1, y: 0, transition: { duration: 0.5, ease: [0.16, 1, 0.3, 1] } },
+    exit: { opacity: 0, y: "100vh", transition: { duration: 0.3, ease: "easeIn" } },
+};
+export default function AdminMenu(_a) {
+    var onClose = _a.onClose;
+    return (<motion.div variants={modalVariants} initial="hidden" animate="visible" exit="exit" className="fixed inset-0 bg-black/90 flex items-center justify-center z-[10000] p-4 isolate" onClick={onClose} role="dialog" aria-modal="true" aria-labelledby="admin-menu-title">
+      <div className="relative w-full max-w-2xl mx-4 p-8 md:p-12 rounded-2xl bg-blue-400/40 border border-white/20 shadow-2xl" onClick={function (e) { return e.stopPropagation(); }}>
+        <CloseButton onClick={onClose} aria-label="Close admin menu">
+          <X className="h-6 w-6 sm:h-8 sm:w-8"/>
+        </CloseButton>
+        <h3 id="admin-menu-title" className="text-2xl md:text-3xl font-bold text-white mb-6 text-center">
+          Admin Menu
+        </h3>
+        <div className="flex flex-col space-y-5">
+          {menuItems.map(function (item) { return (<Link key={item.href} href={item.href} className="block px-6 py-4 text-lg md:text-xl text-gray-200 hover:bg-gray-700 hover:text-blue-400 rounded-xl text-center transition-all" onClick={onClose}>
+              {item.label}
+            </Link>); })}
+        </div>
+      </div>
+    </motion.div>);
+}

package/dist/components/other/alert-dialog.jsx

@@ -0,0 +1,64 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cn } from '@/lib/utils';
+import { buttonVariants } from '@/components/other/button';
+var AlertDialog = AlertDialogPrimitive.Root;
+var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
+var AlertDialogPortal = AlertDialogPrimitive.Portal;
+var AlertDialogOverlay = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPrimitive.Overlay className={cn('fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', className)} {...props} ref={ref}/>);
+});
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
+var AlertDialogContent = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPortal>
+    <AlertDialogOverlay />
+    <AlertDialogPrimitive.Content ref={ref} className={cn('fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', className)} {...props}/>
+  </AlertDialogPortal>);
+});
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
+var AlertDialogHeader = function (_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<div className={cn('flex flex-col space-y-2 text-center sm:text-left', className)} {...props}/>);
+};
+AlertDialogHeader.displayName = 'AlertDialogHeader';
+var AlertDialogFooter = function (_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<div className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)} {...props}/>);
+};
+AlertDialogFooter.displayName = 'AlertDialogFooter';
+var AlertDialogTitle = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPrimitive.Title ref={ref} className={cn('text-lg font-semibold', className)} {...props}/>);
+});
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
+var AlertDialogDescription = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPrimitive.Description ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props}/>);
+});
+AlertDialogDescription.displayName =
+    AlertDialogPrimitive.Description.displayName;
+var AlertDialogAction = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPrimitive.Action ref={ref} className={cn(buttonVariants(), className)} {...props}/>);
+});
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
+var AlertDialogCancel = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AlertDialogPrimitive.Cancel ref={ref} className={cn(buttonVariants({ variant: 'outline' }), 'mt-2 sm:mt-0', className)} {...props}/>);
+});
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };

package/dist/components/other/alert.jsx

@@ -0,0 +1,41 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+var alertVariants = cva('relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground', {
+    variants: {
+        variant: {
+            default: 'bg-background text-foreground',
+            destructive: 'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+var Alert = React.forwardRef(function (_a, ref) {
+    var className = _a.className, variant = _a.variant, props = __rest(_a, ["className", "variant"]);
+    return (<div ref={ref} role="alert" className={cn(alertVariants({ variant: variant }), className)} {...props}/>);
+});
+Alert.displayName = 'Alert';
+var AlertTitle = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<h5 ref={ref} className={cn('mb-1 font-medium leading-none tracking-tight', className)} {...props}/>);
+});
+AlertTitle.displayName = 'AlertTitle';
+var AlertDescription = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<div ref={ref} className={cn('text-sm [&_p]:leading-relaxed', className)} {...props}/>);
+});
+AlertDescription.displayName = 'AlertDescription';
+export { Alert, AlertTitle, AlertDescription };

package/dist/components/other/aspect-ratio.jsx

@@ -0,0 +1,4 @@
+'use client';
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
+var AspectRatio = AspectRatioPrimitive.Root;
+export { AspectRatio };

package/dist/components/other/avatar.jsx

@@ -0,0 +1,31 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { cn } from '@/lib/utils';
+var Avatar = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Root ref={ref} className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)} {...props}/>);
+});
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+var AvatarImage = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Image ref={ref} className={cn('aspect-square h-full w-full', className)} {...props}/>);
+});
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+var AvatarFallback = React.forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Fallback ref={ref} className={cn('flex h-full w-full items-center justify-center rounded-full bg-muted', className)} {...props}/>);
+});
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/components/other/badge.jsx

@@ -0,0 +1,32 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+var badgeVariants = cva('inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', {
+    variants: {
+        variant: {
+            default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
+            secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+            destructive: 'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+            outline: 'text-foreground',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+function Badge(_a) {
+    var className = _a.className, variant = _a.variant, props = __rest(_a, ["className", "variant"]);
+    return (<div className={cn(badgeVariants({ variant: variant }), className)} {...props}/>);
+}
+export { Badge, badgeVariants };