@devvistatech/devvista-kit 0.0.10 → 0.0.12

package/dist/components/addOns/functional/ImageDescCarousel.jsx

@@ -1,491 +0,0 @@
-// src/components/addOns/functional/ImageDescCarousel.tsx
-"use client";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { useState, useEffect, useRef } from "react";
-import { ActionButton, EditIconButton, TrashIconButton, CloseButton, SubmitButton, CancelButton, NextButton, PrevButton, FilterButton, DeleteButton, } from "@/components/other/button";
-import { Card } from "@/components/other/card";
-import Image from "next/image";
-import { Upload, X } from "lucide-react";
-import { motion, useScroll, useTransform } from "framer-motion";
-import { useAuth, useUser } from "@clerk/nextjs";
-var Slideshow = function (_a) {
-    var _b;
-    var images = _a.images, altPrefix = _a.altPrefix, currentSlide = _a.currentSlide, setCurrentSlide = _a.setCurrentSlide, isAdmin = _a.isAdmin, handleImageClick = _a.handleImageClick, handleEditImage = _a.handleEditImage, handleDeleteImage = _a.handleDeleteImage;
-    var slideshowRef = useRef(null);
-    var goToPrev = function () { return setCurrentSlide(function (prev) { return (prev - 1 + images.length) % images.length; }); };
-    var goToNext = function () { return setCurrentSlide(function (prev) { return (prev + 1) % images.length; }); };
-    if (!images.length || !images[currentSlide]) {
-        return (<Card className="relative h-[40vh] min-h-[400px] sm:h-[50vh] lg:h-[600px] rounded-3xl overflow-hidden bg-white/10 backdrop-blur-lg border-2 border-transparent shadow-xl w-full mx-auto max-w-3xl md:max-w-none md:mx-0 flex items-center justify-center supports-[not(backdrop-filter:blur(10px))]:bg-white/20" ref={slideshowRef}>
-        <p className="text-gray-600 text-lg">No images available</p>
-      </Card>);
-    }
-    return (<div className="relative h-[40vh] min-h-[400px] sm:h-[50vh] lg:h-[600px] rounded-3xl overflow-hidden bg-white/10 backdrop-blur-lg border-2 border-transparent shadow-xl w-full mx-auto max-w-3xl md:max-w-none md:mx-0 supports-[not(backdrop-filter:blur(10px))]:bg-white/20" ref={slideshowRef}>
-      <div className="relative w-full h-full cursor-pointer" onClick={function () { return handleImageClick(images[currentSlide]); }}>
-        <Image src={images[currentSlide].url} alt={((_b = images[currentSlide].title) === null || _b === void 0 ? void 0 : _b.trim()) &&
-            !images[currentSlide].title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/)
-            ? images[currentSlide].title
-            : altPrefix} fill className="object-cover rounded-2xl transition-transform duration-700 hover:scale-110" sizes="(max-width: 768px) 100vw, (max-width: 1024px) 50vw, 33vw" loading="lazy" quality={85}/>
-        {isAdmin && (<div className="absolute top-2 right-2 flex space-x-2 opacity-0 hover:opacity-100 transition-opacity duration-500">
-            <EditIconButton onClick={function (e) {
-                e.stopPropagation();
-                handleEditImage(images[currentSlide]);
-            }}/>
-            <TrashIconButton onClick={function (e) {
-                e.stopPropagation();
-                handleDeleteImage(images[currentSlide].documentId);
-            }}/>
-          </div>)}
-      </div>
-      {images.length > 1 && (<>
-          <PrevButton onClick={function (e) {
-                e.stopPropagation();
-                goToPrev();
-            }}/>
-          <NextButton onClick={function (e) {
-                e.stopPropagation();
-                goToNext();
-            }}/>
-        </>)}
-    </div>);
-};
-export function ImageDescCarousel(_a) {
-    var _this = this;
-    var _b, _c, _d, _e, _f, _g;
-    var user = _a.user, uploadedImages = _a.uploadedImages, setUploadedImages = _a.setUploadedImages, error = _a.error, setError = _a.setError, isLoading = _a.isLoading, setIsLoading = _a.setIsLoading, handleImageUpload = _a.handleImageUpload, handleDeleteImage = _a.handleDeleteImage;
-    var isSignedIn = useUser().isSignedIn;
-    var getToken = useAuth().getToken;
-    var _h = useState("indoor"), activeTab = _h[0], setActiveTab = _h[1];
-    var _j = useState(0), currentSlide = _j[0], setCurrentSlide = _j[1];
-    var _k = useState(false), isUploadModalOpen = _k[0], setIsUploadModalOpen = _k[1];
-    var _l = useState(false), isEditModalOpen = _l[0], setIsEditModalOpen = _l[1];
-    var _m = useState(false), isConfirmDeleteOpen = _m[0], setIsConfirmDeleteOpen = _m[1];
-    var _o = useState(null), documentIdToDelete = _o[0], setDocumentIdToDelete = _o[1];
-    var _p = useState(null), selectedImage = _p[0], setSelectedImage = _p[1];
-    var _q = useState({ file: null, title: "", description: "", category: "indoor" }), uploadForm = _q[0], setUploadForm = _q[1];
-    var _r = useState({ id: 0, documentId: "", title: "", description: "", category: "indoor", file: null }), editForm = _r[0], setEditForm = _r[1];
-    var _s = useState(false), isSubmitting = _s[0], setIsSubmitting = _s[1];
-    var containerRef = useRef(null);
-    var scrollYProgress = useScroll({
-        target: containerRef,
-        offset: ["start end", "end start"],
-    }).scrollYProgress;
-    var parallaxY = useTransform(scrollYProgress, [0, 1], [0, -50]);
-    var isAdmin = isSignedIn && !!(user === null || user === void 0 ? void 0 : user.businessAdminId) || false;
-    useEffect(function () {
-        var isAnyModalOpen = isUploadModalOpen || isEditModalOpen || isConfirmDeleteOpen || !!selectedImage;
-        if (isAnyModalOpen) {
-            document.body.style.overflow = "hidden";
-        }
-        else {
-            document.body.style.overflow = "";
-        }
-        window.dispatchEvent(new CustomEvent("modalStateChange", { detail: { isOpen: isAnyModalOpen } }));
-        return function () {
-            document.body.style.overflow = "";
-        };
-    }, [isUploadModalOpen, isEditModalOpen, isConfirmDeleteOpen, selectedImage]);
-    var filteredImages = uploadedImages.filter(function (img) { return (img.category || "none") === activeTab; });
-    var handleImageClick = function (image) {
-        setSelectedImage(image);
-    };
-    var handleCloseModal = function () {
-        setSelectedImage(null);
-    };
-    var openEditModal = function (image) {
-        var _a;
-        if (!isAdmin) {
-            setError("Unauthorized: Only admins can edit images");
-            return;
-        }
-        setEditForm({
-            id: image.id,
-            documentId: image.documentId,
-            title: ((_a = image.title) === null || _a === void 0 ? void 0 : _a.trim()) && !image.title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/) ? image.title : "",
-            description: image.description || "",
-            category: image.category && image.category !== "none" ? image.category : "indoor",
-            file: null,
-        });
-        setIsEditModalOpen(true);
-    };
-    var handleCloseEditModal = function () {
-        setIsEditModalOpen(false);
-        setEditForm({ id: 0, documentId: "", title: "", description: "", category: "indoor", file: null });
-    };
-    var handleCloseUploadModal = function () {
-        setIsUploadModalOpen(false);
-        setUploadForm({ file: null, title: "", description: "", category: "indoor" });
-    };
-    var openConfirmDelete = function (documentId) {
-        if (!isAdmin) {
-            setError("Unauthorized: Only admins can delete images");
-            return;
-        }
-        setDocumentIdToDelete(documentId);
-        setIsConfirmDeleteOpen(true);
-    };
-    var handleConfirmDelete = function () { return __awaiter(_this, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    if (!isAdmin) {
-                        setError("Unauthorized: Only admins can delete images");
-                        setIsConfirmDeleteOpen(false);
-                        return [2 /*return*/];
-                    }
-                    if (!(documentIdToDelete !== null)) return [3 /*break*/, 4];
-                    setIsLoading(true);
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, , 3, 4]);
-                    return [4 /*yield*/, handleDeleteImage(documentIdToDelete)];
-                case 2:
-                    _a.sent();
-                    return [3 /*break*/, 4];
-                case 3:
-                    setIsLoading(false);
-                    setIsConfirmDeleteOpen(false);
-                    setDocumentIdToDelete(null);
-                    return [7 /*endfinally*/];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    var handleCancelDelete = function () {
-        setIsConfirmDeleteOpen(false);
-        setDocumentIdToDelete(null);
-    };
-    var handleEditImage = function (e) { return __awaiter(_this, void 0, void 0, function () {
-        var token, formData, response, errorData, data, err_1;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    e.preventDefault();
-                    if (!isAdmin) {
-                        console.error("ImageDescCarousel: Unauthorized edit attempt", {
-                            isSignedIn: isSignedIn,
-                            businessAdminId: user === null || user === void 0 ? void 0 : user.businessAdminId,
-                        });
-                        setError("Unauthorized: Only admins can edit images");
-                        return [2 /*return*/];
-                    }
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, 7, 8, 9]);
-                    setIsLoading(true);
-                    setIsSubmitting(true);
-                    return [4 /*yield*/, getToken()];
-                case 2:
-                    token = _a.sent();
-                    if (!token) {
-                        console.error("ImageDescCarousel: No authentication token available");
-                        setError("Authentication error: Please log in again");
-                        return [2 /*return*/];
-                    }
-                    formData = new FormData();
-                    formData.append("documentId", editForm.documentId);
-                    formData.append("title", editForm.title || "Image ".concat(new Date().toISOString()));
-                    formData.append("description", editForm.description || "");
-                    formData.append("category", editForm.category);
-                    if (editForm.file) {
-                        formData.append("file", editForm.file);
-                    }
-                    return [4 /*yield*/, fetch("/api/gallery-data", {
-                            method: "PUT",
-                            headers: {
-                                Authorization: "Bearer ".concat(token),
-                            },
-                            body: formData,
-                        })];
-                case 3:
-                    response = _a.sent();
-                    if (!!response.ok) return [3 /*break*/, 5];
-                    return [4 /*yield*/, response.json()];
-                case 4:
-                    errorData = _a.sent();
-                    console.error("ImageDescCarousel: Edit failed", { status: response.status, errorData: errorData });
-                    if (response.status === 401) {
-                        setError("Authentication error: Please log in again");
-                        return [2 /*return*/];
-                    }
-                    throw new Error(errorData.error || "Failed to edit image (Status: ".concat(response.status, ")"));
-                case 5: return [4 /*yield*/, response.json()];
-                case 6:
-                    data = (_a.sent()).data;
-                    setUploadedImages(data || []);
-                    setError(null);
-                    setIsEditModalOpen(false);
-                    setEditForm({ id: 0, documentId: "", title: "", description: "", category: "indoor", file: null });
-                    return [3 /*break*/, 9];
-                case 7:
-                    err_1 = _a.sent();
-                    console.error("ImageDescCarousel: Edit Error", err_1);
-                    setError(err_1 instanceof Error ? err_1.message : "Failed to edit image");
-                    return [3 /*break*/, 9];
-                case 8:
-                    setIsLoading(false);
-                    setIsSubmitting(false);
-                    return [7 /*endfinally*/];
-                case 9: return [2 /*return*/];
-            }
-        });
-    }); };
-    var sectionVariants = {
-        hidden: { opacity: 0 },
-        visible: {
-            opacity: 1,
-            transition: { duration: 0.8, ease: [0.16, 1, 0.3, 1], staggerChildren: 0.1 },
-        },
-    };
-    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" } },
-    };
-    return (<div className="w-full">
-      {/* Gallery Section */}
-      <motion.section variants={sectionVariants} initial="hidden" whileInView="visible" viewport={{ once: true }} className="relative py-12 sm:py-16 lg:pb-24 w-full bg-gray-50/50 backdrop-blur-sm" ref={containerRef} style={{ y: parallaxY }}>
-        <div className="relative z-10 w-full px-4 sm:px-6 lg:px-8">
-          {error && <p className="text-red-600 text-lg text-center mb-8">{error}</p>}
-          {user && !isAdmin && (<p className="text-yellow-600 text-lg text-center mb-8">
-              You are logged in but do not have admin privileges.
-            </p>)}
-          {isAdmin && (<div className="flex justify-center mb-12">
-              <ActionButton onClick={function () { return setIsUploadModalOpen(true); }} className="flex items-center" disabled={isLoading || isSubmitting}>
-                <Upload className="mr-2 h-4 w-4"/>
-                Upload New Image
-              </ActionButton>
-            </div>)}
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-6 sm:gap-8 lg:gap-12 items-start">
-            <div className="h-auto min-h-[600px] bg-white/10 backdrop-blur-lg border-2 border-transparent shadow-xl p-6 sm:p-8 lg:p-10 rounded-3xl flex flex-col space-y-4 sm:space-y-6 order-2 max-w-3xl mx-auto md:max-w-none md:mx-0 md:order-1 supports-[not(backdrop-filter:blur(10px))]:bg-white/20">
-              <h2 className="text-2xl sm:text-3xl lg:text-4xl font-extrabold text-gray-900">
-                {((_c = (_b = filteredImages[currentSlide]) === null || _b === void 0 ? void 0 : _b.title) === null || _c === void 0 ? void 0 : _c.trim()) &&
-            !((_d = filteredImages[currentSlide]) === null || _d === void 0 ? void 0 : _d.title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/))
-            ? filteredImages[currentSlide].title
-            : "Image Gallery"}
-              </h2>
-              <div className="text-sm sm:text-base lg:text-lg text-gray-700">
-                {filteredImages.length > 0 && currentSlide >= 0 && currentSlide < filteredImages.length ? ((filteredImages[currentSlide].description || "")
-            .split("\n")
-            .filter(function (paragraph) { return paragraph.trim() !== ""; })
-            .map(function (paragraph, index) { return (<p key={index} className="mb-4">
-                        {paragraph}
-                      </p>); }) || <p className="mb-4">No description available.</p>) : (<p className="mb-4">No description available.</p>)}
-              </div>
-            </div>
-            <div className="order-1 md:order-2">
-              <Slideshow images={filteredImages} altPrefix="Image Gallery" currentSlide={currentSlide} setCurrentSlide={setCurrentSlide} isAdmin={isAdmin} handleImageClick={handleImageClick} handleEditImage={openEditModal} handleDeleteImage={openConfirmDelete}/>
-              <div className="flex flex-wrap justify-center gap-2 sm:gap-4 mt-6 z-20">
-                {["indoor", "outdoor", "commercial"].map(function (tab) { return (<FilterButton key={tab} isActive={activeTab === tab} onClick={function () {
-                setActiveTab(tab);
-                setCurrentSlide(0);
-            }}>
-                    {tab.charAt(0).toUpperCase() + tab.slice(1)}
-                  </FilterButton>); })}
-              </div>
-            </div>
-          </div>
-        </div>
-      </motion.section>
-
-      {/* Upload Modal */}
-      {isAdmin && isUploadModalOpen && (<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={handleCloseUploadModal} aria-modal="true" role="dialog">
-          <div className="relative max-w-5xl w-full mx-4 p-6 bg-gray-800/50 border border-gray-700/50 rounded-lg shadow-lg max-h-[90vh] overflow-y-auto" onClick={function (e) { return e.stopPropagation(); }}>
-            <CloseButton onClick={handleCloseUploadModal}>
-              <X className="h-6 w-6 sm:h-8 sm:w-8"/>
-            </CloseButton>
-            <h3 className="text-xl font-bold text-white mb-4">Upload Image</h3>
-            <form onSubmit={function (e) {
-                setIsSubmitting(true);
-                handleImageUpload(e, uploadForm.file, uploadForm.title, uploadForm.description, uploadForm.category).then(function () {
-                    handleCloseUploadModal();
-                    setIsSubmitting(false);
-                });
-            }} className="space-y-4">
-              <div>
-                <label htmlFor="image-upload" className="block text-sm font-medium text-gray-300 mb-1">
-                  Choose Image
-                </label>
-                <input type="file" accept="image/jpeg,image/png,image/gif" onChange={function (e) { var _a; return setUploadForm(__assign(__assign({}, uploadForm), { file: ((_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0]) || null })); }} className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" id="image-upload" disabled={isSubmitting}/>
-                {uploadForm.file && (<p className="mt-2 text-gray-300 text-sm max-[320px]:text-xs">Selected: {uploadForm.file.name}</p>)}
-              </div>
-              <div>
-                <label htmlFor="image-title" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Image Title (optional)
-                </label>
-                <input id="image-title" value={uploadForm.title} onChange={function (e) { return setUploadForm(__assign(__assign({}, uploadForm), { title: e.target.value })); }} placeholder="Enter image title" className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}/>
-              </div>
-              <div>
-                <label htmlFor="image-description" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Image Description (optional)
-                </label>
-                <textarea id="image-description" value={uploadForm.description} onChange={function (e) { return setUploadForm(__assign(__assign({}, uploadForm), { description: e.target.value })); }} placeholder="Enter image description" className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm min-h-[80px] max-[768px]:text-sm max-[768px]:min-h-[80px] max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}/>
-              </div>
-              <div>
-                <label htmlFor="image-category" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Category
-                </label>
-                <select id="image-category" value={uploadForm.category} onChange={function (e) {
-                return setUploadForm(__assign(__assign({}, uploadForm), { category: e.target.value }));
-            }} className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}>
-                  <option value="indoor">Indoor</option>
-                  <option value="outdoor">Outdoor</option>
-                  <option value="commercial">Commercial</option>
-                  {/* Add project-specific categories, e.g.:
-            <option value="landscape-boulders">Landscape Boulders</option>
-            */}
-                </select>
-              </div>
-              <div className="flex flex-col sm:flex-row space-y-2 sm:space-y-0 sm:space-x-3">
-                <SubmitButton type="submit" disabled={isSubmitting || !uploadForm.file}>
-                  {isSubmitting ? "Uploading..." : "Upload"}
-                </SubmitButton>
-                <CancelButton onClick={handleCloseUploadModal} disabled={isSubmitting}/>
-              </div>
-              {error && <p className="text-red-400 text-sm font-medium max-[320px]:text-xs">{error}</p>}
-            </form>
-          </div>
-        </motion.div>)}
-
-      {/* Edit Modal */}
-      {isAdmin && isEditModalOpen && (<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={handleCloseEditModal} aria-modal="true" role="dialog">
-          <div className="relative max-w-5xl w-full mx-4 p-6 bg-gray-800/50 border border-gray-700/50 rounded-lg shadow-lg max-h-[90vh] overflow-y-auto" onClick={function (e) { return e.stopPropagation(); }}>
-            <CloseButton onClick={handleCloseEditModal}>
-              <X className="h-6 w-6 sm:h-8 sm:w-8"/>
-            </CloseButton>
-            <h3 className="text-xl font-bold text-white mb-4">Edit Image</h3>
-            <form onSubmit={handleEditImage} className="space-y-4">
-              <div>
-                <label htmlFor="edit-image" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Replace Image (optional)
-                </label>
-                <input id="edit-image" type="file" accept="image/jpeg,image/png,image/gif" onChange={function (e) { var _a; return setEditForm(__assign(__assign({}, editForm), { file: ((_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0]) || null })); }} className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}/>
-                {editForm.file && (<p className="mt-2 text-gray-300 text-sm max-[320px]:text-xs">Selected: {editForm.file.name}</p>)}
-              </div>
-              <div>
-                <label htmlFor="edit-title" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Image Title (optional)
-                </label>
-                <input id="edit-title" value={editForm.title} onChange={function (e) { return setEditForm(__assign(__assign({}, editForm), { title: e.target.value })); }} placeholder="Enter image title" className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}/>
-              </div>
-              <div>
-                <label htmlFor="edit-description" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Image Description (optional)
-                </label>
-                <textarea id="edit-description" value={editForm.description} onChange={function (e) { return setEditForm(__assign(__assign({}, editForm), { description: e.target.value })); }} placeholder="Enter image description" className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm min-h-[80px] max-[768px]:text-sm max-[768px]:min-h-[80px] max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}/>
-              </div>
-              <div>
-                <label htmlFor="edit-category" className="block text-sm font-medium text-gray-300 mb-1 max-[320px]:text-xs">
-                  Category
-                </label>
-                <select id="edit-category" value={editForm.category} onChange={function (e) {
-                return setEditForm(__assign(__assign({}, editForm), { category: e.target.value }));
-            }} className="w-full p-2 rounded-md bg-gray-700 text-white border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm max-[768px]:text-sm max-[320px]:text-xs max-[320px]:p-2" disabled={isSubmitting}>
-                  <option value="indoor">Indoor</option>
-                  <option value="outdoor">Outdoor</option>
-                  <option value="commercial">Commercial</option>
-                  {/* Add project-specific categories, e.g.:
-            <option value="landscape-boulders">Landscape Boulders</option>
-            */}
-                </select>
-              </div>
-              <div className="flex flex-col sm:flex-row space-y-2 sm:space-y-0 sm:space-x-3">
-                <SubmitButton type="submit" disabled={isSubmitting}>
-                  {isSubmitting ? "Saving..." : "Save"}
-                </SubmitButton>
-                <CancelButton onClick={handleCloseEditModal} disabled={isSubmitting}/>
-              </div>
-              {error && <p className="text-red-400 text-sm font-medium max-[320px]:text-xs">{error}</p>}
-            </form>
-          </div>
-        </motion.div>)}
-
-      {/* Delete Confirmation Modal */}
-      {isAdmin && isConfirmDeleteOpen && (<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={handleCancelDelete} aria-modal="true" role="dialog">
-          <div className="relative max-w-sm w-full mx-4 p-6 bg-gray-800/50 border border-gray-700/50 rounded-lg shadow-lg max-h-[90vh] overflow-y-auto" onClick={function (e) { return e.stopPropagation(); }}>
-            <CloseButton onClick={handleCancelDelete}>
-              <X className="h-6 w-6 sm:h-8 sm:w-8"/>
-            </CloseButton>
-            <h3 className="text-xl font-bold text-white mb-4">Confirm Deletion</h3>
-            <p className="text-gray-300 mb-6">Are you sure you want to delete this image?</p>
-            <div className="flex flex-col sm:flex-row space-y-2 sm:space-y-0 sm:space-x-3">
-              <DeleteButton onClick={handleConfirmDelete} disabled={isSubmitting}>
-                {isSubmitting ? "Deleting..." : "Delete"}
-              </DeleteButton>
-              <CancelButton onClick={handleCancelDelete} disabled={isSubmitting}/>
-            </div>
-          </div>
-        </motion.div>)}
-
-      {/* View Image Modal */}
-      {selectedImage && (<motion.div variants={modalVariants} initial="hidden" animate="visible" exit="exit" className="fixed inset-0 bg-black/90 flex items-center justify-center z-[10001] p-2 sm:p-4 isolate" onClick={handleCloseModal} role="dialog" aria-modal="true" aria-labelledby="modal-image">
-          <div className="relative max-w-5xl w-full mx-2 sm:mx-4 max-h-[90vh] bg-gray-800/50 border border-gray-700/50 rounded-2xl shadow-lg overflow-hidden" onClick={function (e) { return e.stopPropagation(); }}>
-            <CloseButton variant="close-form" onClick={handleCloseModal}>
-              <X className="h-6 w-6 sm:h-8 sm:w-8"/>
-            </CloseButton>
-            <div className="relative w-full h-[70vh] sm:h-[80vh]">
-              <Image src={selectedImage.url} alt={((_e = selectedImage.title) === null || _e === void 0 ? void 0 : _e.trim()) &&
-                !selectedImage.title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/)
-                ? selectedImage.title
-                : "Gallery image"} fill className="object-contain rounded-2xl" quality={85}/>
-              {(((_f = selectedImage.title) === null || _f === void 0 ? void 0 : _f.trim()) &&
-                !selectedImage.title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/) ||
-                selectedImage.description) && (<div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent p-3 sm:p-4">
-                  {((_g = selectedImage.title) === null || _g === void 0 ? void 0 : _g.trim()) &&
-                    !selectedImage.title.match(/Image \d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z/) && (<h3 className="text-lg sm:text-xl md:text-2xl font-bold text-white drop-shadow-lg">
-                        {selectedImage.title}
-                      </h3>)}
-                  {selectedImage.description && (<p className="text-xs sm:text-sm md:text-base text-gray-200 drop-shadow-md line-clamp-2">
-                      {selectedImage.description}
-                    </p>)}
-                </div>)}
-            </div>
-          </div>
-        </motion.div>)}
-    </div>);
-}

