xertica-ui 2.4.0 → 2.4.1

package/dist/VerifyEmailPage-CqKsR2v8.js

@@ -0,0 +1,2827 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import React__default, { useState, useMemo, useRef, useCallback, useEffect } from "react";
+import { B as Button, c as cn } from "./button-qkz7Icqf.js";
+import { I as Input, S as ScrollArea } from "./input-D-6IsAca.js";
+import { I as ImageWithFallback, L as Label, P as PageHeader, M as Map, C as Checkbox, S as Separator, T as Tabs, p as TabsList, q as TabsTrigger, o as TabsContent, n as Switch, R as RadioGroup, m as RadioGroupItem, A as AlertDialog, j as AlertDialogTrigger, c as AlertDialogContent, f as AlertDialogHeader, i as AlertDialogTitle, d as AlertDialogDescription, e as AlertDialogFooter, b as AlertDialogCancel, a as AlertDialogAction } from "./alert-dialog-s-vmNkJ_.js";
+import { L as LanguageSelector, X as XerticaLogo } from "./XerticaXLogo-fAJMy3H4.js";
+import { ArrowLeft, Lock, Home, FileText, CheckCircle2, AlertCircle, Coffee, ShoppingBag, Landmark, Hotel, Utensils, MapPin, Filter, X, MousePointer2, Circle, Square, Hexagon, Undo, Trash2, Save, Check, Pencil, Layers, Settings, Users, Mail, Phone, Search, User, Calendar, Bell, FileEdit, ArrowRightLeft, Clock, Plus, Archive, Map as Map$1 } from "lucide-react";
+import { useNavigate, useLocation, Link } from "react-router-dom";
+import { H as Header, S as Sidebar } from "./sidebar-BViy8Eeu.js";
+import { C as Card, e as CardHeader, f as CardTitle, B as Badge, b as CardContent, d as CardFooter, c as CardDescription, P as Progress } from "./progress-DPtzoVV8.js";
+import { a as useOptionalLayout } from "./LayoutContext-dbQvdC4O.js";
+import { X as XerticaAssistant, g as gerarResposta } from "./xertica-assistant-BdiZag0h.js";
+import { D as Dialog, j as DialogContent, m as DialogHeader, p as DialogTitle, k as DialogDescription, A as Alert, b as AlertTitle, a as AlertDescription, H as Textarea, T as Table, F as TableHeader, G as TableRow, B as TableHead, w as TableBody, y as TableCell, q as DialogTrigger, l as DialogFooter } from "./rich-text-editor-CMgSN_w2.js";
+import { S as Select, h as SelectTrigger, i as SelectValue, a as SelectContent, c as SelectItem } from "./select-En8DkoaQ.js";
+import { S as Slider } from "./slider-C0JKA9k3.js";
+import { toast } from "sonner";
+function ForgotPasswordPage() {
+  const navigate = useNavigate();
+  const [email, setEmail] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setIsLoading(true);
+    await new Promise((resolve) => setTimeout(resolve, 1500));
+    navigate("/verify-email", { state: { email } });
+    setIsLoading(false);
+  };
+  const handleSocialLogin = (_provider) => {
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex", children: [
+    /* @__PURE__ */ jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
+      /* @__PURE__ */ jsx(
+        ImageWithFallback,
+        {
+          src: "https://images.unsplash.com/photo-1557804506-669a67965ba0?w=1200&h=800&fit=crop&auto=format",
+          alt: "Segurança e tecnologia",
+          className: "absolute inset-0 w-full h-full object-cover"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 flex items-center justify-center px-4 sm:px-6 lg:px-8 lg:flex-none lg:w-1/2 relative bg-muted", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsx(LanguageSelector, { variant: "minimal", showIcon: false }) }),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
+      /* @__PURE__ */ jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
+        /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx(
+            XerticaLogo,
+            {
+              className: "h-12 w-auto text-primary dark:text-foreground",
+              variant: "theme"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("h2", { className: "text-sm text-muted-foreground", children: "Recuperar senha" }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-muted-foreground", children: "Digite seu e-mail e enviaremos as instruções para redefinir sua senha" })
+        ] }),
+        /* @__PURE__ */ jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
+          /* @__PURE__ */ jsxs("div", { className: "form-group space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "email", className: "form-label", children: "E-mail" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "email",
+                name: "email",
+                type: "email",
+                required: true,
+                className: "w-full",
+                placeholder: "seu@email.com",
+                value: email,
+                onChange: (e) => setEmail(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "submit",
+                className: "w-full",
+                disabled: isLoading,
+                children: isLoading ? "Enviando..." : "Enviar instruções"
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                type: "button",
+                onClick: () => navigate("/login"),
+                variant: "outline",
+                className: "w-full text-muted-foreground hover:text-foreground",
+                children: [
+                  /* @__PURE__ */ jsx(ArrowLeft, { className: "w-4 h-4 mr-2" }),
+                  "Voltar para o login"
+                ]
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t border-border" }) }),
+          /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: "ou continue com" }) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
+                  /* @__PURE__ */ jsx("path", { fill: "#EA4335", d: "M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#4285F4", d: "M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#FBBC05", d: "M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#34A853", d: "M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
+                ] }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com Google" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsx(Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com MT Login" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center font-normal",
+              onClick: () => handleSocialLogin(),
+              children: /* @__PURE__ */ jsxs("span", { children: [
+                "Entrar com ",
+                /* @__PURE__ */ jsx("strong", { className: "font-semibold", children: "gov.br" })
+              ] })
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+const routes = [
+  {
+    path: "/home",
+    label: "Home",
+    icon: Home
+  },
+  {
+    path: "/template",
+    label: "Template",
+    icon: FileText
+  }
+];
+const getRouteByPath = (path) => {
+  return routes.find((route) => route.path === path);
+};
+const SIDEBAR_COLLAPSED_WIDTH = 80;
+function HomeContent({ user, onLogout, onSettings }) {
+  const layout = useOptionalLayout();
+  const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? false;
+  const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 256;
+  const location = useLocation();
+  const navigate = useNavigate();
+  const labelTranslations = {
+    "home": "Início",
+    "template": "Template"
+  };
+  const currentRoute = getRouteByPath(location.pathname);
+  (currentRoute == null ? void 0 : currentRoute.label) ? labelTranslations[currentRoute.label.toLowerCase()] || currentRoute.label : "Início";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        paddingLeft: sidebarExpanded ? `${sidebarWidth}px` : SIDEBAR_COLLAPSED_WIDTH
+      },
+      className: "flex-1 flex flex-col overflow-hidden transition-all duration-300",
+      children: [
+        /* @__PURE__ */ jsx(
+          Header,
+          {
+            showThemeToggle: true,
+            showLanguageSelector: true,
+            breadcrumbs: [
+              { label: "Design System", href: "/home" },
+              { label: "Início" }
+            ],
+            renderLink: (href, props) => /* @__PURE__ */ jsx(Link, { to: href, ...props })
+          }
+        ),
+        /* @__PURE__ */ jsx("main", { className: "flex-1 overflow-hidden bg-muted", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsx("div", { className: "p-2 sm:p-4 md:p-6", children: /* @__PURE__ */ jsxs("div", { className: "max-w-6xl mx-auto space-y-8", children: [
+          /* @__PURE__ */ jsx(
+            PageHeader,
+            {
+              title: "Bem-vindo ao Design System!",
+              subtitle: "Sua plataforma inteligente para automação e análise de dados"
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: /* @__PURE__ */ jsxs(Card, { className: "hover:shadow-xl transition-shadow duration-200 flex flex-col h-full", children: [
+            /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: "p-2 bg-[var(--chart-2)]/20 rounded-[var(--radius)]", children: /* @__PURE__ */ jsx(FileText, { className: "w-6 h-6 text-[var(--chart-2)]" }) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(CardTitle, { className: "text-sm", children: "Template CLI" }),
+                /* @__PURE__ */ jsx(Badge, { variant: "default", className: "text-xs", children: "Novo" })
+              ] })
+            ] }) }),
+            /* @__PURE__ */ jsx(CardContent, { className: "flex-1", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Página de template pronta para uso CLI com todos os componentes configurados." }) }),
+            /* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                className: "w-full",
+                onClick: () => navigate("/template"),
+                children: "Visualizar"
+              }
+            ) })
+          ] }) })
+        ] }) }) }) })
+      ]
+    }
+  );
+}
+const richSuggestions = [
+  { id: "chart-1", text: "Ver análise de desempenho" },
+  { id: "table-1", text: "Gerar relatório do projeto" },
+  { id: "doc-1", text: "Criar documento de requisitos" },
+  { id: "pod-1", text: "Gerar podcast de resumo diário" }
+];
+const feedbackOptions = [
+  "Não era o que eu estava procurando",
+  "Informações incorretas",
+  "Resposta incompleta"
+];
+function HomePage({ user, onLogout }) {
+  const layout = useOptionalLayout();
+  const [localSidebarExpanded, setLocalSidebarExpanded] = React__default.useState(false);
+  const [localAssistantExpanded, setLocalAssistantExpanded] = React__default.useState(false);
+  const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
+  const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 280;
+  const assistenteExpanded = (layout == null ? void 0 : layout.assistenteExpanded) ?? localAssistantExpanded;
+  const toggleSidebar = (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
+  const toggleAssistente = (layout == null ? void 0 : layout.toggleAssistente) ?? (() => setLocalAssistantExpanded((value) => !value));
+  const location = useLocation();
+  const navigate = useNavigate();
+  return /* @__PURE__ */ jsxs("div", { className: "h-screen flex bg-muted overflow-hidden relative", children: [
+    /* @__PURE__ */ jsx(
+      Sidebar,
+      {
+        expanded: sidebarExpanded,
+        width: sidebarWidth,
+        onToggle: toggleSidebar,
+        user: {
+          ...user,
+          name: "Ariel Santos",
+          avatar: "https://github.com/shadcn.png"
+        },
+        onLogout,
+        onSettingsClick: () => navigate("/settings"),
+        location,
+        navigate,
+        routes
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      HomeContent,
+      {
+        user,
+        onLogout,
+        onSettings: () => navigate("/settings")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      XerticaAssistant,
+      {
+        isExpanded: assistenteExpanded,
+        onToggle: toggleAssistente,
+        defaultTab: "chat",
+        demoMode: true,
+        responseGenerator: gerarResposta,
+        richSuggestions,
+        feedbackOptions,
+        onEvaluation: () => {
+        }
+      }
+    )
+  ] });
+}
+function LoginPage({ onLogin }) {
+  const navigate = useNavigate();
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState("");
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError("");
+    setIsLoading(true);
+    await new Promise((resolve) => setTimeout(resolve, 1e3));
+    const success = onLogin(email, password);
+    if (!success) {
+      setError("Por favor, preencha todos os campos");
+    }
+    setIsLoading(false);
+  };
+  const handleSocialLogin = (_provider) => {
+    onLogin("social@user.com", "social-auth");
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex", children: [
+    /* @__PURE__ */ jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
+      /* @__PURE__ */ jsx(
+        ImageWithFallback,
+        {
+          src: "https://images.unsplash.com/photo-1551434678-e076c223a692?w=1200&h=800&fit=crop&auto=format",
+          alt: "Equipe trabalhando com tecnologia",
+          className: "absolute inset-0 w-full h-full object-cover"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 flex items-center justify-center px-4 sm:px-6 lg:px-8 lg:flex-none lg:w-1/2 relative bg-muted", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsx(LanguageSelector, { variant: "minimal", showIcon: false }) }),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
+      /* @__PURE__ */ jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
+        /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx(
+            XerticaLogo,
+            {
+              className: "h-12 w-auto text-primary dark:text-foreground",
+              variant: "theme"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("h2", { className: "text-sm text-muted-foreground", children: "Acesse sua conta" })
+        ] }),
+        /* @__PURE__ */ jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "E-mail" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "email",
+                name: "email",
+                type: "email",
+                required: true,
+                className: "w-full",
+                placeholder: "seu@email.com",
+                value: email,
+                onChange: (e) => setEmail(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Senha" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "password",
+                name: "password",
+                type: "password",
+                required: true,
+                className: "w-full",
+                placeholder: "••••••••",
+                value: password,
+                onChange: (e) => setPassword(e.target.value)
+              }
+            )
+          ] }),
+          error && /* @__PURE__ */ jsx("div", { className: "text-destructive text-sm text-center", children: error }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "submit",
+              className: "w-full",
+              disabled: isLoading,
+              children: isLoading ? "Entrando..." : "Entrar"
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => navigate("/forgot-password"),
+              className: "text-sm text-primary hover:opacity-80 transition-colors",
+              children: "Esqueceu sua senha?"
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t border-border" }) }),
+          /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: "ou continue com" }) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
+                  /* @__PURE__ */ jsx("path", { fill: "#EA4335", d: "M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#4285F4", d: "M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#FBBC05", d: "M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#34A853", d: "M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
+                ] }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com Google" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsx(Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com MT Login" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center font-normal",
+              onClick: () => handleSocialLogin(),
+              children: /* @__PURE__ */ jsxs("span", { children: [
+                "Entrar com ",
+                /* @__PURE__ */ jsx("strong", { className: "font-semibold", children: "gov.br" })
+              ] })
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function ResetPasswordPage() {
+  const navigate = useNavigate();
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState("");
+  const [passwordStrength, setPasswordStrength] = useState(null);
+  const checkPasswordStrength = (pwd) => {
+    if (pwd.length === 0) {
+      setPasswordStrength(null);
+      return;
+    }
+    if (pwd.length < 6) {
+      setPasswordStrength("weak");
+    } else if (pwd.length < 10) {
+      setPasswordStrength("medium");
+    } else {
+      setPasswordStrength("strong");
+    }
+  };
+  const handlePasswordChange = (value) => {
+    setPassword(value);
+    checkPasswordStrength(value);
+    setError("");
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError("");
+    if (password.length < 6) {
+      setError("A senha deve ter pelo menos 6 caracteres");
+      return;
+    }
+    if (password !== confirmPassword) {
+      setError("As senhas não coincidem");
+      return;
+    }
+    setIsLoading(true);
+    await new Promise((resolve) => setTimeout(resolve, 1500));
+    navigate("/login", { state: { resetSuccess: true } });
+    setIsLoading(false);
+  };
+  const getStrengthColor = () => {
+    switch (passwordStrength) {
+      case "weak":
+        return "text-destructive";
+      case "medium":
+        return "text-[var(--chart-3)]";
+      case "strong":
+        return "text-[var(--chart-2)]";
+      default:
+        return "text-muted-foreground";
+    }
+  };
+  const getStrengthText = () => {
+    switch (passwordStrength) {
+      case "weak":
+        return "Senha fraca";
+      case "medium":
+        return "Senha média";
+      case "strong":
+        return "Senha forte";
+      default:
+        return "";
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex", children: [
+    /* @__PURE__ */ jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
+      /* @__PURE__ */ jsx(
+        ImageWithFallback,
+        {
+          src: "https://images.unsplash.com/photo-1555949963-aa79dcee981c?w=1200&h=800&fit=crop&auto=format",
+          alt: "Segurança e proteção",
+          className: "absolute inset-0 w-full h-full object-cover"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 flex items-center justify-center px-4 sm:px-6 lg:px-8 lg:flex-none lg:w-1/2 relative bg-muted", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsx(LanguageSelector, { variant: "minimal", showIcon: false }) }),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
+      /* @__PURE__ */ jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => navigate("/login"),
+            className: "flex items-center gap-2 text-muted-foreground hover:text-foreground transition-colors",
+            children: [
+              /* @__PURE__ */ jsx(ArrowLeft, { className: "w-4 h-4" }),
+              /* @__PURE__ */ jsx("span", { className: "text-small", children: "Voltar para o login" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx(
+            XerticaLogo,
+            {
+              className: "h-12 w-auto text-primary dark:text-foreground",
+              variant: "theme"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("h2", { className: "text-sm text-muted-foreground", children: "Redefinir senha" }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-muted-foreground", children: "Crie uma nova senha segura para sua conta" })
+        ] }),
+        /* @__PURE__ */ jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Nova senha" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "password",
+                name: "password",
+                type: "password",
+                required: true,
+                className: "w-full",
+                placeholder: "••••••••",
+                value: password,
+                onChange: (e) => handlePasswordChange(e.target.value)
+              }
+            ),
+            passwordStrength && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx("div", { className: "flex-1 h-1 bg-muted rounded-full overflow-hidden", children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: `h-full transition-all duration-300 ${passwordStrength === "weak" ? "w-1/3 bg-destructive" : passwordStrength === "medium" ? "w-2/3 bg-[var(--chart-3)]" : "w-full bg-[var(--chart-2)]"}`
+                }
+              ) }),
+              /* @__PURE__ */ jsx("span", { className: `text-small ${getStrengthColor()}`, children: getStrengthText() })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "confirmPassword", children: "Confirmar senha" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "confirmPassword",
+                name: "confirmPassword",
+                type: "password",
+                required: true,
+                className: "w-full",
+                placeholder: "••••••••",
+                value: confirmPassword,
+                onChange: (e) => {
+                  setConfirmPassword(e.target.value);
+                  setError("");
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "bg-accent rounded-[var(--radius)] p-4 space-y-2", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm", children: "Requisitos de senha:" }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  CheckCircle2,
+                  {
+                    className: `w-4 h-4 ${password.length >= 6 ? "text-[var(--chart-2)]" : "text-muted-foreground"}`
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Mínimo de 6 caracteres" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  CheckCircle2,
+                  {
+                    className: `w-4 h-4 ${password === confirmPassword && password.length > 0 ? "text-[var(--chart-2)]" : "text-muted-foreground"}`
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "As senhas coincidem" })
+              ] })
+            ] })
+          ] }),
+          error && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-destructive bg-destructive/10 rounded-[var(--radius)] p-3", children: [
+            /* @__PURE__ */ jsx(AlertCircle, { className: "w-4 h-4 flex-shrink-0" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: error })
+          ] }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "submit",
+              className: "w-full",
+              disabled: isLoading,
+              children: isLoading ? "Redefinindo..." : "Redefinir senha"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function createLucideIconSvg(iconName) {
+  const iconPaths = {
+    utensils: '<path d="M3 2v7c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V2"></path><path d="M7 2v20"></path><path d="M21 15V2v0a5 5 0 0 0-5 5v6c0 1.1.9 2 2 2h3Zm0 0v7"></path>',
+    hotel: '<path d="M18 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2Z"></path><path d="M8 6h8"></path><path d="M8 10h8"></path><path d="M8 14h8"></path><path d="M8 18h8"></path>',
+    landmark: '<path d="m3 21 18-18"></path><path d="M9 15V6h6v9"></path><path d="M12 3v3"></path><path d="M3 15h18"></path><path d="M6 21v-6"></path><path d="M18 21v-6"></path>',
+    shopping: '<path d="M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z"></path><path d="M3 6h18"></path><path d="M16 10a4 4 0 0 1-8 0"></path>',
+    coffee: '<path d="M17 8h1a4 4 0 1 1 0 8h-1"></path><path d="M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z"></path><line x1="6" x2="6" y1="2" y2="4"></line><line x1="10" x2="10" y1="2" y2="4"></line><line x1="14" x2="14" y1="2" y2="4"></line>'
+  };
+  const path = iconPaths[iconName] || "";
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">${path}</svg>`;
+}
+const markerGroups = {
+  restaurant: {
+    id: "restaurant",
+    name: "Restaurantes",
+    color: "var(--destructive)",
+    // red
+    iconColor: "#FFFFFF",
+    // white para contraste
+    iconName: "utensils",
+    icon: Utensils
+  },
+  hotel: {
+    id: "hotel",
+    name: "Hotéis",
+    color: "var(--info)",
+    // blue
+    iconColor: "#FFFFFF",
+    iconName: "hotel",
+    icon: Hotel
+  },
+  landmark: {
+    id: "landmark",
+    name: "Pontos Turísticos",
+    color: "var(--success)",
+    // green
+    iconColor: "#FFFFFF",
+    iconName: "landmark",
+    icon: Landmark
+  },
+  shopping: {
+    id: "shopping",
+    name: "Compras",
+    color: "var(--warning)",
+    // orange
+    iconColor: "#FFFFFF",
+    iconName: "shopping",
+    icon: ShoppingBag
+  },
+  cafe: {
+    id: "cafe",
+    name: "Cafeterias",
+    color: "var(--primary)",
+    // purple
+    iconColor: "#FFFFFF",
+    iconName: "coffee",
+    icon: Coffee
+  }
+};
+const sampleLocations = [
+  // Restaurantes
+  {
+    position: { lat: -23.5505, lng: -46.6333 },
+    title: "Restaurante Italiano",
+    info: "Melhor pizza da cidade",
+    group: "restaurant"
+  },
+  {
+    position: { lat: -23.5485, lng: -46.635 },
+    title: "Sushi Bar",
+    info: "Comida japonesa autêntica",
+    group: "restaurant"
+  },
+  {
+    position: { lat: -23.552, lng: -46.631 },
+    title: "Churrascaria Premium",
+    info: "Rodízio tradicional brasileiro",
+    group: "restaurant"
+  },
+  // Hotéis
+  {
+    position: { lat: -23.5475, lng: -46.6361 },
+    title: "Hotel Luxo",
+    info: "5 estrelas - Vista panorâmica",
+    group: "hotel"
+  },
+  {
+    position: { lat: -23.553, lng: -46.634 },
+    title: "Hotel Boutique",
+    info: "Design moderno e aconchegante",
+    group: "hotel"
+  },
+  // Pontos Turísticos
+  {
+    position: { lat: -23.5613, lng: -46.6563 },
+    title: "Parque Ibirapuera",
+    info: "Maior parque urbano da cidade",
+    group: "landmark"
+  },
+  {
+    position: { lat: -23.5558, lng: -46.6396 },
+    title: "MASP",
+    info: "Museu de Arte de São Paulo",
+    group: "landmark"
+  },
+  {
+    position: { lat: -23.5489, lng: -46.6388 },
+    title: "Avenida Paulista",
+    info: "Centro financeiro e cultural",
+    group: "landmark"
+  },
+  // Shopping
+  {
+    position: { lat: -23.5465, lng: -46.64 },
+    title: "Shopping Center",
+    info: "Mais de 300 lojas",
+    group: "shopping"
+  },
+  {
+    position: { lat: -23.554, lng: -46.638 },
+    title: "Galeria de Arte",
+    info: "Arte contemporânea e design",
+    group: "shopping"
+  },
+  // Cafeterias
+  {
+    position: { lat: -23.5495, lng: -46.6345 },
+    title: "Café Artesanal",
+    info: "Café especial e brunch",
+    group: "cafe"
+  },
+  {
+    position: { lat: -23.551, lng: -46.637 },
+    title: "Coffee House",
+    info: "Café gourmet e wi-fi",
+    group: "cafe"
+  },
+  {
+    position: { lat: -23.5525, lng: -46.6355 },
+    title: "Café Cultural",
+    info: "Livros e café",
+    group: "cafe"
+  }
+];
+function FilterableMapExample({ apiKey }) {
+  const [activeFilters, setActiveFilters] = useState(
+    new Set(Object.keys(markerGroups))
+  );
+  const [showFilters, setShowFilters] = useState(true);
+  const filteredLocations = useMemo(() => {
+    return sampleLocations.filter((location) => activeFilters.has(location.group));
+  }, [activeFilters]);
+  const toggleFilter = (groupId) => {
+    setActiveFilters((prev) => {
+      const newFilters = new Set(prev);
+      if (newFilters.has(groupId)) {
+        newFilters.delete(groupId);
+      } else {
+        newFilters.add(groupId);
+      }
+      return newFilters;
+    });
+  };
+  const toggleAll = () => {
+    if (activeFilters.size === Object.keys(markerGroups).length) {
+      setActiveFilters(/* @__PURE__ */ new Set());
+    } else {
+      setActiveFilters(new Set(Object.keys(markerGroups)));
+    }
+  };
+  const markersWithCustomization = filteredLocations.map((location) => ({
+    ...location,
+    customColor: markerGroups[location.group].color,
+    iconSvg: createLucideIconSvg(markerGroups[location.group].iconName),
+    iconColor: markerGroups[location.group].iconColor
+  }));
+  const getGroupCount = (groupId) => {
+    return sampleLocations.filter((loc) => loc.group === groupId).length;
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(MapPin, { className: "w-5 h-5 text-primary" }),
+        /* @__PURE__ */ jsx("h3", { children: "Filtro por Categorias" })
+      ] }),
+      /* @__PURE__ */ jsxs(Badge, { variant: "secondary", children: [
+        filteredLocations.length,
+        " de ",
+        sampleLocations.length,
+        " locais"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Use os filtros compactos no canto superior esquerdo do mapa para visualizar marcadores por categoria" }),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(
+        Map,
+        {
+          center: { lat: -23.5505, lng: -46.6333 },
+          zoom: 14,
+          markers: markersWithCustomization,
+          height: "500px",
+          zoomControl: true,
+          fullscreenControl: true,
+          apiKey
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "absolute top-4 left-4 z-10 transition-all duration-300",
+            showFilters ? "translate-x-0" : "-translate-x-full"
+          ),
+          children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "p-2.5 rounded-lg shadow-[var(--shadow-elevation-sm)] bg-card border border-border max-w-[220px]",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2 gap-2", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+                    /* @__PURE__ */ jsx(Filter, { className: "w-3.5 h-3.5 text-foreground" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground", children: "Filtros" })
+                  ] }),
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      variant: "ghost",
+                      onClick: () => setShowFilters(false),
+                      className: "h-5 w-5 p-0",
+                      children: /* @__PURE__ */ jsx(X, { className: "w-3 h-3" })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2 py-0.5", children: [
+                    /* @__PURE__ */ jsx(
+                      Checkbox,
+                      {
+                        id: "filter-all",
+                        checked: activeFilters.size === Object.keys(markerGroups).length,
+                        onCheckedChange: toggleAll
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(Label, { htmlFor: "filter-all", className: "flex items-center gap-1.5 cursor-pointer text-sm", children: [
+                      /* @__PURE__ */ jsx(MapPin, { className: "w-3.5 h-3.5" }),
+                      "Todos",
+                      /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs h-4 px-1", children: sampleLocations.length })
+                    ] })
+                  ] }),
+                  Object.entries(markerGroups).map(([id, group]) => {
+                    const groupId = id;
+                    const Icon = group.icon;
+                    const isActive = activeFilters.has(groupId);
+                    const count = getGroupCount(groupId);
+                    return /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2 py-0.5", children: [
+                      /* @__PURE__ */ jsx(
+                        Checkbox,
+                        {
+                          id: `filter-${id}`,
+                          checked: isActive,
+                          onCheckedChange: () => toggleFilter(groupId)
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs(
+                        Label,
+                        {
+                          htmlFor: `filter-${id}`,
+                          className: "flex items-center gap-1.5 cursor-pointer text-sm",
+                          children: [
+                            /* @__PURE__ */ jsx(
+                              Icon,
+                              {
+                                className: "w-3.5 h-3.5",
+                                style: { color: group.color }
+                              }
+                            ),
+                            /* @__PURE__ */ jsx("span", { className: isActive ? "text-foreground" : "text-muted-foreground", children: group.name }),
+                            /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-xs h-4 px-1", children: count })
+                          ]
+                        }
+                      )
+                    ] }, id);
+                  })
+                ] })
+              ]
+            }
+          )
+        }
+      ),
+      !showFilters && /* @__PURE__ */ jsxs(
+        Button,
+        {
+          size: "sm",
+          onClick: () => setShowFilters(true),
+          className: "absolute top-4 left-4 z-10 h-8 bg-primary text-primary-foreground",
+          children: [
+            /* @__PURE__ */ jsx(Filter, { className: "w-3.5 h-3.5 mr-1.5" }),
+            "Filtros"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-3 justify-center pt-2 border-t border-border", children: Object.entries(markerGroups).map(([id, group]) => {
+      const Icon = group.icon;
+      const count = getGroupCount(id);
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex items-center gap-2 px-3 py-1 rounded-lg bg-muted",
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "w-3 h-3 rounded-full",
+                style: { backgroundColor: group.color }
+              }
+            ),
+            /* @__PURE__ */ jsx(Icon, { className: "w-4 h-4", style: { color: group.color } }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", style: { color: "var(--foreground)" }, children: group.name }),
+            /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs h-5", children: count })
+          ]
+        },
+        id
+      );
+    }) }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Total de Locais" }),
+        /* @__PURE__ */ jsx("p", { className: "text-2xl text-foreground", children: sampleLocations.length })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Visíveis" }),
+        /* @__PURE__ */ jsx("p", { className: "text-2xl text-primary", children: filteredLocations.length })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Categorias" }),
+        /* @__PURE__ */ jsx("p", { className: "text-2xl text-foreground", children: Object.keys(markerGroups).length })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Filtros Ativos" }),
+        /* @__PURE__ */ jsx("p", { className: "text-2xl text-chart-2", children: activeFilters.size })
+      ] })
+    ] })
+  ] });
+}
+function DrawingMapExample({ apiKey }) {
+  const [mapInstance, setMapInstance] = useState(null);
+  const [selectedMode, setSelectedMode] = useState(null);
+  const [shapes, setShapes] = useState([]);
+  const [showSaveDialog, setShowSaveDialog] = useState(false);
+  const [savedData, setSavedData] = useState("");
+  const [isDrawingPolygon, setIsDrawingPolygon] = useState(false);
+  const tempPolylineRef = useRef(null);
+  const polygonPathRef = useRef([]);
+  const mapListenersRef = useRef([]);
+  const colors = {
+    fill: "#2C275B",
+    // Primary do CSS
+    stroke: "#2C275B",
+    fillOpacity: 0.2,
+    strokeWeight: 2,
+    editable: true,
+    draggable: true
+  };
+  const addMarker = useCallback((position) => {
+    if (!mapInstance) return;
+    const marker = new google.maps.marker.AdvancedMarkerElement({
+      position,
+      map: mapInstance,
+      gmpDraggable: true,
+      // Propriedade correta para AdvancedMarkerElement
+      title: "Marcador"
+    });
+    marker.addListener("dragend", () => {
+      toast.info("Posição do marcador atualizada");
+    });
+    const newShape = { type: "marker", overlay: marker };
+    setShapes((prev) => [...prev, newShape]);
+    toast.success("Marcador adicionado");
+  }, [mapInstance]);
+  const addCircle = useCallback((center) => {
+    if (!mapInstance) return;
+    const circle = new google.maps.Circle({
+      map: mapInstance,
+      center,
+      radius: 500,
+      fillColor: colors.fill,
+      fillOpacity: colors.fillOpacity,
+      strokeColor: colors.stroke,
+      strokeWeight: colors.strokeWeight,
+      editable: true,
+      draggable: true
+    });
+    const newShape = { type: "circle", overlay: circle };
+    setShapes((prev) => [...prev, newShape]);
+    toast.success("Círculo adicionado");
+  }, [mapInstance, colors]);
+  const addRectangle = useCallback((center) => {
+    if (!mapInstance) return;
+    const offset = 5e-3;
+    const bounds = {
+      north: center.lat() + offset,
+      south: center.lat() - offset,
+      east: center.lng() + offset,
+      west: center.lng() - offset
+    };
+    const rectangle = new google.maps.Rectangle({
+      map: mapInstance,
+      bounds,
+      fillColor: colors.fill,
+      fillOpacity: colors.fillOpacity,
+      strokeColor: colors.stroke,
+      strokeWeight: colors.strokeWeight,
+      editable: true,
+      draggable: true
+    });
+    const newShape = { type: "rectangle", overlay: rectangle };
+    setShapes((prev) => [...prev, newShape]);
+    toast.success("Retângulo adicionado");
+  }, [mapInstance, colors]);
+  const cancelPolygonDrawing = useCallback(() => {
+    if (tempPolylineRef.current) {
+      tempPolylineRef.current.setMap(null);
+      tempPolylineRef.current = null;
+    }
+    polygonPathRef.current = [];
+    setIsDrawingPolygon(false);
+  }, []);
+  const finishPolygon = useCallback(() => {
+    if (!mapInstance || polygonPathRef.current.length < 3) {
+      if (polygonPathRef.current.length < 3 && polygonPathRef.current.length > 0) {
+        toast.error("Polígono precisa de pelo menos 3 pontos.");
+      }
+      return;
+    }
+    const polygon = new google.maps.Polygon({
+      map: mapInstance,
+      paths: polygonPathRef.current,
+      fillColor: colors.fill,
+      fillOpacity: colors.fillOpacity,
+      strokeColor: colors.stroke,
+      strokeWeight: colors.strokeWeight,
+      editable: true,
+      draggable: true
+    });
+    const newShape = { type: "polygon", overlay: polygon };
+    setShapes((prev) => [...prev, newShape]);
+    cancelPolygonDrawing();
+    toast.success("Polígono criado com sucesso!");
+  }, [mapInstance, colors, cancelPolygonDrawing]);
+  const addPolygonPoint = useCallback((point) => {
+    var _a;
+    if (!mapInstance) return;
+    if (!isDrawingPolygon) {
+      setIsDrawingPolygon(true);
+      polygonPathRef.current = [point];
+      tempPolylineRef.current = new google.maps.Polyline({
+        map: mapInstance,
+        path: polygonPathRef.current,
+        strokeColor: colors.stroke,
+        strokeOpacity: 0.8,
+        strokeWeight: 2,
+        geodesic: true,
+        clickable: false
+        // Importante: não capturar cliques para não atrapalhar o mapa
+      });
+      toast.info("Clique para adicionar pontos. Duplo clique ou botão check para fechar.", { duration: 4e3 });
+    } else {
+      polygonPathRef.current.push(point);
+      (_a = tempPolylineRef.current) == null ? void 0 : _a.setPath(polygonPathRef.current);
+    }
+  }, [mapInstance, isDrawingPolygon, colors]);
+  const clearListeners = () => {
+    mapListenersRef.current.forEach((listener) => google.maps.event.removeListener(listener));
+    mapListenersRef.current = [];
+  };
+  useEffect(() => {
+    if (!mapInstance) return;
+    clearListeners();
+    if (!selectedMode) {
+      mapInstance.setOptions({ draggableCursor: "grab", clickableIcons: true });
+      return;
+    }
+    mapInstance.setOptions({
+      draggableCursor: "crosshair",
+      clickableIcons: false
+    });
+    const clickListener = mapInstance.addListener("click", (e) => {
+      if (!e.latLng) return;
+      switch (selectedMode) {
+        case "marker":
+          addMarker(e.latLng);
+          break;
+        case "circle":
+          addCircle(e.latLng);
+          break;
+        case "rectangle":
+          addRectangle(e.latLng);
+          break;
+        case "polygon":
+          addPolygonPoint(e.latLng);
+          break;
+      }
+    });
+    mapListenersRef.current.push(clickListener);
+    if (selectedMode === "polygon") {
+      const dblClickListener = mapInstance.addListener("dblclick", (e) => {
+        if (e.domEvent) e.domEvent.stopPropagation();
+        finishPolygon();
+      });
+      mapListenersRef.current.push(dblClickListener);
+    }
+    return () => {
+      clearListeners();
+    };
+  }, [mapInstance, selectedMode, addMarker, addCircle, addRectangle, addPolygonPoint, finishPolygon]);
+  const handleModeChange = (mode) => {
+    if (isDrawingPolygon) {
+      cancelPolygonDrawing();
+    }
+    setSelectedMode(mode);
+  };
+  const clearAll = () => {
+    shapes.forEach((shape) => {
+      if ("setMap" in shape.overlay) shape.overlay.setMap(null);
+      else shape.overlay.map = null;
+    });
+    setShapes([]);
+    if (isDrawingPolygon) cancelPolygonDrawing();
+    toast.info("Mapa limpo");
+  };
+  const undoLast = () => {
+    var _a;
+    if (isDrawingPolygon) {
+      if (polygonPathRef.current.length > 0) {
+        polygonPathRef.current.pop();
+        (_a = tempPolylineRef.current) == null ? void 0 : _a.setPath(polygonPathRef.current);
+        if (polygonPathRef.current.length === 0) {
+          cancelPolygonDrawing();
+        }
+      }
+      return;
+    }
+    if (shapes.length === 0) return;
+    const lastShape = shapes[shapes.length - 1];
+    if ("setMap" in lastShape.overlay) lastShape.overlay.setMap(null);
+    else lastShape.overlay.map = null;
+    setShapes((prev) => prev.slice(0, prev.length - 1));
+  };
+  const handleSave = () => {
+    if (shapes.length === 0) {
+      toast.error("Adicione desenhos ao mapa antes de salvar.");
+      return;
+    }
+    const exportData = shapes.map((s) => {
+      var _a, _b;
+      let data = {};
+      if (s.type === "marker") {
+        const marker = s.overlay;
+        const pos = marker.position;
+        if (pos) {
+          const lat = typeof pos.lat === "function" ? pos.lat() : pos.lat;
+          const lng = typeof pos.lng === "function" ? pos.lng() : pos.lng;
+          data = { lat, lng };
+        }
+      } else if (s.type === "circle") {
+        const circle = s.overlay;
+        data = {
+          center: { lat: (_a = circle.getCenter()) == null ? void 0 : _a.lat(), lng: (_b = circle.getCenter()) == null ? void 0 : _b.lng() },
+          radius: circle.getRadius()
+        };
+      } else if (s.type === "rectangle") {
+        const rect = s.overlay;
+        const bounds = rect.getBounds();
+        data = {
+          north: bounds == null ? void 0 : bounds.getNorthEast().lat(),
+          south: bounds == null ? void 0 : bounds.getSouthWest().lat(),
+          east: bounds == null ? void 0 : bounds.getNorthEast().lng(),
+          west: bounds == null ? void 0 : bounds.getSouthWest().lng()
+        };
+      } else if (s.type === "polygon") {
+        const poly = s.overlay;
+        const path = poly.getPath();
+        data = path.getArray().map((coord) => ({ lat: coord.lat(), lng: coord.lng() }));
+      }
+      return { type: s.type, data };
+    });
+    setSavedData(JSON.stringify(exportData, null, 2));
+    setShowSaveDialog(true);
+  };
+  const ToolButton = ({
+    active,
+    onClick,
+    icon: Icon,
+    label
+  }) => /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant: active ? "default" : "ghost",
+      className: `w-full justify-start gap-3 ${active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground"}`,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: label })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxs(Card, { className: "h-full border-0 shadow-none md:border md:shadow-sm", children: [
+    /* @__PURE__ */ jsx(CardHeader, { className: "border-b bg-muted/20 pb-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Ferramentas de Desenho" }),
+        /* @__PURE__ */ jsx(CardDescription, { className: "mt-1", children: "Crie geometrias personalizadas no mapa" })
+      ] }),
+      /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "h-6", children: [
+        shapes.length,
+        " ",
+        shapes.length === 1 ? "elemento" : "elementos"
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(CardContent, { className: "p-0 flex flex-col md:flex-row h-[600px] bg-background", children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-full md:w-64 border-b md:border-b-0 md:border-r bg-muted/10 flex flex-col", children: [
+        /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsxs("div", { className: "p-4 space-y-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ jsx("h4", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-2", children: "Ferramentas" }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+              /* @__PURE__ */ jsx(
+                ToolButton,
+                {
+                  active: selectedMode === null,
+                  onClick: () => handleModeChange(null),
+                  icon: MousePointer2,
+                  label: "Navegar"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ToolButton,
+                {
+                  active: selectedMode === "marker",
+                  onClick: () => handleModeChange("marker"),
+                  icon: MapPin,
+                  label: "Marcador"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ToolButton,
+                {
+                  active: selectedMode === "circle",
+                  onClick: () => handleModeChange("circle"),
+                  icon: Circle,
+                  label: "Círculo"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ToolButton,
+                {
+                  active: selectedMode === "rectangle",
+                  onClick: () => handleModeChange("rectangle"),
+                  icon: Square,
+                  label: "Retângulo"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ToolButton,
+                {
+                  active: selectedMode === "polygon",
+                  onClick: () => handleModeChange("polygon"),
+                  icon: Hexagon,
+                  label: "Polígono"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, {}),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ jsx("h4", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-2", children: "Ações" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "outline",
+                  onClick: undoLast,
+                  disabled: shapes.length === 0 && !isDrawingPolygon,
+                  className: "w-full",
+                  title: "Desfazer último",
+                  "aria-label": "Desfazer último",
+                  children: [
+                    /* @__PURE__ */ jsx(Undo, { className: "h-4 w-4 mr-2" }),
+                    "Desfazer"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "destructive",
+                  onClick: clearAll,
+                  disabled: shapes.length === 0 && !isDrawingPolygon,
+                  className: "w-full bg-destructive/10 text-destructive hover:bg-destructive hover:text-destructive-foreground border-0 shadow-none",
+                  children: [
+                    /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4 mr-2" }),
+                    "Limpar"
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                variant: "default",
+                onClick: handleSave,
+                disabled: shapes.length === 0,
+                className: "w-full mt-2",
+                children: [
+                  /* @__PURE__ */ jsx(Save, { className: "h-4 w-4 mr-2" }),
+                  "Salvar GeoJSON"
+                ]
+              }
+            )
+          ] })
+        ] }) }),
+        isDrawingPolygon && /* @__PURE__ */ jsxs("div", { className: "p-4 bg-primary/5 border-t border-primary/10", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2 text-primary text-xs font-medium", children: [
+            /* @__PURE__ */ jsxs("span", { className: "relative flex h-2 w-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75" }),
+              /* @__PURE__ */ jsx("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-primary" })
+            ] }),
+            "Desenhando Polígono..."
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                className: "w-full bg-green-600 hover:bg-green-700 text-white",
+                onClick: finishPolygon,
+                children: [
+                  /* @__PURE__ */ jsx(Check, { className: "h-3 w-3 mr-1" }),
+                  " Concluir"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "outline",
+                className: "w-full",
+                onClick: cancelPolygonDrawing,
+                children: [
+                  /* @__PURE__ */ jsx(X, { className: "h-3 w-3 mr-1" }),
+                  " Cancelar"
+                ]
+              }
+            )
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 relative bg-muted/5 min-h-[400px]", children: [
+        /* @__PURE__ */ jsx(
+          Map,
+          {
+            className: "h-full w-full rounded-none md:rounded-br-lg",
+            center: { lat: -23.5505, lng: -46.6333 },
+            zoom: 13,
+            height: "100%",
+            mapContainerClassName: "h-full w-full rounded-none md:rounded-br-lg",
+            disableDefaultUI: true,
+            zoomControl: true,
+            onMapLoad: setMapInstance,
+            apiKey
+          }
+        ),
+        selectedMode && !isDrawingPolygon && /* @__PURE__ */ jsxs("div", { className: "absolute bottom-6 left-1/2 -translate-x-1/2 bg-background/90 backdrop-blur border px-4 py-2 rounded-full shadow-sm text-xs font-medium text-muted-foreground pointer-events-none z-10", children: [
+          selectedMode === "marker" && "Clique no mapa para adicionar um marcador",
+          selectedMode === "circle" && "Clique no mapa para definir o centro do círculo",
+          selectedMode === "rectangle" && "Clique no mapa para criar um retângulo",
+          selectedMode === "polygon" && "Clique sequencialmente para desenhar a área"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Dialog, { open: showSaveDialog, onOpenChange: setShowSaveDialog, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-md", children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Dados Geográficos (GeoJSON)" }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: "Copie os dados das formas desenhadas abaixo." })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "relative mt-2", children: /* @__PURE__ */ jsx("pre", { className: "p-4 rounded-lg bg-muted overflow-auto max-h-[300px] text-xs font-mono", "data-custom-scrollbar": true, children: savedData }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex justify-end mt-4", children: /* @__PURE__ */ jsx(Button, { onClick: () => setShowSaveDialog(false), children: "Fechar" }) })
+      ] }) })
+    ] })
+  ] });
+}
+function MapShowcase() {
+  const [activeTab, setActiveTab] = useState("simple");
+  const [isTransitioning, setIsTransitioning] = useState(false);
+  const [apiKey, setApiKey] = useState("");
+  const [inputApiKey, setInputApiKey] = useState("");
+  const [showTraffic, setShowTraffic] = useState(false);
+  const [showTransit, setShowTransit] = useState(false);
+  const [showBicycling, setShowBicycling] = useState(false);
+  const [showZoomControl, setShowZoomControl] = useState(true);
+  const [showMapTypeControl, setShowMapTypeControl] = useState(false);
+  const [showStreetViewControl, setShowStreetViewControl] = useState(false);
+  const [showFullscreenControl, setShowFullscreenControl] = useState(true);
+  const handleTabChange = (value) => {
+    if (value === activeTab) return;
+    setIsTransitioning(true);
+    setTimeout(() => {
+      setActiveTab(value);
+      setIsTransitioning(false);
+    }, 50);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-8", children: [
+    /* @__PURE__ */ jsx(
+      PageHeader,
+      {
+        title: "Mapas",
+        subtitle: "Biblioteca de componentes de mapa para visualização de dados geoespaciais. Utiliza a API do Google Maps com estilização personalizada do Xertica UI.",
+        actions: /* @__PURE__ */ jsx(Badge, { children: "Design System" })
+      }
+    ),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Configuração da API Key" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Insira sua Google Maps API Key para renderizar os mapas abaixo." })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-md items-center space-x-2", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "password",
+            placeholder: "Cole sua Google Maps API Key aqui",
+            "aria-label": "Google Maps API Key",
+            value: inputApiKey,
+            onChange: (e) => setInputApiKey(e.target.value),
+            className: "max-w-md h-10"
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { onClick: () => setApiKey(inputApiKey), children: "Salvar" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Tabs, { value: activeTab, onValueChange: handleTabChange, className: "w-full", children: [
+      /* @__PURE__ */ jsxs(TabsList, { className: "grid w-full grid-cols-4 mb-8", children: [
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "simple", children: "Mapas Simples" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "markers", children: "Marcadores" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "controls", children: "Controles" }),
+        /* @__PURE__ */ jsxs(TabsTrigger, { value: "drawing", className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(Pencil, { className: "w-3 h-3" }),
+          " Desenho"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "simple", className: "space-y-8", children: !isTransitioning && activeTab === "simple" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Mapa Padrão" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Configuração básica do mapa centralizado em uma coordenada específica." })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+            Map,
+            {
+              center: { lat: -23.5505, lng: -46.6333 },
+              zoom: 13,
+              height: "400px",
+              apiKey
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Camadas (Layers)" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Sobreposição de informações como tráfego, transporte público e ciclovias." })
+          ] }),
+          /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-6 p-4 border rounded-lg bg-muted/50", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    id: "traffic",
+                    checked: showTraffic,
+                    onCheckedChange: setShowTraffic
+                  }
+                ),
+                /* @__PURE__ */ jsxs(Label, { htmlFor: "traffic", className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Layers, { className: "w-4 h-4" }),
+                  " Trânsito"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    id: "transit",
+                    checked: showTransit,
+                    onCheckedChange: setShowTransit
+                  }
+                ),
+                /* @__PURE__ */ jsxs(Label, { htmlFor: "transit", className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Layers, { className: "w-4 h-4" }),
+                  " Transporte"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    id: "bicycling",
+                    checked: showBicycling,
+                    onCheckedChange: setShowBicycling
+                  }
+                ),
+                /* @__PURE__ */ jsxs(Label, { htmlFor: "bicycling", className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Layers, { className: "w-4 h-4" }),
+                  " Ciclovias"
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(
+              Map,
+              {
+                center: { lat: -23.5505, lng: -46.6333 },
+                zoom: 12,
+                height: "500px",
+                layers: {
+                  traffic: showTraffic,
+                  transit: showTransit,
+                  bicycling: showBicycling
+                },
+                apiKey
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "grid md:grid-cols-3 gap-4", children: [
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsx(CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsx(CardTitle, { className: "text-sm", children: "São Paulo" }) }),
+            /* @__PURE__ */ jsx(CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsx(
+              Map,
+              {
+                center: { lat: -23.5505, lng: -46.6333 },
+                zoom: 11,
+                height: "200px",
+                disableDefaultUI: true,
+                apiKey
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsx(CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsx(CardTitle, { className: "text-sm", children: "Rio de Janeiro" }) }),
+            /* @__PURE__ */ jsx(CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsx(
+              Map,
+              {
+                center: { lat: -22.9068, lng: -43.1729 },
+                zoom: 11,
+                height: "200px",
+                disableDefaultUI: true,
+                apiKey
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsx(CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsx(CardTitle, { className: "text-sm", children: "New York" }) }),
+            /* @__PURE__ */ jsx(CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsx(
+              Map,
+              {
+                center: { lat: 40.7128, lng: -74.006 },
+                zoom: 11,
+                height: "200px",
+                disableDefaultUI: true,
+                apiKey
+              }
+            ) })
+          ] })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "markers", className: "space-y-8", children: !isTransitioning && activeTab === "markers" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Marcadores e Pins" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Exemplos de marcadores personalizados com diferentes cores e informações." })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+            Map,
+            {
+              center: { lat: -23.5505, lng: -46.6333 },
+              zoom: 13,
+              height: "500px",
+              apiKey,
+              markers: [
+                {
+                  position: { lat: -23.5505, lng: -46.6333 },
+                  title: "Principal",
+                  info: "Marcador padrão",
+                  customColor: "#4F46E5"
+                },
+                {
+                  position: { lat: -23.54, lng: -46.64 },
+                  title: "Secundário",
+                  info: "Marcador de alerta",
+                  customColor: "#EF4444",
+                  icon: "!"
+                },
+                {
+                  position: { lat: -23.56, lng: -46.62 },
+                  title: "Loja",
+                  info: "Ponto de venda",
+                  customColor: "#10B981",
+                  icon: "S"
+                }
+              ]
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Marcador com Ações" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Marcador interativo que exibe conteúdo rico (texto, imagem, botões) ao ser clicado." })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+            Map,
+            {
+              center: { lat: -23.5505, lng: -46.6333 },
+              zoom: 13,
+              height: "500px",
+              apiKey,
+              markers: [
+                {
+                  position: { lat: -23.5505, lng: -46.6333 },
+                  label: "🏢",
+                  richContent: /* @__PURE__ */ jsxs("div", { className: "p-4 max-w-[260px]", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+                      /* @__PURE__ */ jsx("h4", { className: "font-semibold text-base", children: "Xertica HQ" }),
+                      /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-[10px] h-5", children: "Open" })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "w-full h-32 bg-muted rounded-md mb-3 overflow-hidden relative", children: [
+                      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" }),
+                      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center text-white font-medium", children: "Office View" })
+                    ] }),
+                    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mb-3 leading-relaxed", children: "Sede principal em São Paulo. Espaço moderno para reuniões e eventos." }),
+                    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
+                      /* @__PURE__ */ jsx(Button, { size: "sm", className: "w-full h-8 text-xs shadow-sm", children: "Navegar" }),
+                      /* @__PURE__ */ jsx(Button, { size: "sm", variant: "outline", className: "w-full h-8 text-xs bg-background", children: "Detalhes" })
+                    ] })
+                  ] })
+                }
+              ]
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Áreas e Zonas" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Delimitação de áreas geográficas usando círculos e polígonos." })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(
+            Map,
+            {
+              center: { lat: -23.5505, lng: -46.6333 },
+              zoom: 12,
+              height: "500px",
+              apiKey,
+              markers: [
+                {
+                  position: { lat: -23.5505, lng: -46.6333 },
+                  title: "Centro da Zona",
+                  info: "Raio de 3km",
+                  customColor: "#6366F1"
+                }
+              ],
+              circle: {
+                center: { lat: -23.5505, lng: -46.6333 },
+                radius: 3e3,
+                fillColor: "#6366F1",
+                strokeColor: "#4F46E5"
+              },
+              polygon: {
+                paths: [
+                  [
+                    { lat: -23.52, lng: -46.6 },
+                    { lat: -23.52, lng: -46.66 },
+                    { lat: -23.58, lng: -46.66 },
+                    { lat: -23.58, lng: -46.6 }
+                  ]
+                ],
+                fillColor: "#10B981",
+                strokeColor: "#059669"
+              }
+            }
+          ) })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "controls", className: "space-y-8", children: !isTransitioning && activeTab === "controls" && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Controles do Mapa" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Personalize a interface do mapa ativando ou desativando controles nativos." })
+          ] }),
+          /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 p-4 border rounded-lg bg-muted/50", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    id: "zoom",
+                    checked: showZoomControl,
+                    onCheckedChange: (c) => setShowZoomControl(!!c)
+                  }
+                ),
+                /* @__PURE__ */ jsx(Label, { htmlFor: "zoom", children: "Zoom Control" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    id: "maptype",
+                    checked: showMapTypeControl,
+                    onCheckedChange: (c) => setShowMapTypeControl(!!c)
+                  }
+                ),
+                /* @__PURE__ */ jsx(Label, { htmlFor: "maptype", children: "Map Type" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    id: "streetview",
+                    checked: showStreetViewControl,
+                    onCheckedChange: (c) => setShowStreetViewControl(!!c)
+                  }
+                ),
+                /* @__PURE__ */ jsx(Label, { htmlFor: "streetview", children: "Street View" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    id: "fullscreen",
+                    checked: showFullscreenControl,
+                    onCheckedChange: (c) => setShowFullscreenControl(!!c)
+                  }
+                ),
+                /* @__PURE__ */ jsx(Label, { htmlFor: "fullscreen", children: "Fullscreen" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(
+              Map,
+              {
+                center: { lat: -23.5505, lng: -46.6333 },
+                zoom: 13,
+                height: "400px",
+                apiKey,
+                zoomControl: showZoomControl,
+                mapTypeControl: showMapTypeControl,
+                streetViewControl: showStreetViewControl,
+                fullscreenControl: showFullscreenControl
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { children: [
+          /* @__PURE__ */ jsxs(CardHeader, { children: [
+            /* @__PURE__ */ jsx(CardTitle, { children: "Filtros Interativos" }),
+            /* @__PURE__ */ jsx(CardDescription, { children: "Exemplo avançado de mapa com controles customizados para filtragem de marcadores." })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(FilterableMapExample, { apiKey }) })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "drawing", className: "space-y-8", children: !isTransitioning && activeTab === "drawing" && /* @__PURE__ */ jsx(DrawingMapExample, { apiKey }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid md:grid-cols-3 gap-6 pt-8 border-t", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx("h4", { className: "font-semibold text-sm", children: "Documentação" }),
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+          "Verifique ",
+          /* @__PURE__ */ jsx("code", { children: "MAP_SETUP.md" }),
+          " para configuração inicial e requisitos de API."
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx("h4", { className: "font-semibold text-sm", children: "Performance" }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Utiliza carregamento assíncrono e AdvancedMarkerElement para melhor desempenho." })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx("h4", { className: "font-semibold text-sm", children: "Design System" }),
+        /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+          "Componentes seguem estritamente as variáveis de tokens do ",
+          /* @__PURE__ */ jsx("code", { children: "globals.css" }),
+          "."
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function TemplateContent({ user, onLogout, onSettings }) {
+  const layout = useOptionalLayout();
+  const [localSidebarExpanded, setLocalSidebarExpanded] = useState(false);
+  const [localSidebarWidth, setLocalSidebarWidth] = useState(280);
+  const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
+  const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? localSidebarWidth;
+  const setSidebarWidth = (layout == null ? void 0 : layout.setSidebarWidth) ?? setLocalSidebarWidth;
+  (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
+  useNavigate();
+  const [progress, setProgress] = useState(45);
+  const [sliderValue, setSliderValue] = useState([50]);
+  const [switchEnabled, setSwitchEnabled] = useState(false);
+  const [showSidebarUser, setShowSidebarUser] = useState(true);
+  const [showSidebarSettings, setShowSidebarSettings] = useState(true);
+  const [showSidebarLogout, setShowSidebarLogout] = useState(true);
+  const [showHeaderActions, setShowHeaderActions] = useState(true);
+  const [showHeaderBreadcrumbs, setShowHeaderBreadcrumbs] = useState(true);
+  const handleFormSubmit = (e) => {
+    e.preventDefault();
+    toast.success("Form submitted successfully!");
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex-1 flex flex-col overflow-hidden transition-all duration-300",
+      style: {
+        paddingLeft: sidebarExpanded ? `${sidebarWidth}px` : "80px"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Header,
+          {
+            showThemeToggle: true,
+            showLanguageSelector: true,
+            breadcrumbs: [
+              { label: "Design System", href: "/home", icon: /* @__PURE__ */ jsx(Home, { className: "w-4 h-4" }) },
+              { label: "Página de Template" }
+            ],
+            renderLink: (href, props) => /* @__PURE__ */ jsx(Link, { to: href, ...props })
+          }
+        ),
+        /* @__PURE__ */ jsx("main", { className: "flex-1 overflow-hidden bg-muted", children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsx("div", { className: "p-2 sm:p-4 md:p-6", children: /* @__PURE__ */ jsxs("div", { className: "max-w-6xl mx-auto space-y-8", children: [
+          /* @__PURE__ */ jsx(
+            PageHeader,
+            {
+              title: "Página de Template",
+              subtitle: "Template completo com componentes do Design System"
+            }
+          ),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Header with Breadcrumbs" }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "Main Header" }),
+                /* @__PURE__ */ jsx(CardDescription, { children: "Example of Header with 4-level breadcrumbs" })
+              ] }),
+              /* @__PURE__ */ jsxs(CardContent, { className: "p-0 border-t bg-background overflow-hidden rounded-b-[var(--radius-lg)]", children: [
+                /* @__PURE__ */ jsx(
+                  Header,
+                  {
+                    className: "border-b",
+                    breadcrumbs: [
+                      { label: "Dashboard", href: "#", icon: /* @__PURE__ */ jsx(Home, { className: "w-4 h-4" }) },
+                      { label: "Settings", href: "#", icon: /* @__PURE__ */ jsx(Settings, { className: "w-4 h-4" }) },
+                      { label: "Users", href: "#", icon: /* @__PURE__ */ jsx(Users, { className: "w-4 h-4" }) },
+                      { label: "Access Profile" }
+                    ],
+                    showLanguageSelector: true,
+                    showThemeToggle: true
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "p-6 min-h-[200px]", children: [
+                  /* @__PURE__ */ jsx("h4", { className: "text-lg font-semibold mb-2", children: "Example Content" }),
+                  /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground", children: [
+                    "Neste exemplo, o componente ",
+                    /* @__PURE__ */ jsx("strong", { children: "Header" }),
+                    " principal da aplicação agora suporta receber um array de breadcrumbs para navegações complexas com mais de 3 níveis."
+                  ] })
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Alertas" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+              /* @__PURE__ */ jsxs(Alert, { variant: "info", children: [
+                /* @__PURE__ */ jsx(AlertTitle, { children: "Informação" }),
+                /* @__PURE__ */ jsx(AlertDescription, { children: "Este é um exemplo de alerta informativo usando os componentes do Design System." })
+              ] }),
+              /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
+                /* @__PURE__ */ jsx(AlertTitle, { children: "Erro" }),
+                /* @__PURE__ */ jsx(AlertDescription, { children: "Ocorreu um erro ao processar sua solicitação." })
+              ] }),
+              /* @__PURE__ */ jsxs(Alert, { variant: "success", children: [
+                /* @__PURE__ */ jsx(AlertTitle, { children: "Sucesso" }),
+                /* @__PURE__ */ jsx(AlertDescription, { children: "Operação realizada com sucesso!" })
+              ] }),
+              /* @__PURE__ */ jsxs(Alert, { variant: "warning", children: [
+                /* @__PURE__ */ jsx(AlertTitle, { children: "Aviso" }),
+                /* @__PURE__ */ jsx(AlertDescription, { children: "Atenção: Esta ação não pode ser desfeita." })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Cards & Abas" }),
+            /* @__PURE__ */ jsxs(Tabs, { defaultValue: "overview", className: "w-full", children: [
+              /* @__PURE__ */ jsxs(TabsList, { className: "grid w-full grid-cols-4", children: [
+                /* @__PURE__ */ jsx(TabsTrigger, { value: "overview", children: "Visão Geral" }),
+                /* @__PURE__ */ jsx(TabsTrigger, { value: "forms", children: "Formulários" }),
+                /* @__PURE__ */ jsx(TabsTrigger, { value: "data", children: "Dados" }),
+                /* @__PURE__ */ jsx(TabsTrigger, { value: "settings", children: "Configurações" })
+              ] }),
+              /* @__PURE__ */ jsxs(TabsContent, { value: "overview", className: "space-y-4", children: [
+                /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
+                  /* @__PURE__ */ jsxs(Card, { children: [
+                    /* @__PURE__ */ jsxs(CardHeader, { children: [
+                      /* @__PURE__ */ jsx(CardTitle, { children: "Total de Usuários" }),
+                      /* @__PURE__ */ jsx(CardDescription, { children: "Últimos 30 dias" })
+                    ] }),
+                    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "text-foreground", children: [
+                      /* @__PURE__ */ jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "1,234" }),
+                      /* @__PURE__ */ jsx(Badge, { variant: "default", className: "ml-2", children: "+12%" })
+                    ] }) })
+                  ] }),
+                  /* @__PURE__ */ jsxs(Card, { children: [
+                    /* @__PURE__ */ jsxs(CardHeader, { children: [
+                      /* @__PURE__ */ jsx(CardTitle, { children: "Receita Total" }),
+                      /* @__PURE__ */ jsx(CardDescription, { children: "Mês atual" })
+                    ] }),
+                    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "text-foreground", children: [
+                      /* @__PURE__ */ jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "$ 45.2k" }),
+                      /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "ml-2", children: "+8%" })
+                    ] }) })
+                  ] }),
+                  /* @__PURE__ */ jsxs(Card, { children: [
+                    /* @__PURE__ */ jsxs(CardHeader, { children: [
+                      /* @__PURE__ */ jsx(CardTitle, { children: "Taxa de Conversão" }),
+                      /* @__PURE__ */ jsx(CardDescription, { children: "Semana atual" })
+                    ] }),
+                    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "text-foreground", children: [
+                      /* @__PURE__ */ jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "3.2%" }),
+                      /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "ml-2", children: "-2%" })
+                    ] }) })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs(Card, { children: [
+                  /* @__PURE__ */ jsxs(CardHeader, { children: [
+                    /* @__PURE__ */ jsx(CardTitle, { children: "Progresso & Sliders" }),
+                    /* @__PURE__ */ jsx(CardDescription, { children: "Exemplo de componentes de progresso" })
+                  ] }),
+                  /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                        /* @__PURE__ */ jsx(Label, { children: "Progresso do Projeto" }),
+                        /* @__PURE__ */ jsxs("span", { className: "[font-size:var(--text-small)] text-muted-foreground", children: [
+                          progress,
+                          "%"
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsx(Progress, { value: progress, className: "w-full" }),
+                      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+                        /* @__PURE__ */ jsx(Button, { size: "sm", onClick: () => setProgress(Math.max(0, progress - 10)), children: "-10%" }),
+                        /* @__PURE__ */ jsx(Button, { size: "sm", onClick: () => setProgress(Math.min(100, progress + 10)), children: "+10%" })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx(Separator, {}),
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                        /* @__PURE__ */ jsx(Label, { children: "Volume" }),
+                        /* @__PURE__ */ jsxs("span", { className: "[font-size:var(--text-small)] text-muted-foreground", children: [
+                          sliderValue[0],
+                          "%"
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsx(
+                        Slider,
+                        {
+                          value: sliderValue,
+                          onValueChange: setSliderValue,
+                          min: 0,
+                          max: 100,
+                          step: 1,
+                          className: "w-full",
+                          "aria-label": "Volume"
+                        }
+                      )
+                    ] })
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(TabsContent, { value: "forms", className: "space-y-4", children: /* @__PURE__ */ jsxs(Card, { children: [
+                /* @__PURE__ */ jsxs(CardHeader, { children: [
+                  /* @__PURE__ */ jsx(CardTitle, { children: "Formulário de Cadastro" }),
+                  /* @__PURE__ */ jsx(CardDescription, { children: "Preencha os campos abaixo para criar uma nova conta" })
+                ] }),
+                /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("form", { onSubmit: handleFormSubmit, className: "space-y-4", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "firstName", children: "Nome" }),
+                      /* @__PURE__ */ jsx(Input, { id: "firstName", placeholder: "João" })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "lastName", children: "Sobrenome" }),
+                      /* @__PURE__ */ jsx(Input, { id: "lastName", placeholder: "Silva" })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                    /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "E-mail" }),
+                    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                      /* @__PURE__ */ jsx(Mail, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
+                      /* @__PURE__ */ jsx(Input, { id: "email", type: "email", placeholder: "john@example.com", className: "pl-10" })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                    /* @__PURE__ */ jsx(Label, { htmlFor: "phone", children: "Telefone" }),
+                    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                      /* @__PURE__ */ jsx(Phone, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
+                      /* @__PURE__ */ jsx(Input, { id: "phone", type: "tel", placeholder: "(11) 99999-9999", className: "pl-10" })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                    /* @__PURE__ */ jsx(Label, { htmlFor: "role", children: "Função" }),
+                    /* @__PURE__ */ jsxs(Select, { children: [
+                      /* @__PURE__ */ jsx(SelectTrigger, { id: "role", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Selecione uma função" }) }),
+                      /* @__PURE__ */ jsxs(SelectContent, { children: [
+                        /* @__PURE__ */ jsx(SelectItem, { value: "developer", children: "Desenvolvedor" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "designer", children: "Designer" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "manager", children: "Gerente" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "analyst", children: "Analista" })
+                      ] })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                    /* @__PURE__ */ jsx(Label, { htmlFor: "bio", children: "Biografia" }),
+                    /* @__PURE__ */ jsx(
+                      Textarea,
+                      {
+                        id: "bio",
+                        placeholder: "Conte-nos um pouco sobre você...",
+                        rows: 4
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsx(Separator, {}),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+                    /* @__PURE__ */ jsx("h4", { children: "Preferências" }),
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                        /* @__PURE__ */ jsx(Checkbox, { id: "newsletter" }),
+                        /* @__PURE__ */ jsx(Label, { htmlFor: "newsletter", className: "font-normal", children: "Receber newsletter por e-mail" })
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                        /* @__PURE__ */ jsx(Checkbox, { id: "notifications" }),
+                        /* @__PURE__ */ jsx(Label, { htmlFor: "notifications", className: "font-normal", children: "Ativar notificações push" })
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                        /* @__PURE__ */ jsx(Checkbox, { id: "updates" }),
+                        /* @__PURE__ */ jsx(Label, { htmlFor: "updates", className: "font-normal", children: "Receber atualizações sobre novos recursos" })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx(Separator, {}),
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                      /* @__PURE__ */ jsx(Label, { children: "Tipo de Conta" }),
+                      /* @__PURE__ */ jsxs(RadioGroup, { defaultValue: "personal", "aria-label": "Tipo de Conta", children: [
+                        /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                          /* @__PURE__ */ jsx(RadioGroupItem, { value: "personal", id: "personal" }),
+                          /* @__PURE__ */ jsx(Label, { htmlFor: "personal", className: "font-normal", children: "Pessoal" })
+                        ] }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                          /* @__PURE__ */ jsx(RadioGroupItem, { value: "business", id: "business" }),
+                          /* @__PURE__ */ jsx(Label, { htmlFor: "business", className: "font-normal", children: "Empresarial" })
+                        ] }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                          /* @__PURE__ */ jsx(RadioGroupItem, { value: "enterprise", id: "enterprise" }),
+                          /* @__PURE__ */ jsx(Label, { htmlFor: "enterprise", className: "font-normal", children: "Corporativo" })
+                        ] })
+                      ] })
+                    ] })
+                  ] })
+                ] }) }),
+                /* @__PURE__ */ jsxs(CardFooter, { className: "flex justify-between", children: [
+                  /* @__PURE__ */ jsx(Button, { variant: "outline", children: "Cancelar" }),
+                  /* @__PURE__ */ jsx(Button, { onClick: handleFormSubmit, children: "Criar Conta" })
+                ] })
+              ] }) }),
+              /* @__PURE__ */ jsx(TabsContent, { value: "data", className: "space-y-4", children: /* @__PURE__ */ jsxs(Card, { children: [
+                /* @__PURE__ */ jsxs(CardHeader, { children: [
+                  /* @__PURE__ */ jsx(CardTitle, { children: "Lista de Usuários" }),
+                  /* @__PURE__ */ jsx(CardDescription, { children: "Gerenciar usuários do sistema" })
+                ] }),
+                /* @__PURE__ */ jsxs(CardContent, { children: [
+                  /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                    /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
+                    /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        placeholder: "Buscar usuários...",
+                        "aria-label": "Buscar usuários",
+                        className: "pl-10"
+                      }
+                    )
+                  ] }) }),
+                  /* @__PURE__ */ jsx("div", { className: "rounded-[var(--radius-lg)] border border-border overflow-hidden", children: /* @__PURE__ */ jsxs(Table, { children: [
+                    /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+                      /* @__PURE__ */ jsx(TableHead, { children: "Name" }),
+                      /* @__PURE__ */ jsx(TableHead, { children: "Email" }),
+                      /* @__PURE__ */ jsx(TableHead, { children: "Role" }),
+                      /* @__PURE__ */ jsx(TableHead, { children: "Status" }),
+                      /* @__PURE__ */ jsx(TableHead, { className: "text-right", children: "Actions" })
+                    ] }) }),
+                    /* @__PURE__ */ jsxs(TableBody, { children: [
+                      /* @__PURE__ */ jsxs(TableRow, { children: [
+                        /* @__PURE__ */ jsx(TableCell, { children: "Ana Silva" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "ana.silva@example.com" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "Developer" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Badge, { variant: "default", children: "Active" }) }),
+                        /* @__PURE__ */ jsx(TableCell, { className: "text-right", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: "Edit" }) })
+                      ] }),
+                      /* @__PURE__ */ jsxs(TableRow, { children: [
+                        /* @__PURE__ */ jsx(TableCell, { children: "Bruno Costa" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "bruno.costa@example.com" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "Designer" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Badge, { variant: "default", children: "Active" }) }),
+                        /* @__PURE__ */ jsx(TableCell, { className: "text-right", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: "Edit" }) })
+                      ] }),
+                      /* @__PURE__ */ jsxs(TableRow, { children: [
+                        /* @__PURE__ */ jsx(TableCell, { children: "Carla Oliveira" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "carla.oliveira@example.com" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "Manager" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: "Away" }) }),
+                        /* @__PURE__ */ jsx(TableCell, { className: "text-right", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: "Edit" }) })
+                      ] }),
+                      /* @__PURE__ */ jsxs(TableRow, { children: [
+                        /* @__PURE__ */ jsx(TableCell, { children: "Diego Santos" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "diego.santos@example.com" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: "Analyst" }),
+                        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: "Inactive" }) }),
+                        /* @__PURE__ */ jsx(TableCell, { className: "text-right", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: "Edit" }) })
+                      ] })
+                    ] })
+                  ] }) })
+                ] }),
+                /* @__PURE__ */ jsxs(CardFooter, { className: "flex justify-between items-center", children: [
+                  /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Showing 4 of 127 users" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+                    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", children: "Previous" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", children: "Next" })
+                  ] })
+                ] })
+              ] }) }),
+              /* @__PURE__ */ jsx(TabsContent, { value: "settings", className: "space-y-4", children: /* @__PURE__ */ jsxs(Card, { children: [
+                /* @__PURE__ */ jsxs(CardHeader, { children: [
+                  /* @__PURE__ */ jsx(CardTitle, { children: "Configurações do Sistema" }),
+                  /* @__PURE__ */ jsx(CardDescription, { children: "Gerenciar configurações gerais" })
+                ] }),
+                /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "dark-mode", children: "Dark Mode" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Enable dark theme in the interface" })
+                    ] }),
+                    /* @__PURE__ */ jsx(Switch, { id: "dark-mode", checked: switchEnabled, onCheckedChange: setSwitchEnabled })
+                  ] }),
+                  /* @__PURE__ */ jsx(Separator, {}),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "email-notifications", children: "Email Notifications" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Receive important updates by email" })
+                    ] }),
+                    /* @__PURE__ */ jsx(Switch, { id: "email-notifications", defaultChecked: true })
+                  ] }),
+                  /* @__PURE__ */ jsx(Separator, {}),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "push-notifications", children: "Push Notifications" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Receive instant notifications in the browser" })
+                    ] }),
+                    /* @__PURE__ */ jsx(Switch, { id: "push-notifications" })
+                  ] }),
+                  /* @__PURE__ */ jsx(Separator, {}),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                    /* @__PURE__ */ jsx(Label, { children: "Language" }),
+                    /* @__PURE__ */ jsxs(Select, { defaultValue: "pt-br", children: [
+                      /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Idioma do sistema", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                      /* @__PURE__ */ jsxs(SelectContent, { children: [
+                        /* @__PURE__ */ jsx(SelectItem, { value: "pt-br", children: "Portuguese (Brazil)" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "en", children: "English" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "es", children: "Spanish" })
+                      ] })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx(Separator, {}),
+                  /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                    /* @__PURE__ */ jsx(Label, { children: "Time Zone" }),
+                    /* @__PURE__ */ jsxs(Select, { defaultValue: "america-sao-paulo", children: [
+                      /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Fuso horário", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                      /* @__PURE__ */ jsxs(SelectContent, { children: [
+                        /* @__PURE__ */ jsx(SelectItem, { value: "america-sao-paulo", children: "America/Sao Paulo (GMT-3)" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "america-new-york", children: "America/New York (GMT-5)" }),
+                        /* @__PURE__ */ jsx(SelectItem, { value: "europe-london", children: "Europe/London (GMT+0)" })
+                      ] })
+                    ] })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs(CardFooter, { className: "flex justify-between", children: [
+                  /* @__PURE__ */ jsx(Button, { variant: "outline", children: "Restaurar Padrões" }),
+                  /* @__PURE__ */ jsx(Button, { children: "Salvar Alterações" })
+                ] })
+              ] }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Botões" }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "Variações de Botão" }),
+                /* @__PURE__ */ jsx(CardDescription, { children: "Diferentes estilos e tamanhos de botões" })
+              ] }),
+              /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+                /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                  /* @__PURE__ */ jsx(Label, { children: "Variants" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+                    /* @__PURE__ */ jsx(Button, { variant: "default", children: "Default" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "secondary", children: "Secondary" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "outline", children: "Outline" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "ghost", children: "Ghost" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "link", children: "Link" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "destructive", children: "Destructive" })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(Separator, {}),
+                /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                  /* @__PURE__ */ jsx(Label, { children: "Sizes" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
+                    /* @__PURE__ */ jsx(Button, { size: "sm", children: "Small" }),
+                    /* @__PURE__ */ jsx(Button, { size: "default", children: "Default" }),
+                    /* @__PURE__ */ jsx(Button, { size: "lg", children: "Large" }),
+                    /* @__PURE__ */ jsx(Button, { size: "icon", "aria-label": "Configurações", children: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }) })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(Separator, {}),
+                /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                  /* @__PURE__ */ jsx(Label, { children: "With Icons" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+                    /* @__PURE__ */ jsxs(Button, { children: [
+                      /* @__PURE__ */ jsx(User, { className: "mr-2 h-4 w-4" }),
+                      "Profile"
+                    ] }),
+                    /* @__PURE__ */ jsxs(Button, { variant: "secondary", children: [
+                      /* @__PURE__ */ jsx(Mail, { className: "mr-2 h-4 w-4" }),
+                      "Messages"
+                    ] }),
+                    /* @__PURE__ */ jsxs(Button, { variant: "outline", children: [
+                      /* @__PURE__ */ jsx(Calendar, { className: "mr-2 h-4 w-4" }),
+                      "Schedule"
+                    ] })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(Separator, {}),
+                /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+                  /* @__PURE__ */ jsx(Label, { children: "States" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+                    /* @__PURE__ */ jsx(Button, { disabled: true, children: "Disabled" }),
+                    /* @__PURE__ */ jsx(Button, { variant: "outline", disabled: true, children: "Outline Disabled" })
+                  ] })
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Badges" }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "Variações de Badge" }),
+                /* @__PURE__ */ jsx(CardDescription, { children: "Estilos diferentes de badge para status e tags" })
+              ] }),
+              /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+                /* @__PURE__ */ jsx(Badge, { variant: "default", children: "Padrão" }),
+                /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: "Secundário" }),
+                /* @__PURE__ */ jsx(Badge, { variant: "outline", children: "Contorno" }),
+                /* @__PURE__ */ jsx(Badge, { variant: "destructive", children: "Destrutivo" }),
+                /* @__PURE__ */ jsx(Badge, { className: "bg-success text-success-foreground", children: "Sucesso" }),
+                /* @__PURE__ */ jsx(Badge, { className: "bg-warning text-warning-foreground", children: "Aviso" }),
+                /* @__PURE__ */ jsx(Badge, { className: "bg-info text-info-foreground", children: "Info" })
+              ] }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Diálogos" }),
+            /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
+              /* @__PURE__ */ jsxs(Card, { children: [
+                /* @__PURE__ */ jsxs(CardHeader, { children: [
+                  /* @__PURE__ */ jsx(CardTitle, { children: "Diálogo" }),
+                  /* @__PURE__ */ jsx(CardDescription, { children: "Um modal interativo básico" })
+                ] }),
+                /* @__PURE__ */ jsx(CardContent, { className: "flex justify-center py-6", children: /* @__PURE__ */ jsxs(Dialog, { children: [
+                  /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "outline", children: "Editar Perfil" }) }),
+                  /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[425px]", children: [
+                    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+                      /* @__PURE__ */ jsx(DialogTitle, { children: "Editar Perfil" }),
+                      /* @__PURE__ */ jsx(DialogDescription, { children: "Faça alterações no seu perfil aqui. Clique em salvar quando terminar." })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 py-4", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-4 items-center gap-4", children: [
+                        /* @__PURE__ */ jsx(Label, { htmlFor: "name", className: "text-right", children: "Nome" }),
+                        /* @__PURE__ */ jsx(Input, { id: "name", defaultValue: "John Doe", className: "col-span-3" })
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-4 items-center gap-4", children: [
+                        /* @__PURE__ */ jsx(Label, { htmlFor: "username", className: "text-right", children: "Usuário" }),
+                        /* @__PURE__ */ jsx(Input, { id: "username", defaultValue: "@johndoe", className: "col-span-3" })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(Button, { type: "submit", children: "Atualizar" }) })
+                  ] })
+                ] }) })
+              ] }),
+              /* @__PURE__ */ jsxs(Card, { children: [
+                /* @__PURE__ */ jsxs(CardHeader, { children: [
+                  /* @__PURE__ */ jsx(CardTitle, { children: "Alerta de Diálogo" }),
+                  /* @__PURE__ */ jsx(CardDescription, { children: "Um alerta para decisões importantes" })
+                ] }),
+                /* @__PURE__ */ jsx(CardContent, { className: "flex justify-center py-6", children: /* @__PURE__ */ jsxs(AlertDialog, { children: [
+                  /* @__PURE__ */ jsx(AlertDialogTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "destructive", children: "Excluir Conta" }) }),
+                  /* @__PURE__ */ jsxs(AlertDialogContent, { className: "sm:max-w-[425px]", children: [
+                    /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
+                      /* @__PURE__ */ jsx(AlertDialogTitle, { children: "Você tem certeza absoluta?" }),
+                      /* @__PURE__ */ jsx(AlertDialogDescription, { children: "Esta ação não pode ser desfeita. Isso excluirá permanentemente sua conta e removerá seus dados de nossos servidores." })
+                    ] }),
+                    /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
+                      /* @__PURE__ */ jsx(AlertDialogCancel, { children: "Cancelar" }),
+                      /* @__PURE__ */ jsx(AlertDialogAction, { className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: "Continuar" })
+                    ] })
+                  ] })
+                ] }) })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsx("section", { children: /* @__PURE__ */ jsx(MapShowcase, {}) }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Variações de Cabeçalho" }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "Configurações do Cabeçalho Principal" }),
+                /* @__PURE__ */ jsx(CardDescription, { children: "O Header é focado em navegação (breadcrumbs) e ações contextuais rápidas." })
+              ] }),
+              /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+                /* @__PURE__ */ jsxs("div", { className: "p-4 border rounded-[var(--radius-lg)] bg-muted/30", children: [
+                  /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold mb-4", children: "Elementos Visíveis" }),
+                  /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsx(Switch, { id: "header-actions", checked: showHeaderActions, onCheckedChange: setShowHeaderActions }),
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "header-actions", className: "cursor-pointer", children: "Botões de Ação" })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsx(Switch, { id: "header-bread", checked: showHeaderBreadcrumbs, onCheckedChange: setShowHeaderBreadcrumbs }),
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "header-bread", className: "cursor-pointer", children: "Breadcrumbs" })
+                    ] })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "relative border rounded-[var(--radius-lg)] bg-muted/10 overflow-hidden shadow-inner", children: [
+                  /* @__PURE__ */ jsx("div", { className: "p-4 bg-background/50 border-b text-xs font-mono text-muted-foreground", children: "Visualização" }),
+                  /* @__PURE__ */ jsx(
+                    Header,
+                    {
+                      title: !showHeaderBreadcrumbs ? "Página Atual" : void 0,
+                      breadcrumbs: showHeaderBreadcrumbs ? [
+                        { label: "Xertica UI", href: "#", icon: /* @__PURE__ */ jsx(Home, { className: "w-4 h-4" }) },
+                        { label: "Configurações", href: "#" },
+                        { label: "Perfil" }
+                      ] : void 0,
+                      actions: showHeaderActions ? [
+                        { id: "notify", icon: /* @__PURE__ */ jsx(Bell, { className: "w-5 h-5" }), onClick: () => toast("Notificações abertas") },
+                        { id: "mail", label: "Mensagens", icon: /* @__PURE__ */ jsx(Mail, { className: "w-5 h-5" }), onClick: () => toast("Mensagens abertas") }
+                      ] : void 0
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { className: "h-32 flex items-center justify-center text-muted-foreground text-sm italic", children: "Área de Conteúdo da Página" })
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs("section", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "mb-4", children: "Variações da Sidebar" }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "Sidebar Modo Assistente vs Padrão" }),
+                /* @__PURE__ */ jsx(CardDescription, { children: "A Sidebar suporta flexibilidade através da propriedade variant." })
+              ] }),
+              /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: "assistant", className: "w-full", children: [
+                /* @__PURE__ */ jsxs(TabsList, { className: "mb-4", children: [
+                  /* @__PURE__ */ jsx(TabsTrigger, { value: "assistant", children: "Modo Assistente" }),
+                  /* @__PURE__ */ jsx(TabsTrigger, { value: "default", children: "Modo Padrão" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "mb-6 p-4 border rounded-[var(--radius-lg)] bg-muted/30", children: [
+                  /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold mb-4", children: "Configurações do Rodapé" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-6 mt-2", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsx(Switch, { id: "show-user", checked: showSidebarUser, onCheckedChange: setShowSidebarUser }),
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "show-user", className: "cursor-pointer", children: "Perfil do Usuário" })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsx(Switch, { id: "show-settings", checked: showSidebarSettings, onCheckedChange: setShowSidebarSettings }),
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "show-settings", className: "cursor-pointer", children: "Configurações" })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+                      /* @__PURE__ */ jsx(Switch, { id: "show-logout", checked: showSidebarLogout, onCheckedChange: setShowSidebarLogout }),
+                      /* @__PURE__ */ jsx(Label, { htmlFor: "show-logout", className: "cursor-pointer", children: "Botão de Sair" })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "mt-6 pt-6 border-t", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+                      /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold", children: "Largura da Sidebar (Desktop)" }),
+                      /* @__PURE__ */ jsxs("span", { className: "text-xs font-mono bg-muted px-2 py-1 rounded", children: [
+                        sidebarWidth,
+                        "px"
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+                      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground w-12 text-right", children: "240px" }),
+                      /* @__PURE__ */ jsx(
+                        Slider,
+                        {
+                          value: [sidebarWidth],
+                          onValueChange: (val) => setSidebarWidth(val[0]),
+                          min: 240,
+                          max: 450,
+                          step: 10,
+                          className: "flex-1",
+                          "aria-label": "Largura da Sidebar"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground w-12", children: "450px" })
+                    ] })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(TabsContent, { value: "assistant", children: /* @__PURE__ */ jsxs("div", { className: "relative h-[600px] border rounded-[var(--radius-lg)] bg-muted/20 overflow-hidden", style: { transform: "translateZ(0)" }, children: [
+                  /* @__PURE__ */ jsx(
+                    Sidebar,
+                    {
+                      expanded: true,
+                      width: sidebarWidth,
+                      onToggle: () => {
+                      },
+                      user: { email: "admin@xertica.com" },
+                      onLogout: () => toast("Saiu"),
+                      location: { pathname: "/assistant/current" },
+                      navigate: () => {
+                      },
+                      variant: "assistant",
+                      search: {
+                        show: true,
+                        placeholder: "Buscar tópicos...",
+                        filter: {
+                          show: true,
+                          content: /* @__PURE__ */ jsxs("div", { className: "p-2 space-y-2", children: [
+                            /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold uppercase text-muted-foreground px-2", children: "Filtrar por Status" }),
+                            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2 p-1", children: [
+                              /* @__PURE__ */ jsx(Badge, { className: "bg-sidebar-foreground/20 text-sidebar-foreground border-none cursor-pointer hover:bg-sidebar-foreground/30", children: "Ativo" }),
+                              /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-sidebar-foreground/70 border-sidebar-foreground/20 cursor-pointer hover:bg-sidebar-foreground/10", children: "Arquivado" }),
+                              /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-sidebar-foreground/70 border-sidebar-foreground/20 cursor-pointer hover:bg-sidebar-foreground/10", children: "Pendente" })
+                            ] })
+                          ] })
+                        }
+                      },
+                      fixedArea: {
+                        show: true,
+                        content: /* @__PURE__ */ jsxs(Button, { className: "w-full bg-sidebar-primary hover:bg-sidebar-primary/90 text-sidebar-primary-foreground shadow-lg font-bold border-none transition-all duration-300 transform hover:scale-[1.02] active:scale-[0.98]", children: [
+                          /* @__PURE__ */ jsx(Plus, { className: "w-4 h-4 mr-2" }),
+                          "Nova Conversa"
+                        ] })
+                      },
+                      navigationGroups: [
+                        {
+                          id: "recent",
+                          label: "Recentes",
+                          icon: Clock,
+                          items: [
+                            {
+                              path: "/assistant/refatoracao",
+                              label: "Refatoração da Sidebar",
+                              description: "Ativo agora",
+                              actions: [
+                                { label: "Renomear", icon: FileEdit, onClick: () => toast("Abrir renomear...") },
+                                {
+                                  label: "Mover",
+                                  icon: ArrowRightLeft,
+                                  children: [
+                                    { label: "Projetos Ativos", onClick: () => toast("Movido para Projetos Ativos") },
+                                    { label: "Monitoramento", onClick: () => toast("Movido para Monitoramento") },
+                                    { label: "Arquivar", onClick: () => toast("Movido para Arquivo") }
+                                  ]
+                                },
+                                { label: "Limpar", icon: Trash2, onClick: () => toast("Histórico Limpo!"), variant: "destructive" }
+                              ]
+                            }
+                          ]
+                        },
+                        {
+                          id: "projects",
+                          label: "Monitoramento de Projetos",
+                          icon: Map$1,
+                          actions: [
+                            { label: "Nova Categoria", icon: Plus, onClick: () => toast("Criar nova categoria...") },
+                            { label: "Arquivar Grupo", icon: Archive, onClick: () => toast("Arquivando grupo...") }
+                          ],
+                          items: [
+                            {
+                              path: "/assistant/br163",
+                              label: "Restauração BR-163",
+                              icon: () => /* @__PURE__ */ jsx("div", { className: "w-2 h-2 rounded-full bg-yellow-500" }),
+                              description: /* @__PURE__ */ jsxs("div", { className: "space-y-1.5 min-w-[160px]", children: [
+                                /* @__PURE__ */ jsx(Progress, { value: 67, className: "h-1.5 bg-sidebar-foreground/10" }),
+                                /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center text-[10px] text-sidebar-foreground/60", children: [
+                                  /* @__PURE__ */ jsx("span", { children: "Cuiabá, MT" }),
+                                  /* @__PURE__ */ jsx("span", { children: "67%" })
+                                ] })
+                              ] })
+                            }
+                          ]
+                        }
+                      ],
+                      footer: {
+                        showUser: showSidebarUser,
+                        showSettings: showSidebarSettings,
+                        showLogout: showSidebarLogout
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 p-8 flex items-center justify-center transition-all duration-300", style: { left: `${sidebarWidth}px` }, children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-center", children: "Conteúdo do Modo Assistente" }) })
+                ] }) }),
+                /* @__PURE__ */ jsx(TabsContent, { value: "default", children: /* @__PURE__ */ jsxs("div", { className: "relative h-[600px] border rounded-[var(--radius-lg)] bg-muted/20 overflow-hidden", style: { transform: "translateZ(0)" }, children: [
+                  /* @__PURE__ */ jsx(
+                    Sidebar,
+                    {
+                      expanded: true,
+                      width: sidebarWidth,
+                      onToggle: () => {
+                      },
+                      user: {
+                        name: "Ariel Santos",
+                        email: "admin@xertica.com",
+                        avatar: "https://github.com/shadcn.png"
+                      },
+                      onLogout: () => toast("Saiu"),
+                      onSettingsClick: () => toast("Configurações clicadas"),
+                      location: { pathname: "/home" },
+                      navigate: () => {
+                      },
+                      variant: "default",
+                      routes: [
+                        { path: "/home", label: "Início", icon: Home },
+                        { path: "/dashboard", label: "Dashboard", icon: Users },
+                        { path: "/settings", label: "Configurações", icon: Settings }
+                      ],
+                      footer: {
+                        showUser: showSidebarUser,
+                        showSettings: showSidebarSettings,
+                        showLogout: showSidebarLogout
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 right-0 p-8 flex items-center justify-center transition-all duration-300", style: { left: `${sidebarWidth}px` }, children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-center", children: "Navegação Tradicional do Sistema" }) })
+                ] }) })
+              ] }) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+          /* @__PURE__ */ jsxs(Card, { className: "mt-8", children: [
+            /* @__PURE__ */ jsxs(CardHeader, { children: [
+              /* @__PURE__ */ jsx(CardTitle, { children: "Template Pronto para CLI" }),
+              /* @__PURE__ */ jsx(CardDescription, { children: "Como usar este template" })
+            ] }),
+            /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
+              /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground", children: [
+                "Este template está pronto para ser usado como base para novos projetos. Todos os componentes usam as variáveis CSS definidas em ",
+                /* @__PURE__ */ jsx("code", { className: "bg-muted px-2 py-1 rounded-[var(--radius-sm)] [font-size:var(--text-small)]", children: "/styles/xertica/tokens.css" }),
+                "and follow the Xertica UI CLI-first architecture."
+              ] }),
+              /* @__PURE__ */ jsxs(Alert, { variant: "info", children: [
+                /* @__PURE__ */ jsx(AlertTitle, { children: "Dica" }),
+                /* @__PURE__ */ jsx(AlertDescription, { children: "Copie este arquivo como ponto de partida para suas páginas. Todos os componentes são reutilizáveis e customizáveis através de variáveis CSS." })
+              ] })
+            ] })
+          ] })
+        ] }) }) }) })
+      ]
+    }
+  );
+}
+function TemplatePage({ user, onLogout }) {
+  const layout = useOptionalLayout();
+  const [localSidebarExpanded, setLocalSidebarExpanded] = React__default.useState(false);
+  const [localAssistantExpanded, setLocalAssistantExpanded] = React__default.useState(false);
+  const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
+  const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 280;
+  const assistenteExpanded = (layout == null ? void 0 : layout.assistenteExpanded) ?? localAssistantExpanded;
+  const toggleSidebar = (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
+  const toggleAssistente = (layout == null ? void 0 : layout.toggleAssistente) ?? (() => setLocalAssistantExpanded((value) => !value));
+  const location = useLocation();
+  const navigate = useNavigate();
+  return /* @__PURE__ */ jsxs("div", { className: "h-screen flex bg-muted overflow-hidden relative", children: [
+    /* @__PURE__ */ jsx(
+      Sidebar,
+      {
+        expanded: sidebarExpanded,
+        width: sidebarWidth,
+        onToggle: toggleSidebar,
+        user: {
+          ...user,
+          name: "Ariel Santos",
+          avatar: "https://github.com/shadcn.png"
+        },
+        onLogout,
+        onSettingsClick: () => navigate("/settings"),
+        location,
+        navigate,
+        routes
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      TemplateContent,
+      {
+        user,
+        onLogout,
+        onSettings: () => navigate("/settings")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      XerticaAssistant,
+      {
+        isExpanded: assistenteExpanded,
+        onToggle: toggleAssistente,
+        onEvaluation: () => {
+        }
+      }
+    )
+  ] });
+}
+function VerifyEmailPage() {
+  var _a;
+  const navigate = useNavigate();
+  const location = useLocation();
+  const email = ((_a = location.state) == null ? void 0 : _a.email) || "your@email.com";
+  const [isResending, setIsResending] = useState(false);
+  const [resendSuccess, setResendSuccess] = useState(false);
+  const handleResend = async () => {
+    setIsResending(true);
+    setResendSuccess(false);
+    await new Promise((resolve) => setTimeout(resolve, 1500));
+    setIsResending(false);
+    setResendSuccess(true);
+    setTimeout(() => setResendSuccess(false), 3e3);
+  };
+  const handleSocialLogin = (_provider) => {
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen flex", children: [
+    /* @__PURE__ */ jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
+      /* @__PURE__ */ jsx(
+        ImageWithFallback,
+        {
+          src: "https://images.unsplash.com/photo-1563986768609-322da13575f3?w=1200&h=800&fit=crop&auto=format",
+          alt: "E-mail e comunicação",
+          className: "absolute inset-0 w-full h-full object-cover"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 flex items-center justify-center px-4 sm:px-6 lg:px-8 lg:flex-none lg:w-1/2 relative bg-muted", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsx(LanguageSelector, { variant: "minimal", showIcon: false }) }),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
+      /* @__PURE__ */ jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
+        /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx(
+            XerticaLogo,
+            {
+              className: "h-12 w-auto text-primary dark:text-foreground",
+              variant: "theme"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx("div", { className: "p-4 bg-primary/10 rounded-[var(--radius)]", children: /* @__PURE__ */ jsx(Mail, { className: "w-12 h-12 text-primary" }) }) }),
+          /* @__PURE__ */ jsx("h2", { className: "text-sm text-muted-foreground", children: "Verifique seu e-mail" }),
+          /* @__PURE__ */ jsx("p", { className: "mt-2 text-muted-foreground", children: "Enviamos as instruções para redefinir sua senha para:" }),
+          /* @__PURE__ */ jsx("p", { className: "mt-1 text-primary", children: email })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bg-accent rounded-[var(--radius)] p-4 space-y-3", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Siga as instruções no e-mail para redefinir sua senha. O link expira em 24 horas." }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(CheckCircle2, { className: "w-4 h-4 mt-0.5 flex-shrink-0 text-[var(--chart-2)]" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Verifique sua pasta de spam se não encontrar o e-mail" })
+          ] })
+        ] }),
+        resendSuccess && /* @__PURE__ */ jsxs("div", { className: "bg-[var(--chart-2)]/10 border border-[var(--chart-2)]/20 rounded-[var(--radius)] p-3 flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(CheckCircle2, { className: "w-5 h-5 text-[var(--chart-2)] flex-shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-[var(--chart-2)]", children: "E-mail reenviado com sucesso!" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-center text-muted-foreground", children: "Não recebeu o e-mail?" }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              className: "w-full",
+              onClick: handleResend,
+              disabled: isResending,
+              children: isResending ? "Reenviando..." : "Reenviar e-mail"
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              onClick: () => navigate("/login"),
+              variant: "outline",
+              className: "w-full text-muted-foreground hover:text-foreground",
+              children: [
+                /* @__PURE__ */ jsx(ArrowLeft, { className: "w-4 h-4 mr-2" }),
+                "Voltar para o login"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t border-border" }) }),
+          /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: "ou continue com" }) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
+                  /* @__PURE__ */ jsx("path", { fill: "#EA4335", d: "M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#4285F4", d: "M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#FBBC05", d: "M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "#34A853", d: "M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z" }),
+                  /* @__PURE__ */ jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
+                ] }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com Google" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center",
+              onClick: () => handleSocialLogin(),
+              children: [
+                /* @__PURE__ */ jsx(Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
+                /* @__PURE__ */ jsx("span", { children: "Entrar com MT Login" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              className: "w-full justify-center font-normal",
+              onClick: () => handleSocialLogin(),
+              children: /* @__PURE__ */ jsxs("span", { children: [
+                "Entrar com ",
+                /* @__PURE__ */ jsx("strong", { className: "font-semibold", children: "gov.br" })
+              ] })
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+export {
+  ForgotPasswordPage as F,
+  HomeContent as H,
+  LoginPage as L,
+  ResetPasswordPage as R,
+  TemplateContent as T,
+  VerifyEmailPage as V,
+  HomePage as a,
+  TemplatePage as b
+};