@123usmanhaider321/ui 0.1.6 → 1.0.0

package/dist/components/EventAddForm/AddEventLayout.js

@@ -1,227 +0,0 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import React__default from "react";
-import { AnimatePresence, motion } from "framer-motion";
-import { ChevronLeft, Check } from "lucide-react";
-import LoadingOverlay from "../Spinner/spinner.js";
-import Alert from "../Alert/Alert.js";
-import ConfirmationModal from "../ConfirmationModal/ConfirmationModal.js";
-import EventSubmissionConfirmationModal from "./components/EventSubmissionConfirmationModal.js";
-import { cn } from "../../utils/cn.js";
-import Tooltip from "../ui/Tooltip.js";
-import { Button } from "../Button/Button.js";
-const AddEventLayout = ({
-  steps,
-  currentStep,
-  maxStepReached,
-  isNavigationBlocked,
-  onJumpToStep,
-  children,
-  onBack,
-  onNext,
-  onSaveDraft,
-  isProcessing,
-  isSubmitting,
-  isSyncingData,
-  isNavigating,
-  isChildBusy,
-  edit,
-  isFetchError,
-  isFetching,
-  onRetryFetch,
-  alert,
-  onCloseAlert,
-  submissionModalProps,
-  switchConfirmationModalProps,
-  eventId,
-  onRouteBack,
-  exitConfirmationModalProps,
-  eventData,
-  mode
-}) => {
-  const isFirstStep = steps.length > 0 && currentStep === steps[0].id;
-  const isLastStep = steps.length > 0 && currentStep === steps[steps.length - 1].id;
-  return /* @__PURE__ */ jsxs("div", { id: "add-event-layout", className: "layout min-h-screen bg-white flex flex-col items-center", children: [
-    /* @__PURE__ */ jsx(
-      EventSubmissionConfirmationModal,
-      {
-        open: submissionModalProps.open,
-        eventId: eventId || "",
-        edit,
-        eventData,
-        setOpen: submissionModalProps.setOpen,
-        onSubmit: submissionModalProps.onSubmit,
-        onSuccess: submissionModalProps.onSuccess,
-        isFinalStep: submissionModalProps.isFinalStep,
-        showPreview: submissionModalProps.showPreview,
-        isPolluted: submissionModalProps == null ? void 0 : submissionModalProps.isPolluted
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Alert,
-      {
-        isVisible: alert.show,
-        message: alert.message,
-        type: alert.type,
-        onClose: onCloseAlert
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      ConfirmationModal,
-      {
-        open: switchConfirmationModalProps.open,
-        title: switchConfirmationModalProps.title,
-        description: switchConfirmationModalProps.description,
-        onClose: switchConfirmationModalProps.onClose,
-        onConfirm: switchConfirmationModalProps.onConfirm,
-        confirmText: "Confirm & Proceed",
-        cancelText: "Cancel"
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      ConfirmationModal,
-      {
-        open: exitConfirmationModalProps.open,
-        title: "Discard changes?",
-        description: "You have unsaved changes. Are you sure you want to discard them and leave?",
-        onClose: exitConfirmationModalProps.onClose,
-        onConfirm: exitConfirmationModalProps.onConfirm,
-        confirmText: "Discard & leave",
-        cancelText: "Cancel"
-      }
-    ),
-    edit && isFetchError && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-[10000] bg-[rgba(0,0,0,0.05)] backdrop-filter backdrop-blur-sm flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "p-10 rounded-xl bg-white flex items-center justify-center flex-col gap-4", children: [
-      /* @__PURE__ */ jsx("p", { className: "text-error-500 font-medium", children: "Failed to load event details." }),
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          onClick: onRetryFetch,
-          children: "Retry"
-        }
-      )
-    ] }) }),
-    (edit && isFetching || isProcessing || isSubmitting || isSyncingData || isNavigating) && /* @__PURE__ */ jsx(LoadingOverlay, {}),
-    /* @__PURE__ */ jsxs("div", { className: cn("w-full relative space-y-10", steps.length > 1 ? "sm:mb-20 mb-10" : "mb-6"), children: [
-      /* @__PURE__ */ jsx("div", { className: "w-full py-4 sm:py-8 px-4 sm:px-20", children: /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "flex items-center gap-4 text-grey-500 hover:text-grey-900 transition-colors duration-200",
-          children: [
-            /* @__PURE__ */ jsx(
-              Tooltip,
-              {
-                placement: "right",
-                content: /* @__PURE__ */ jsx("div", { className: "max-w-max", children: /* @__PURE__ */ jsx("p", { className: "text-white text-xs", children: "Go back to event listing" }) }),
-                triggerClassName: "w-max h-max flex items-center justify-center",
-                children: /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    onClick: onRouteBack,
-                    disabled: isChildBusy || isNavigating,
-                    className: "w-11 h-9 rounded-lg input-border flex items-center justify-center text-gray-800 hover:text-gray-900 disabled:opacity-50 disabled:cursor-not-allowed",
-                    children: /* @__PURE__ */ jsx(ChevronLeft, { className: "w-5 h-5" })
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { className: "lg:text-[30px] text-2xl font-semibold text-grey-800", children: mode === "questions" ? "Edit Questions" : mode === "social" ? "Edit Social Profiles" : (edit ? "Edit" : "Create") + " Event" })
-          ]
-        }
-      ) }),
-      steps.length > 1 && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-full max-w-[800px] mx-auto px-4 sm:px-20", children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", children: steps.map((step, index) => {
-        const isActive = step.id === currentStep;
-        const isCompleted = step.id < currentStep;
-        const isClickable = !isNavigationBlocked && !isChildBusy && step.id < currentStep;
-        return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
-          /* @__PURE__ */ jsxs(
-            motion.div,
-            {
-              layout: true,
-              initial: { opacity: 0, scale: 0.8, width: 0 },
-              animate: { opacity: 1, scale: 1, width: "auto" },
-              exit: { opacity: 0, scale: 0.8, width: 0, transition: { duration: 0.2 } },
-              transition: { duration: 0.3 },
-              className: `relative flex flex-col items-center gap-2 z-10 ${isClickable ? "cursor-pointer" : "cursor-not-allowed opacity-80"}`,
-              onClick: () => {
-                if (isClickable) onJumpToStep(step.id);
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: `
-                                                w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold transition-all duration-300
-                                                ${isActive ? "bg-white border-2 border-purple-600 text-purple-600 shadow-[0_0_0_4px_rgba(147,51,234,0.2)]" : isCompleted ? "bg-purple-600 text-white" : "bg-grey-200 text-gray-400"}
-                                            `,
-                    children: isCompleted ? /* @__PURE__ */ jsx(Check, { className: "w-5 h-5" }) : index + 1
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { className: `w-[100px] text-center absolute top-9 sm:inline hidden text-sm font-medium ${isActive ? "text-gray-900" : "text-grey-500"}`, children: step.title })
-              ]
-            }
-          ),
-          index < steps.length - 1 && /* @__PURE__ */ jsx(
-            motion.div,
-            {
-              layout: true,
-              initial: { opacity: 0, scaleX: 0 },
-              animate: { opacity: 1, scaleX: 1 },
-              exit: { opacity: 0, scaleX: 0 },
-              className: "w-12 sm:w-24 h-[2px] mx-2 self-start mt-4 bg-grey-200 relative flex-shrink-0",
-              children: /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: "absolute left-0 top-0 h-full bg-purple-600 transition-all duration-500 ease-in-out",
-                  style: {
-                    width: isCompleted ? "100%" : "0%"
-                  }
-                }
-              )
-            }
-          )
-        ] }, step.id);
-      }) }) })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "w-full relative flex-1 flex flex-col", children: [
-      /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsx(
-        motion.div,
-        {
-          initial: { opacity: 0, y: 10 },
-          animate: { opacity: 1, y: 0 },
-          exit: { opacity: 0, y: -10 },
-          transition: { duration: 0.3 },
-          className: "w-full px-4 sm:px-6 lg:px-8 mb-20 max-w-6xl mx-auto",
-          children
-        },
-        currentStep
-      ) }),
-      /* @__PURE__ */ jsx("div", { className: "fixed bottom-0 w-full flex items-center justify-end py-4 mt-auto px-8 pointer-events-none md:right-16", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pointer-events-auto", children: [
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            onClick: onBack,
-            disabled: isFirstStep || isProcessing || isNavigationBlocked || isChildBusy,
-            className: cn(
-              "px-6 py-2.5 rounded-xl font-medium text-sm transition-all duration-200",
-              isFirstStep || isNavigationBlocked || isChildBusy ? "text-grey-300 cursor-not-allowed" : "text-gray-600 hover:bg-grey-100 hover:text-gray-900",
-              isFirstStep ? "hidden" : "inline"
-            ),
-            children: "Back"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            onClick: onNext,
-            disabled: isSubmitting || isProcessing || isNavigationBlocked,
-            className: "w-32",
-            children: /* @__PURE__ */ jsx("span", { className: "relative z-10 flex items-center gap-2", children: isLastStep ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("span", { children: isSubmitting || isProcessing ? "Saving..." : "Submit" }) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("span", { children: "Next" }) }) })
-          }
-        )
-      ] }) })
-    ] })
-  ] });
-};
-export {
-  AddEventLayout
-};
-//# sourceMappingURL=AddEventLayout.js.map