package/dist/components/addOns/functional/NewUserAnalytics.jsx

@@ -1,71 +0,0 @@
-// components/ui/new-users-chart.tsx
-"use client";
-import { Line } from "react-chartjs-2";
-import { Chart as ChartJS, CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend } from "chart.js";
-ChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend);
-var formatMonth = function (date) {
-    var year = date.slice(0, 4);
-    var month = parseInt(date.slice(4, 6), 10);
-    return new Date(parseInt(year), month - 1).toLocaleDateString("en-US", { month: "short", year: "numeric" });
-};
-export function NewUsersChart(_a) {
-    var data = _a.data, currentYear = _a.currentYear;
-    var chartData = {
-        labels: data.map(function (row) { return formatMonth(row.date); }),
-        datasets: [
-            {
-                label: "New Users",
-                data: data.map(function (row) { return row.newUsers; }),
-                borderColor: "#34D399",
-                backgroundColor: "rgba(52, 211, 153, 0.5)",
-                tension: 0.1,
-                pointRadius: 3,
-                borderWidth: 2,
-            },
-        ],
-    };
-    var chartOptions = {
-        responsive: true,
-        maintainAspectRatio: false,
-        plugins: {
-            legend: {
-                position: "top",
-                labels: {
-                    color: "#9CA3AF",
-                },
-            },
-            title: {
-                display: false,
-            },
-            tooltip: {
-                backgroundColor: "#1F2937",
-                titleColor: "#E5E7EB",
-                bodyColor: "#E5E7EB",
-            },
-        },
-        scales: {
-            x: {
-                grid: {
-                    display: false,
-                },
-                ticks: {
-                    color: "#9CA3AF",
-                },
-            },
-            y: {
-                grid: {
-                    color: "rgba(255, 255, 255, 0.1)",
-                },
-                ticks: {
-                    color: "#9CA3AF",
-                },
-            },
-        },
-    };
-    return (<section className="bg-gray-800/50 backdrop-blur-md rounded-2xl shadow-lg p-6 border border-gray-700/50 hover:border-blue-500/50 transition-colors">
-      <h2 className="text-2xl font-bold text-blue-200 mb-6">New Users by Month ({currentYear})</h2>
-      {data.length === 0 ? (<p className="text-gray-400 text-center py-4">No data available</p>) : (<div className="h-[300px]">
-          <Line data={chartData} options={chartOptions}/>
-        </div>)}
-    </section>);
-}

