import { jsx, jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { useRouteError, useLocation, isRouteErrorResponse } from "react-router";
import { Button } from "../button/button.js";
import { c as createLucideIcon } from "../../createLucideIcon-Bni0WIE-.js";
import { C as ChevronDown } from "../../chevron-down-BOJO_vp4.js";
/**
 * @license lucide-react v0.540.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
const __iconNode$1 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
const ChevronUp = createLucideIcon("chevron-up", __iconNode$1);
/**
 * @license lucide-react v0.540.0 - ISC
 *
 * This source code is licensed under the ISC license.
 * See the LICENSE file in the root directory of this source tree.
 */
const __iconNode = [
  [
    "path",
    {
      d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
      key: "wmoenq"
    }
  ],
  ["path", { d: "M12 9v4", key: "juzpu7" }],
  ["path", { d: "M12 17h.01", key: "p32p05" }]
];
const TriangleAlert = createLucideIcon("triangle-alert", __iconNode);
function ErrorBoundary(props) {
  const error = useRouteError();
  const location = useLocation();
  const [showDetails, setShowDetails] = useState(false);
  let errorMessage = "An unknown error occurred";
  let errorStatus;
  let errorStack;
  if (isRouteErrorResponse(error)) {
    errorMessage = error.data || error.statusText || "Route error occurred";
    errorStatus = error.status;
  } else if (error instanceof Error) {
    errorMessage = error.message;
    errorStack = error.stack;
  } else if (typeof error === "string") {
    errorMessage = error;
  }
  const handleFixMe = () => {
    const errorObj = {
      location: location.pathname,
      errorStatus,
      errorMessage,
      errorStack
    };
    props.reportError(errorObj);
  };
  const toggleDetails = () => {
    setShowDetails(!showDetails);
  };
  return /* @__PURE__ */ jsx("div", { className: "min-h-screen bg-gradient-to-br from-red-50 via-white to-orange-50 flex items-center justify-center p-4", children: /* @__PURE__ */ jsxs("div", { className: "max-w-2xl w-full", children: [
    /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-2xl shadow-2xl overflow-hidden", children: [
      /* @__PURE__ */ jsx("div", { className: "bg-gradient-to-r from-red-500 to-orange-500 p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
        /* @__PURE__ */ jsx("div", { className: "bg-white/20 backdrop-blur-sm rounded-full p-3", children: /* @__PURE__ */ jsx(TriangleAlert, { className: "h-8 w-8 text-white" }) }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold text-white", children: errorStatus === 404 ? "Page Not Found" : "Your app has an error" }),
          /* @__PURE__ */ jsx("p", { className: "text-red-100 mt-1", children: "Don't worry, we can help fix it!" })
        ] })
      ] }) }),
      /* @__PURE__ */ jsxs("div", { className: "p-6 space-y-5", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h3", { className: "font-semibold text-gray-900 mb-2", children: "What happened?" }),
          /* @__PURE__ */ jsx("p", { className: "text-gray-600 text-sm leading-relaxed", children: errorStatus === 404 ? "The page you're trying to access doesn't exist. This might happen if a route hasn't been created yet." : "There's a problem in your app's code that's preventing this screen from loading properly. This is usually caused by a typo, missing data, or incorrect function usage." })
        ] }),
        errorStack && /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsxs(
            "button",
            {
              onClick: toggleDetails,
              className: "flex items-center gap-2 text-sm text-gray-500 hover:text-gray-700 transition-colors",
              children: [
                showDetails ? /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" }),
                /* @__PURE__ */ jsxs("span", { children: [
                  showDetails ? "Hide" : "Show",
                  " technical details"
                ] })
              ]
            }
          ),
          showDetails && /* @__PURE__ */ jsxs("div", { className: "mt-3 p-4 bg-gray-50 rounded-lg text-sm", children: [
            /* @__PURE__ */ jsx("p", { className: "font-mono text-red-600 mb-3", children: errorMessage }),
            errorStack && /* @__PURE__ */ jsx("pre", { className: "text-xs font-mono text-gray-600 whitespace-pre-wrap max-h-48 overflow-y-auto", children: errorStack })
          ] })
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "border-t pt-5", children: [
          /* @__PURE__ */ jsx("h3", { className: "font-semibold text-gray-900 mb-2", children: "How to fix this" }),
          /* @__PURE__ */ jsx("p", { className: "text-gray-600 text-sm leading-relaxed mb-4", children: "The Builder can automatically analyze and fix this error for you. Click the button below to send the error details to the AI assistant." }),
          /* @__PURE__ */ jsx(
            Button,
            {
              variant: "default",
              onClick: handleFixMe,
              className: "w-full font-medium",
              size: "lg",
              children: "Let AI Fix This Error"
            }
          )
        ] })
      ] })
    ] }),
    /* @__PURE__ */ jsx("p", { className: "text-center text-gray-500 text-sm mt-6", children: "If this problem persists, please contact Ivo" })
  ] }) });
}
export {
  ErrorBoundary
};
