@contractspec/lib.ui-kit-web 3.4.0 → 3.4.2

package/dist/ui/organisms/ErrorBoundary/index.js

@@ -1,5 +1,190 @@
 // @bun
 var __require = import.meta.require;
+
+// ui/button.tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-hidden focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground hover:bg-primary/90",
+      destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+      outline: "border bg-background shadow-2xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      default: "h-9 px-4 py-2 has-[>svg]:px-3",
+      sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+      lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+      icon: "size-9"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function Button({
+  className,
+  variant,
+  size,
+  asChild = false,
+  ref,
+  ...props
+}) {
+  if (asChild) {
+    return /* @__PURE__ */ jsxDEV(Slot, {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }, undefined, false, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV("button", {
+    ref,
+    "data-slot": "button",
+    className: cn(buttonVariants({ variant, size, className })),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/organisms/ErrorBoundary/ErrorBoundary.tsx
+import React from "react";
+import { AlertTriangle, RefreshCw, Home } from "lucide-react";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+"use client";
+var DefaultErrorFallback = ({
+  error,
+  errorId,
+  resetError
+}) => {
+  const isDevelopment = true;
+  return /* @__PURE__ */ jsxDEV2("div", {
+    className: "flex min-h-screen items-center justify-center bg-gray-50 px-4",
+    children: /* @__PURE__ */ jsxDEV2("div", {
+      className: "w-full max-w-md rounded-lg bg-white p-6 text-center shadow-lg",
+      children: [
+        /* @__PURE__ */ jsxDEV2("div", {
+          className: "mb-4 flex justify-center",
+          children: /* @__PURE__ */ jsxDEV2(AlertTriangle, {
+            className: "h-12 w-12 text-red-500"
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV2("h1", {
+          className: "mb-2 text-2xl font-semibold text-gray-900",
+          children: "Une erreur s'est produite"
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV2("p", {
+          className: "mb-6 text-gray-600",
+          children: "Nous nous excusons pour ce d\xE9sagr\xE9ment. Notre \xE9quipe a \xE9t\xE9 notifi\xE9e et travaille \xE0 r\xE9soudre le probl\xE8me."
+        }, undefined, false, undefined, this),
+        isDevelopment && /* @__PURE__ */ jsxDEV2("div", {
+          className: "mb-6 rounded-md bg-red-50 p-4 text-left",
+          children: [
+            /* @__PURE__ */ jsxDEV2("p", {
+              className: "mb-2 text-base font-medium text-red-800",
+              children: "Erreur de d\xE9veloppement:"
+            }, undefined, false, undefined, this),
+            /* @__PURE__ */ jsxDEV2("p", {
+              className: "font-mono text-sm break-all text-red-700",
+              children: error.message
+            }, undefined, false, undefined, this),
+            errorId && /* @__PURE__ */ jsxDEV2("p", {
+              className: "mt-2 text-sm text-red-600",
+              children: [
+                "ID: ",
+                errorId
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        /* @__PURE__ */ jsxDEV2("div", {
+          className: "flex flex-col justify-center gap-3 sm:flex-row",
+          children: [
+            /* @__PURE__ */ jsxDEV2(Button, {
+              onClick: resetError,
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsxDEV2(RefreshCw, {
+                  className: "h-4 w-4"
+                }, undefined, false, undefined, this),
+                "R\xE9essayer"
+              ]
+            }, undefined, true, undefined, this),
+            /* @__PURE__ */ jsxDEV2(Button, {
+              onClick: () => window.location.href = "/",
+              variant: "secondary",
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsxDEV2(Home, {
+                  className: "h-4 w-4"
+                }, undefined, false, undefined, this),
+                "Accueil"
+              ]
+            }, undefined, true, undefined, this)
+          ]
+        }, undefined, true, undefined, this),
+        !isDevelopment && errorId && /* @__PURE__ */ jsxDEV2("p", {
+          className: "mt-4 text-sm text-gray-500",
+          children: [
+            "Code d'erreur: ",
+            errorId
+          ]
+        }, undefined, true, undefined, this)
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+};
+
+class ErrorBoundary extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      hasError: false,
+      error: null,
+      errorId: null
+    };
+  }
+  static getDerivedStateFromError(error) {
+    return {
+      hasError: true,
+      error
+    };
+  }
+  componentDidCatch(error, errorInfo) {
+    const errorId = `err_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+    this.setState({ errorId });
+    this.props.onError?.(error, errorInfo);
+    if (true) {
+      console.error("ErrorBoundary caught an error:", error, errorInfo);
+    }
+  }
+  resetError = () => {
+    this.setState({
+      hasError: false,
+      error: null,
+      errorId: null
+    });
+  };
+  render() {
+    if (this.state.hasError && this.state.error) {
+      const FallbackComponent = this.props.fallback || DefaultErrorFallback;
+      return /* @__PURE__ */ jsxDEV2(FallbackComponent, {
+        error: this.state.error,
+        errorId: this.state.errorId,
+        resetError: this.resetError
+      }, undefined, false, undefined, this);
+    }
+    return this.props.children;
+  }
+}
+var useErrorHandler = () => {
+  return React.useCallback((error) => {
+    throw error;
+  }, []);
+};
 export {
   useErrorHandler,
   ErrorBoundary