package/dist/components/addOns/functional/ScheduleCarousel.jsx

@@ -1,68 +0,0 @@
-"use client";
-import { useState, useEffect } from "react";
-import { Card } from "@/components/other/card";
-export function ScheduleCarousel(_a) {
-    var weeklySchedule = _a.weeklySchedule, backgroundImages = _a.backgroundImages, error = _a.error;
-    var _b = useState(0), currentDayIndex = _b[0], setCurrentDayIndex = _b[1];
-    useEffect(function () {
-        backgroundImages.forEach(function (image) {
-            var img = new Image();
-            img.src = image;
-        });
-        var days = Object.keys(weeklySchedule);
-        var interval = setInterval(function () {
-            setCurrentDayIndex(function (prev) { return (prev === days.length - 1 ? 0 : prev + 1); });
-        }, 5000);
-        return function () { return clearInterval(interval); };
-    }, [weeklySchedule, backgroundImages]);
-    return (<div className="w-full bg-black z-0">
-      <section className="w-full py-16 sm:py-24 px-4 sm:px-8 relative">
-        <style jsx>{"\n          .schedule-background {\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background-size: cover;\n            background-position: center;\n            transition: opacity 0.5s ease-in-out;\n            opacity: 0;\n          }\n\n          .schedule-background.active {\n            opacity: 1;\n          }\n\n          .schedule-overlay {\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background: rgba(0, 0, 0, 0.3);\n            z-index: 1;\n          }\n        "}</style>
-
-        <div className="absolute inset-0 z-0 w-full h-full">
-          {backgroundImages.map(function (image, index) { return (<div key={index} className={"schedule-background ".concat(index === currentDayIndex ? "active" : "")} style={{ backgroundImage: "url(".concat(image, ")") }}/>); })}
-          <div className="schedule-overlay"/>
-        </div>
-
-        <div className="relative z-10 h-[600px] sm:h-[800px] overflow-hidden">
-          {error ? (<div className="text-center !text-white text-4xl sm:text-5xl font-semibold h-full flex items-center justify-center max-w-full" style={{ textShadow: "2px 2px 4px rgba(0, 0, 0, 0.5)" }}>
-              {error}
-            </div>) : ((function () {
-            var days = Object.entries(weeklySchedule);
-            var _a = days[currentDayIndex], day = _a[0], classes = _a[1];
-            return (<Card className="w-full max-w-full p-6 sm:p-10 md:p-16 flex flex-col items-center justify-center h-full overflow-hidden bg-transparent border-none">
-                  <h3 className="text-5xl sm:text-6xl md:text-8xl font-bold text-white text-center tracking-tight" style={{
-                    textShadow: "\n                        -1px -1px 0 #000,\n                        1px -1px 0 #000,\n                        -1px 1px 0 #000,\n                        1px 1px 0 #000,\n                        0 2px 4px rgba(0, 0, 0, 0.4)\n                      ",
-                    fontSize: "clamp(2.5rem, 10vw, 5rem)",
-                }}>
-                    {day}
-                  </h3>
-
-                  <ul className="space-y-6 font-semibold text-center mt-8 max-w-full">
-                    {classes.length > 0 ? (classes.map(function (cls) { return (<li key={"".concat(cls.startTime, "-").concat(cls.endTime)} className="text-2xl sm:text-3xl md:text-4xl text-white break-words" style={{
-                        textShadow: "\n                              -1px -1px 0 #000,\n                              1px -1px 0 #000,\n                              -1px 1px 0 #000,\n                              1px 1px 0 #000,\n                              0 2px 4px rgba(0, 0, 0, 0.4),\n                              2px 2px 10px rgba(0, 0, 0, 0.6)\n                            ",
-                        fontSize: "clamp(1.5rem, 6vw, 2.5rem)",
-                    }}>
-                          <span className="font-semibold text-[#FF69B4]">{cls.name}</span> -{" "}
-                          {new Date("2023-01-01 ".concat(cls.startTime)).toLocaleTimeString("en-US", {
-                        hour: "numeric",
-                        minute: "2-digit",
-                    })}{" "}
-                          to{" "}
-                          {new Date("2023-01-01 ".concat(cls.endTime)).toLocaleTimeString("en-US", {
-                        hour: "numeric",
-                        minute: "2-digit",
-                    })}
-                        </li>); })) : (<li className="text-2xl sm:text-3xl md:text-4xl text-white font-semibold" style={{
-                        textShadow: "\n                            -1px -1px 0 #000,\n                            1px -1px 0 #000,\n                            -1px 1px 0 #000,\n                            1px 1px 0 #000,\n                            0 2px 4px rgba(0, 0, 0, 0.4),\n                            2px 2px 10px rgba(0, 0, 0, 0.6)\n                          ",
-                        fontSize: "clamp(1.5rem, 6vw, 2.5rem)",
-                    }}>
-                        No classes
-                      </li>)}
-                  </ul>
-                </Card>);
-        })())}
-        </div>
-      </section>
-    </div>);
-}