package/dist/components/EventAddForm/AddEventLayout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AddEventLayout.js","sources":["../../../src/components/EventAddForm/AddEventLayout.tsx"],"sourcesContent":["import React from 'react';\r\nimport { motion, AnimatePresence } from 'framer-motion';\r\nimport { Check, ChevronLeft } from 'lucide-react';\r\nimport { Button } from '@/components/Button';\r\nimport SpinningBallLoader from \"@/components/Spinner/spinner\";\r\nimport Alert from \"@/components/Alert/Alert\";\r\nimport ConfirmationModal from \"@/components/ConfirmationModal/ConfirmationModal\";\r\nimport EventSubmissionConfirmationModal from './components/EventSubmissionConfirmationModal';\r\nimport { cn } from '@/utils/cn';\r\nimport Tooltip from '@/components/ui/Tooltip';\r\n\r\ninterface AddEventLayoutProps {\r\n    // Stepper State\r\n    steps: { id: number; title: string }[];\r\n    currentStep: number;\r\n    maxStepReached: number;\r\n    isNavigationBlocked: boolean;\r\n    onJumpToStep: (id: number) => void;\r\n\r\n    // Content\r\n    children: React.ReactNode;\r\n\r\n    // Navigation Actions\r\n    onBack: () => void;\r\n    onNext: () => void;\r\n    onSaveDraft: () => void;\r\n\r\n    // Loading/Processing State\r\n    isProcessing: boolean;\r\n    isSubmitting: boolean;\r\n    isSyncingData?: boolean;\r\n    isNavigating?: boolean;\r\n    isChildBusy?: boolean;\r\n    edit?: boolean;\r\n    isFetchError: boolean;\r\n    isFetching: boolean;\r\n    onRetryFetch: () => void;\r\n\r\n    // Feedback\r\n    alert: { show: boolean; message: string; type: 'success' | 'error' };\r\n    onCloseAlert: () => void;\r\n\r\n    // Modals\r\n    submissionModalProps: {\r\n        open: boolean;\r\n        setOpen: (open: boolean) => void;\r\n        onSubmit: () => Promise<string>;\r\n        onSuccess: (type: \"submit\" | \"draft\" | \"next\") => void;\r\n        isFinalStep?: boolean;\r\n        showPreview?: boolean;\r\n        isPolluted?: boolean;\r\n    };\r\n\r\n    switchConfirmationModalProps: {\r\n        open: boolean;\r\n        onClose: () => void;\r\n        onConfirm: () => void;\r\n        title: string;\r\n        description: string;\r\n    };\r\n\r\n    // Helper to determine event type for loader text\r\n    eventId?: string | null;\r\n\r\n    // Route Back\r\n    onRouteBack: () => void;\r\n    exitConfirmationModalProps: {\r\n        open: boolean;\r\n        onClose: () => void;\r\n        onConfirm: () => void;\r\n    };\r\n    eventData?: any;\r\n    mode?: \"questions\" | \"social\" | null;\r\n}\r\n\r\nexport const AddEventLayout = ({\r\n    steps,\r\n    currentStep,\r\n    maxStepReached,\r\n    isNavigationBlocked,\r\n    onJumpToStep,\r\n    children,\r\n    onBack,\r\n    onNext,\r\n    onSaveDraft,\r\n    isProcessing,\r\n    isSubmitting,\r\n    isSyncingData,\r\n    isNavigating,\r\n    isChildBusy,\r\n    edit,\r\n    isFetchError,\r\n    isFetching,\r\n    onRetryFetch,\r\n    alert,\r\n    onCloseAlert,\r\n    submissionModalProps,\r\n    switchConfirmationModalProps,\r\n    eventId,\r\n    onRouteBack,\r\n    exitConfirmationModalProps,\r\n    eventData,\r\n    mode,\r\n}: AddEventLayoutProps) => {\r\n\r\n    const isFirstStep = steps.length > 0 && currentStep === steps[0].id;\r\n    const isLastStep = steps.length > 0 && currentStep === steps[steps.length - 1].id;\r\n\r\n    return (\r\n        <div id=\"add-event-layout\" className=\"layout min-h-screen bg-white flex flex-col items-center\">\r\n            <EventSubmissionConfirmationModal\r\n                open={submissionModalProps.open}\r\n                eventId={eventId || \"\"}\r\n                edit={edit}\r\n                eventData={eventData}\r\n                setOpen={submissionModalProps.setOpen}\r\n                onSubmit={submissionModalProps.onSubmit}\r\n                onSuccess={submissionModalProps.onSuccess}\r\n                isFinalStep={submissionModalProps.isFinalStep}\r\n                showPreview={submissionModalProps.showPreview}\r\n                isPolluted={submissionModalProps?.isPolluted}\r\n            />\r\n\r\n            <Alert\r\n                isVisible={alert.show}\r\n                message={alert.message}\r\n                type={alert.type}\r\n                onClose={onCloseAlert}\r\n            />\r\n\r\n            {/* Unified Confirmation Modal for Type Switching */}\r\n            <ConfirmationModal\r\n                open={switchConfirmationModalProps.open}\r\n                title={switchConfirmationModalProps.title}\r\n                description={switchConfirmationModalProps.description}\r\n                onClose={switchConfirmationModalProps.onClose}\r\n                onConfirm={switchConfirmationModalProps.onConfirm}\r\n                confirmText=\"Confirm & Proceed\"\r\n                cancelText=\"Cancel\"\r\n            />\r\n\r\n            {/* Exit Confirmation Modal */}\r\n            <ConfirmationModal\r\n                open={exitConfirmationModalProps.open}\r\n                title=\"Discard changes?\"\r\n                description=\"You have unsaved changes. Are you sure you want to discard them and leave?\"\r\n                onClose={exitConfirmationModalProps.onClose}\r\n                onConfirm={exitConfirmationModalProps.onConfirm}\r\n                confirmText=\"Discard & leave\"\r\n                cancelText=\"Cancel\"\r\n            />\r\n\r\n            {(edit && isFetchError) &&\r\n                <div className=\"fixed inset-0 z-[10000] bg-[rgba(0,0,0,0.05)] backdrop-filter backdrop-blur-sm flex items-center justify-center\">\r\n                    <div className=\"p-10 rounded-xl bg-white flex items-center justify-center flex-col gap-4\">\r\n                        <p className=\"text-error-500 font-medium\">Failed to load event details.</p>\r\n                        <Button\r\n                            onClick={onRetryFetch}\r\n                        >\r\n                            Retry\r\n                        </Button>\r\n                    </div>\r\n                </div>\r\n            }\r\n\r\n            {/* Loading State for Edit Mode or Background Operations */}\r\n            {\r\n                (\r\n                    (edit && isFetching) ||\r\n                    isProcessing ||\r\n                    isSubmitting ||\r\n                    isSyncingData ||\r\n                    isNavigating\r\n                ) &&\r\n                <SpinningBallLoader />\r\n            }\r\n\r\n            {/* Stepper Header */}\r\n            <div className={cn(\"w-full relative space-y-10\", steps.length > 1 ? \"sm:mb-20 mb-10\" : \"mb-6\")}>\r\n                <div className='w-full py-4 sm:py-8 px-4 sm:px-20'>\r\n                    <div\r\n                        className='flex items-center gap-4 text-grey-500 hover:text-grey-900 transition-colors duration-200'\r\n                    >\r\n                        <Tooltip\r\n                            placement=\"right\"\r\n                            content={(\r\n                                <div className=\"max-w-max\">\r\n                                    <p className=\"text-white text-xs\">Go back to event listing</p>\r\n                                </div>\r\n                            ) as any}\r\n                            triggerClassName=\"w-max h-max flex items-center justify-center\"\r\n                        >\r\n                            <button\r\n                                onClick={onRouteBack}\r\n                                disabled={isChildBusy || isNavigating}\r\n                                className='w-11 h-9 rounded-lg input-border flex items-center justify-center text-gray-800 hover:text-gray-900 disabled:opacity-50 disabled:cursor-not-allowed'\r\n                            >\r\n                                <ChevronLeft className='w-5 h-5' />\r\n                            </button>\r\n                        </Tooltip>\r\n                        <span className='lg:text-[30px] text-2xl font-semibold text-grey-800'>\r\n                            {mode === 'questions' ? 'Edit Questions' : mode === 'social' ? 'Edit Social Profiles' : (edit ? \"Edit\" : \"Create\") + \" Event\"}\r\n                        </span>\r\n                    </div>\r\n                </div>\r\n                {steps.length > 1 && (\r\n                    <div className=\"flex items-center justify-center w-full max-w-[800px] mx-auto px-4 sm:px-20\">\r\n                        <AnimatePresence mode='popLayout'>\r\n                            {steps.map((step, index) => {\r\n                                const isActive = step.id === currentStep;\r\n                                const isCompleted = step.id < currentStep;\r\n                                // Block navigation logic\r\n                                const isClickable = !isNavigationBlocked && !isChildBusy && step.id < currentStep;\r\n\r\n                                return (\r\n                                    <React.Fragment key={step.id}>\r\n                                        <motion.div\r\n                                            layout\r\n                                            initial={{ opacity: 0, scale: 0.8, width: 0 }}\r\n                                            animate={{ opacity: 1, scale: 1, width: 'auto' }}\r\n                                            exit={{ opacity: 0, scale: 0.8, width: 0, transition: { duration: 0.2 } }}\r\n                                            transition={{ duration: 0.3 }}\r\n                                            className={`relative flex flex-col items-center gap-2 z-10 ${isClickable ? 'cursor-pointer' : 'cursor-not-allowed opacity-80'}`}\r\n                                            onClick={() => {\r\n                                                if (isClickable) onJumpToStep(step.id);\r\n                                            }}\r\n                                        >\r\n                                            <div\r\n                                                className={`\r\n                                                w-8 h-8 rounded-full flex items-center justify-center text-sm font-semibold transition-all duration-300\r\n                                                ${isActive ? 'bg-white border-2 border-purple-600 text-purple-600 shadow-[0_0_0_4px_rgba(147,51,234,0.2)]' :\r\n                                                        isCompleted ? 'bg-purple-600 text-white' : 'bg-grey-200 text-gray-400'}\r\n                                            `}\r\n                                            >\r\n                                                {isCompleted ? <Check className=\"w-5 h-5\" /> :\r\n                                                    index + 1}\r\n                                            </div>\r\n                                            <span className={`w-[100px] text-center absolute top-9 sm:inline hidden text-sm font-medium ${isActive ? 'text-gray-900' : 'text-grey-500'}`}>\r\n                                                {step.title}\r\n                                            </span>\r\n                                        </motion.div>\r\n\r\n                                        {/* Connector Line */}\r\n                                        {index < steps.length - 1 && (\r\n                                            <motion.div\r\n                                                layout\r\n                                                initial={{ opacity: 0, scaleX: 0 }}\r\n                                                animate={{ opacity: 1, scaleX: 1 }}\r\n                                                exit={{ opacity: 0, scaleX: 0 }}\r\n                                                className=\"w-12 sm:w-24 h-[2px] mx-2 self-start mt-4 bg-grey-200 relative flex-shrink-0\"\r\n                                            >\r\n                                                <div\r\n                                                    className=\"absolute left-0 top-0 h-full bg-purple-600 transition-all duration-500 ease-in-out\"\r\n                                                    style={{\r\n                                                        width: isCompleted ? '100%' : '0%'\r\n                                                    }}\r\n                                                />\r\n                                            </motion.div>\r\n                                        )}\r\n                                    </React.Fragment>\r\n                                );\r\n                            })}\r\n                        </AnimatePresence>\r\n                    </div>\r\n                )}\r\n            </div>\r\n\r\n            {/* Content Area */}\r\n            <div className=\"w-full relative flex-1 flex flex-col\">\r\n                <AnimatePresence mode=\"wait\">\r\n                    <motion.div\r\n                        key={currentStep}\r\n                        initial={{ opacity: 0, y: 10 }}\r\n                        animate={{ opacity: 1, y: 0 }}\r\n                        exit={{ opacity: 0, y: -10 }}\r\n                        transition={{ duration: 0.3 }}\r\n                        className=\"w-full px-4 sm:px-6 lg:px-8 mb-20 max-w-6xl mx-auto\"\r\n                    >\r\n                        {children}\r\n                    </motion.div>\r\n                </AnimatePresence>\r\n\r\n                {/* Footer Actions */}\r\n                <div className=\"fixed bottom-0 w-full flex items-center justify-end py-4 mt-auto px-8 pointer-events-none md:right-16\">\r\n                    <div className=\"flex items-center gap-3 pointer-events-auto\">\r\n                        <button\r\n                            onClick={onBack}\r\n                            disabled={isFirstStep || isProcessing || isNavigationBlocked || isChildBusy}\r\n                            className={cn(\r\n                                \"px-6 py-2.5 rounded-xl font-medium text-sm transition-all duration-200\",\r\n                                isFirstStep || isNavigationBlocked || isChildBusy\r\n                                    ? 'text-grey-300 cursor-not-allowed'\r\n                                    : 'text-gray-600 hover:bg-grey-100 hover:text-gray-900',\r\n                                isFirstStep ? \"hidden\" : \"inline\"\r\n                            )}\r\n                        >\r\n                            Back\r\n                        </button>\r\n\r\n                        <Button\r\n                            onClick={onNext}\r\n                            disabled={isSubmitting || isProcessing || isNavigationBlocked}\r\n                            className='w-32'\r\n                        >\r\n                            <span className=\"relative z-10 flex items-center gap-2\">\r\n                                {isLastStep ? (\r\n                                    <>\r\n                                        <span>\r\n                                            {isSubmitting || isProcessing ? 'Saving...' : 'Submit'}\r\n                                        </span>\r\n                                    </>\r\n                                ) : (\r\n                                    <>\r\n                                        <span>Next</span>\r\n                                    </>\r\n                                )}\r\n                            </span>\r\n                        </Button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    );\r\n};\r\n"],"names":["SpinningBallLoader","React"],"mappings":"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"}