xertica-ui 2.2.0 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/README.md +1 -1
  3. package/dist/ThemeContext-BgclCB35.js +1856 -0
  4. package/dist/ThemeContext-DQUOeziy.cjs +1855 -0
  5. package/dist/VerifyEmailPage-RrUApqBN.js +3214 -0
  6. package/dist/VerifyEmailPage-VoMI7MYH.cjs +3213 -0
  7. package/dist/XerticaProvider-BSyFrmC0.js +49 -0
  8. package/dist/XerticaProvider-CiNKjMx1.cjs +48 -0
  9. package/dist/XerticaXLogo-B2svDGZh.cjs +251 -0
  10. package/dist/XerticaXLogo-CowGv7BC.js +252 -0
  11. package/dist/brand.cjs.js +2 -2
  12. package/dist/brand.es.js +2 -2
  13. package/dist/hooks.cjs.js +1 -1
  14. package/dist/hooks.es.js +1 -1
  15. package/dist/index.cjs.js +5 -5
  16. package/dist/index.es.js +5 -5
  17. package/dist/layout.cjs.js +1 -1
  18. package/dist/layout.es.js +1 -1
  19. package/dist/pages.cjs.js +1 -1
  20. package/dist/pages.es.js +1 -1
  21. package/dist/sidebar-CRMiBtAi.js +801 -0
  22. package/dist/sidebar-CZ2mWaMM.cjs +800 -0
  23. package/dist/xertica-ui.css +1 -1
  24. package/package.json +1 -1
  25. package/templates/CLAUDE.md +165 -180
  26. package/templates/package.json +2 -2
  27. package/templates/src/features/auth/ui/ForgotPasswordContent.tsx +9 -7
  28. package/templates/src/features/auth/ui/LoginContent.tsx +10 -8
  29. package/templates/src/features/auth/ui/ResetPasswordContent.tsx +179 -177
  30. package/templates/src/features/auth/ui/SocialLoginButtons.tsx +9 -4
  31. package/templates/src/features/auth/ui/VerifyEmailContent.tsx +84 -82
  32. package/templates/src/features/template/ui/TemplateContent.tsx +1 -1
  33. package/templates/src/locales/en/components/assistant.json +14 -0
  34. package/templates/src/locales/en/pages/forgotPassword.json +10 -0
  35. package/templates/src/locales/en/pages/templates.json +1 -1
  36. package/templates/src/locales/es/components/assistant.json +14 -0
  37. package/templates/src/locales/es/pages/forgotPassword.json +10 -0
  38. package/templates/src/locales/es/pages/templates.json +1 -1
  39. package/templates/src/locales/pt-BR/components/assistant.json +14 -0
  40. package/templates/src/locales/pt-BR/pages/forgotPassword.json +10 -0
  41. package/templates/src/locales/pt-BR/pages/templates.json +1 -1
  42. package/templates/src/pages/AssistantPage.tsx +464 -463
@@ -0,0 +1,3213 @@
1
+ "use strict";
2
+ const jsxRuntime = require("react/jsx-runtime");
3
+ const React = require("react");
4
+ const button = require("./button-Bnv9SvYK.cjs");
5
+ const input = require("./input-CNFHVKvo.cjs");
6
+ const alertDialog = require("./alert-dialog-B4M3vQKS.cjs");
7
+ const XerticaXLogo = require("./XerticaXLogo-B2svDGZh.cjs");
8
+ const lucideReact = require("lucide-react");
9
+ const reactRouterDom = require("react-router-dom");
10
+ const sidebar = require("./sidebar-CZ2mWaMM.cjs");
11
+ const skeleton = require("./skeleton-4zoHiFJ_.cjs");
12
+ const progress = require("./progress-DDeuWPZw.cjs");
13
+ const LayoutContext = require("./LayoutContext-C4kKN9RV.cjs");
14
+ const ThemeContext = require("./ThemeContext-DQUOeziy.cjs");
15
+ const reactQuery = require("@tanstack/react-query");
16
+ const reactI18next = require("react-i18next");
17
+ const FeatureCardSkeleton = require("./FeatureCardSkeleton-mO3Bdm_V.cjs");
18
+ const xerticaAssistant = require("./xertica-assistant-d2qs2Vd9.cjs");
19
+ const i18n = require("i18next");
20
+ const richTextEditor = require("./rich-text-editor-CyggTOLQ.cjs");
21
+ const select = require("./select-Cmb8zF7w.cjs");
22
+ const slider = require("./slider-DcJharR9.cjs");
23
+ const sonner = require("sonner");
24
+ const zustand = require("zustand");
25
+ function ForgotPasswordPage() {
26
+ const navigate = reactRouterDom.useNavigate();
27
+ const [email, setEmail] = React.useState("");
28
+ const [isLoading, setIsLoading] = React.useState(false);
29
+ const handleSubmit = async (e) => {
30
+ e.preventDefault();
31
+ setIsLoading(true);
32
+ await new Promise((resolve) => setTimeout(resolve, 1500));
33
+ navigate("/verify-email", { state: { email } });
34
+ setIsLoading(false);
35
+ };
36
+ const handleSocialLogin = (_provider) => {
37
+ };
38
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen flex", children: [
39
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
40
+ /* @__PURE__ */ jsxRuntime.jsx(
41
+ alertDialog.ImageWithFallback,
42
+ {
43
+ src: "https://images.unsplash.com/photo-1557804506-669a67965ba0?w=1200&h=800&fit=crop&auto=format",
44
+ alt: "Segurança e tecnologia",
45
+ className: "absolute inset-0 w-full h-full object-cover"
46
+ }
47
+ ),
48
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
49
+ ] }),
50
+ /* @__PURE__ */ jsxRuntime.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: [
51
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsxRuntime.jsx(XerticaXLogo.LanguageSelector, { variant: "minimal", showIcon: false }) }),
52
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
53
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
54
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
55
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
56
+ XerticaXLogo.XerticaLogo,
57
+ {
58
+ className: "h-12 w-auto text-primary dark:text-foreground",
59
+ variant: "theme"
60
+ }
61
+ ) }),
62
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm text-muted-foreground", children: "Recuperar senha" }),
63
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-muted-foreground", children: "Digite seu e-mail e enviaremos as instruções para redefinir sua senha" })
64
+ ] }),
65
+ /* @__PURE__ */ jsxRuntime.jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
66
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "form-group space-y-2", children: [
67
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "email", className: "form-label", children: "E-mail" }),
68
+ /* @__PURE__ */ jsxRuntime.jsx(
69
+ input.Input,
70
+ {
71
+ id: "email",
72
+ name: "email",
73
+ type: "email",
74
+ required: true,
75
+ className: "w-full",
76
+ placeholder: "seu@email.com",
77
+ value: email,
78
+ onChange: (e) => setEmail(e.target.value)
79
+ }
80
+ )
81
+ ] }),
82
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
83
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Enviando..." : "Enviar instruções" }),
84
+ /* @__PURE__ */ jsxRuntime.jsxs(
85
+ button.Button,
86
+ {
87
+ type: "button",
88
+ onClick: () => navigate("/login"),
89
+ variant: "outline",
90
+ className: "w-full text-muted-foreground hover:text-foreground",
91
+ children: [
92
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "w-4 h-4 mr-2" }),
93
+ "Voltar para o login"
94
+ ]
95
+ }
96
+ )
97
+ ] })
98
+ ] }),
99
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
100
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full border-t border-border" }) }),
101
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: "ou continue com" }) })
102
+ ] }),
103
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
104
+ /* @__PURE__ */ jsxRuntime.jsxs(
105
+ button.Button,
106
+ {
107
+ type: "button",
108
+ variant: "outline",
109
+ className: "w-full justify-center",
110
+ onClick: () => handleSocialLogin(),
111
+ children: [
112
+ /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
113
+ /* @__PURE__ */ jsxRuntime.jsx(
114
+ "path",
115
+ {
116
+ fill: "#EA4335",
117
+ 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"
118
+ }
119
+ ),
120
+ /* @__PURE__ */ jsxRuntime.jsx(
121
+ "path",
122
+ {
123
+ fill: "#4285F4",
124
+ 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"
125
+ }
126
+ ),
127
+ /* @__PURE__ */ jsxRuntime.jsx(
128
+ "path",
129
+ {
130
+ fill: "#FBBC05",
131
+ 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"
132
+ }
133
+ ),
134
+ /* @__PURE__ */ jsxRuntime.jsx(
135
+ "path",
136
+ {
137
+ fill: "#34A853",
138
+ 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"
139
+ }
140
+ ),
141
+ /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
142
+ ] }),
143
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Entrar com Google" })
144
+ ]
145
+ }
146
+ ),
147
+ /* @__PURE__ */ jsxRuntime.jsxs(
148
+ button.Button,
149
+ {
150
+ type: "button",
151
+ variant: "outline",
152
+ className: "w-full justify-center",
153
+ onClick: () => handleSocialLogin(),
154
+ children: [
155
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
156
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Entrar com MT Login" })
157
+ ]
158
+ }
159
+ ),
160
+ /* @__PURE__ */ jsxRuntime.jsx(
161
+ button.Button,
162
+ {
163
+ type: "button",
164
+ variant: "outline",
165
+ className: "w-full justify-center font-normal",
166
+ onClick: () => handleSocialLogin(),
167
+ children: /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
168
+ "Entrar com ",
169
+ /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "font-semibold", children: "gov.br" })
170
+ ] })
171
+ }
172
+ )
173
+ ] })
174
+ ] })
175
+ ] })
176
+ ] });
177
+ }
178
+ const SIDEBAR_COLLAPSED_WIDTH = 80;
179
+ const t = (key, options) => i18n.t(key, options);
180
+ const MOCK_TEAM_MEMBERS = [
181
+ { id: "1", name: "Ana Silva", email: "ana.silva@example.com", role: "Developer", status: "active" },
182
+ { id: "2", name: "Bruno Costa", email: "bruno.costa@example.com", role: "Designer", status: "active" },
183
+ { id: "3", name: "Carla Oliveira", email: "carla.oliveira@example.com", role: "Manager", status: "away" },
184
+ { id: "4", name: "Diego Santos", email: "diego.santos@example.com", role: "Analyst", status: "inactive" }
185
+ ];
186
+ async function fetchTeamMembers() {
187
+ await new Promise((resolve) => setTimeout(resolve, 250));
188
+ return MOCK_TEAM_MEMBERS;
189
+ }
190
+ async function fetchFeatureCards() {
191
+ await new Promise((resolve) => setTimeout(resolve, 100));
192
+ return [
193
+ {
194
+ id: "template-cli",
195
+ title: t("home.templateCliTitle"),
196
+ description: t("home.templateCliDescription"),
197
+ badge: t("home.templateClibadge"),
198
+ href: "/template"
199
+ }
200
+ ];
201
+ }
202
+ function useTeamMembers() {
203
+ const { language } = ThemeContext.useLanguage();
204
+ return reactQuery.useQuery({
205
+ // Language is part of the key so each locale has its own cache slot.
206
+ queryKey: ["home", "team-members", language],
207
+ queryFn: fetchTeamMembers,
208
+ staleTime: 2 * 60 * 1e3
209
+ // 2 min
210
+ });
211
+ }
212
+ function useFeatureCards() {
213
+ const { language } = ThemeContext.useLanguage();
214
+ return reactQuery.useQuery({
215
+ // Language is part of the key so each locale has its own cache slot.
216
+ queryKey: ["home", "feature-cards", language],
217
+ queryFn: fetchFeatureCards,
218
+ staleTime: 10 * 60 * 1e3
219
+ // 10 min — feature list is fairly static
220
+ });
221
+ }
222
+ const useDashboardStore = zustand.create((set) => ({
223
+ // Filters
224
+ activeTab: "overview",
225
+ setActiveTab: (tab) => set({ activeTab: tab }),
226
+ // UI toggles
227
+ statsExpanded: true,
228
+ toggleStats: () => set((state) => ({ statsExpanded: !state.statsExpanded })),
229
+ // Showcase controls
230
+ progress: 45,
231
+ setProgress: (value) => set({ progress: value }),
232
+ sliderValue: [50],
233
+ setSliderValue: (value) => set({ sliderValue: value }),
234
+ switchEnabled: false,
235
+ toggleSwitch: () => set((state) => ({ switchEnabled: !state.switchEnabled }))
236
+ }));
237
+ function isDev() {
238
+ return false;
239
+ }
240
+ function SectionErrorFallback({ error, reset }) {
241
+ return /* @__PURE__ */ jsxRuntime.jsxs(
242
+ "div",
243
+ {
244
+ role: "alert",
245
+ className: "flex flex-col items-center justify-center gap-3 p-6 rounded-[var(--radius-lg)] border border-destructive/30 bg-destructive/5 text-center",
246
+ children: [
247
+ /* @__PURE__ */ jsxRuntime.jsxs(
248
+ "svg",
249
+ {
250
+ width: "24",
251
+ height: "24",
252
+ viewBox: "0 0 24 24",
253
+ fill: "none",
254
+ stroke: "currentColor",
255
+ strokeWidth: "2",
256
+ strokeLinecap: "round",
257
+ strokeLinejoin: "round",
258
+ className: "text-destructive shrink-0",
259
+ "aria-hidden": "true",
260
+ children: [
261
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
262
+ /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
263
+ /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
264
+ ]
265
+ }
266
+ ),
267
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
268
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: "Não foi possível carregar este conteúdo" }),
269
+ isDev()
270
+ ] }),
271
+ /* @__PURE__ */ jsxRuntime.jsx(
272
+ "button",
273
+ {
274
+ onClick: reset,
275
+ className: "inline-flex items-center px-3 py-1.5 text-xs rounded-[var(--radius-button)] border border-border bg-background hover:bg-accent hover:text-accent-foreground transition-colors",
276
+ children: "Tentar novamente"
277
+ }
278
+ )
279
+ ]
280
+ }
281
+ );
282
+ }
283
+ class ErrorBoundary extends React.Component {
284
+ constructor(props) {
285
+ super(props);
286
+ this.state = { hasError: false, error: null };
287
+ this.reset = this.reset.bind(this);
288
+ }
289
+ static getDerivedStateFromError(error) {
290
+ return { hasError: true, error };
291
+ }
292
+ componentDidCatch(error, info) {
293
+ var _a, _b;
294
+ (_b = (_a = this.props).onError) == null ? void 0 : _b.call(_a, error, info);
295
+ }
296
+ componentDidUpdate(prevProps) {
297
+ if (!this.state.hasError) return;
298
+ const { resetKeys } = this.props;
299
+ if (!(resetKeys == null ? void 0 : resetKeys.length)) return;
300
+ const prevKeys = prevProps.resetKeys ?? [];
301
+ const changed = resetKeys.some((key, i) => key !== prevKeys[i]);
302
+ if (changed) this.reset();
303
+ }
304
+ reset() {
305
+ this.setState({ hasError: false, error: null });
306
+ }
307
+ render() {
308
+ const { hasError, error } = this.state;
309
+ const { children, fallback: Fallback } = this.props;
310
+ if (hasError && error) {
311
+ return /* @__PURE__ */ jsxRuntime.jsx(Fallback, { error, reset: this.reset });
312
+ }
313
+ return children;
314
+ }
315
+ }
316
+ function SectionErrorBoundary({ children, onError, resetKeys }) {
317
+ return /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { fallback: SectionErrorFallback, onError, resetKeys, children });
318
+ }
319
+ function HomeContent() {
320
+ const { t: t2 } = reactI18next.useTranslation();
321
+ const layout = LayoutContext.useOptionalLayout();
322
+ const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? false;
323
+ const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 256;
324
+ const navigate = reactRouterDom.useNavigate();
325
+ const { data: featureCards = [], isLoading } = useFeatureCards();
326
+ return /* @__PURE__ */ jsxRuntime.jsxs(
327
+ "div",
328
+ {
329
+ style: {
330
+ paddingLeft: sidebarExpanded ? `${sidebarWidth}px` : SIDEBAR_COLLAPSED_WIDTH
331
+ },
332
+ className: "flex-1 flex flex-col overflow-hidden transition-all duration-300",
333
+ children: [
334
+ /* @__PURE__ */ jsxRuntime.jsx(
335
+ sidebar.Header,
336
+ {
337
+ showThemeToggle: true,
338
+ showLanguageSelector: true,
339
+ breadcrumbs: [
340
+ { label: t2("nav.designSystem"), href: "/home" },
341
+ { label: t2("nav.home") }
342
+ ],
343
+ renderLink: (href, props) => /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Link, { to: href, ...props })
344
+ }
345
+ ),
346
+ /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-hidden bg-muted", children: /* @__PURE__ */ jsxRuntime.jsx(input.ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 sm:p-4 md:p-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-6xl mx-auto space-y-8", children: [
347
+ /* @__PURE__ */ jsxRuntime.jsx(
348
+ alertDialog.PageHeader,
349
+ {
350
+ title: t2("home.welcome"),
351
+ subtitle: t2("home.subtitle")
352
+ }
353
+ ),
354
+ /* @__PURE__ */ jsxRuntime.jsx(SectionErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
355
+ /* @__PURE__ */ jsxRuntime.jsx(FeatureCardSkeleton.FeatureCardSkeleton, { showAction: true }),
356
+ /* @__PURE__ */ jsxRuntime.jsx(FeatureCardSkeleton.FeatureCardSkeleton, { showAction: true }),
357
+ /* @__PURE__ */ jsxRuntime.jsx(FeatureCardSkeleton.FeatureCardSkeleton, { showAction: true })
358
+ ] }) : featureCards.map((card) => /* @__PURE__ */ jsxRuntime.jsxs(
359
+ skeleton.Card,
360
+ {
361
+ className: "hover:shadow-xl transition-shadow duration-200 flex flex-col h-full",
362
+ children: [
363
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
364
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 bg-[var(--chart-2)]/20 rounded-[var(--radius)]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "w-6 h-6 text-[var(--chart-2)]" }) }),
365
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
366
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { className: "text-sm", children: t2(`home.${card.id.replace(/-/g, "")}Title`, { defaultValue: card.title }) }),
367
+ card.badge && /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "default", className: "text-xs", children: t2(`home.${card.id.replace(/-/g, "")}badge`, { defaultValue: card.badge }) })
368
+ ] })
369
+ ] }) }),
370
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2(`home.${card.id.replace(/-/g, "")}Description`, { defaultValue: card.description }) }) }),
371
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardFooter, { children: /* @__PURE__ */ jsxRuntime.jsx(
372
+ button.Button,
373
+ {
374
+ variant: "outline",
375
+ className: "w-full",
376
+ onClick: () => navigate(card.href),
377
+ children: t2("common.view")
378
+ }
379
+ ) })
380
+ ]
381
+ },
382
+ card.id
383
+ )) }) })
384
+ ] }) }) }) })
385
+ ]
386
+ }
387
+ );
388
+ }
389
+ const routes = [
390
+ { path: "/home", label: "Home", icon: lucideReact.Home },
391
+ { path: "/template", label: "Template", icon: lucideReact.FileText }
392
+ ];
393
+ const AuthContext = React.createContext(null);
394
+ function useAuth() {
395
+ const ctx = React.useContext(AuthContext);
396
+ if (!ctx) throw new Error("useAuth must be used within <AuthProvider>");
397
+ return ctx;
398
+ }
399
+ async function fetchAssistantConfig() {
400
+ await new Promise((resolve) => setTimeout(resolve, 150));
401
+ const t2 = (key) => i18n.t(key);
402
+ return {
403
+ suggestions: [
404
+ { id: "1", text: t2("assistant.suggestions.whatCanIAsk") },
405
+ { id: "2", text: t2("assistant.suggestions.whatDoYouDo") },
406
+ { id: "3", text: t2("assistant.suggestions.whichProjects") },
407
+ { id: "4", text: t2("assistant.suggestions.nextProject") }
408
+ ],
409
+ richSuggestions: [
410
+ { id: "rich-1", text: t2("assistant.richSuggestions.viewPerformance") },
411
+ { id: "rich-2", text: t2("assistant.richSuggestions.generateReport") },
412
+ { id: "rich-3", text: t2("assistant.richSuggestions.createDocument") },
413
+ { id: "rich-4", text: t2("assistant.richSuggestions.generatePodcast") }
414
+ ],
415
+ feedbackOptions: [
416
+ t2("assistant.feedback.notWhatIWanted"),
417
+ t2("assistant.feedback.incorrectInfo"),
418
+ t2("assistant.feedback.incompleteAnswer")
419
+ ]
420
+ };
421
+ }
422
+ function getMockRichSuggestions() {
423
+ return [
424
+ { id: "rich-1", text: i18n.t("assistant.richSuggestions.viewPerformance") },
425
+ { id: "rich-2", text: i18n.t("assistant.richSuggestions.generateReport") },
426
+ { id: "rich-3", text: i18n.t("assistant.richSuggestions.createDocument") },
427
+ { id: "rich-4", text: i18n.t("assistant.richSuggestions.generatePodcast") }
428
+ ];
429
+ }
430
+ function getMockFeedbackOptions() {
431
+ return [
432
+ i18n.t("assistant.feedback.notWhatIWanted"),
433
+ i18n.t("assistant.feedback.incorrectInfo"),
434
+ i18n.t("assistant.feedback.incompleteAnswer")
435
+ ];
436
+ }
437
+ function useAssistantConfig() {
438
+ const { language } = ThemeContext.useLanguage();
439
+ return reactQuery.useQuery({
440
+ // Language is part of the key so each locale has its own cache slot.
441
+ queryKey: ["assistant", "config", language],
442
+ queryFn: fetchAssistantConfig,
443
+ staleTime: 30 * 60 * 1e3
444
+ // 30 min — config rarely changes
445
+ });
446
+ }
447
+ function HomePage() {
448
+ const { user, logout } = useAuth();
449
+ const layout = LayoutContext.useOptionalLayout();
450
+ const [localSidebarExpanded, setLocalSidebarExpanded] = React.useState(false);
451
+ const [localAssistantExpanded, setLocalAssistantExpanded] = React.useState(false);
452
+ const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
453
+ const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 280;
454
+ const assistenteExpanded = (layout == null ? void 0 : layout.assistenteExpanded) ?? localAssistantExpanded;
455
+ const toggleSidebar = (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
456
+ const toggleAssistente = (layout == null ? void 0 : layout.toggleAssistente) ?? (() => setLocalAssistantExpanded((value) => !value));
457
+ const location = reactRouterDom.useLocation();
458
+ const navigate = reactRouterDom.useNavigate();
459
+ const { data: assistantConfig } = useAssistantConfig();
460
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-screen flex bg-muted overflow-hidden relative", children: [
461
+ /* @__PURE__ */ jsxRuntime.jsx(
462
+ sidebar.Sidebar,
463
+ {
464
+ expanded: sidebarExpanded,
465
+ width: sidebarWidth,
466
+ onToggle: toggleSidebar,
467
+ user: {
468
+ ...user,
469
+ name: "Ariel Santos",
470
+ avatar: "https://github.com/shadcn.png"
471
+ },
472
+ onLogout: logout,
473
+ onSettingsClick: () => navigate("/settings"),
474
+ location,
475
+ navigate,
476
+ routes
477
+ }
478
+ ),
479
+ /* @__PURE__ */ jsxRuntime.jsx(HomeContent, {}),
480
+ /* @__PURE__ */ jsxRuntime.jsx(
481
+ xerticaAssistant.XerticaAssistant,
482
+ {
483
+ isExpanded: assistenteExpanded,
484
+ onToggle: toggleAssistente,
485
+ defaultTab: "chat",
486
+ demoMode: true,
487
+ responseGenerator: xerticaAssistant.gerarResposta,
488
+ suggestions: assistantConfig == null ? void 0 : assistantConfig.suggestions,
489
+ richSuggestions: (assistantConfig == null ? void 0 : assistantConfig.richSuggestions) ?? getMockRichSuggestions(),
490
+ feedbackOptions: (assistantConfig == null ? void 0 : assistantConfig.feedbackOptions) ?? getMockFeedbackOptions(),
491
+ onEvaluation: () => {
492
+ }
493
+ }
494
+ )
495
+ ] });
496
+ }
497
+ function LoginPage({ onLogin }) {
498
+ const navigate = reactRouterDom.useNavigate();
499
+ const { t: t2 } = reactI18next.useTranslation();
500
+ const [email, setEmail] = React.useState("");
501
+ const [password, setPassword] = React.useState("");
502
+ const [isLoading, setIsLoading] = React.useState(false);
503
+ const [error, setError] = React.useState("");
504
+ const handleSubmit = async (e) => {
505
+ e.preventDefault();
506
+ setError("");
507
+ setIsLoading(true);
508
+ await new Promise((resolve) => setTimeout(resolve, 1e3));
509
+ const success = onLogin(email, password);
510
+ if (!success) {
511
+ setError(t2("login.errorFillFields"));
512
+ }
513
+ setIsLoading(false);
514
+ };
515
+ const handleSocialLogin = (_provider) => {
516
+ onLogin("social@user.com", "social-auth");
517
+ };
518
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen flex", children: [
519
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
520
+ /* @__PURE__ */ jsxRuntime.jsx(
521
+ alertDialog.ImageWithFallback,
522
+ {
523
+ src: "https://images.unsplash.com/photo-1551434678-e076c223a692?w=1200&h=800&fit=crop&auto=format",
524
+ alt: t2("login.heroImageAlt"),
525
+ className: "absolute inset-0 w-full h-full object-cover"
526
+ }
527
+ ),
528
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
529
+ ] }),
530
+ /* @__PURE__ */ jsxRuntime.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: [
531
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsxRuntime.jsx(XerticaXLogo.LanguageSelector, { variant: "minimal", showIcon: false }) }),
532
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
533
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
534
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
535
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
536
+ XerticaXLogo.XerticaLogo,
537
+ {
538
+ className: "h-12 w-auto text-primary dark:text-foreground",
539
+ variant: "theme"
540
+ }
541
+ ) }),
542
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm text-muted-foreground", children: t2("login.heading") })
543
+ ] }),
544
+ /* @__PURE__ */ jsxRuntime.jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
545
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
546
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "email", children: t2("login.emailLabel") }),
547
+ /* @__PURE__ */ jsxRuntime.jsx(
548
+ input.Input,
549
+ {
550
+ id: "email",
551
+ name: "email",
552
+ type: "email",
553
+ required: true,
554
+ className: "w-full",
555
+ placeholder: t2("login.emailPlaceholder"),
556
+ value: email,
557
+ onChange: (e) => setEmail(e.target.value)
558
+ }
559
+ )
560
+ ] }),
561
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
562
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "password", children: t2("login.passwordLabel") }),
563
+ /* @__PURE__ */ jsxRuntime.jsx(
564
+ input.Input,
565
+ {
566
+ id: "password",
567
+ name: "password",
568
+ type: "password",
569
+ required: true,
570
+ className: "w-full",
571
+ placeholder: "••••••••",
572
+ value: password,
573
+ onChange: (e) => setPassword(e.target.value)
574
+ }
575
+ )
576
+ ] }),
577
+ error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-destructive text-sm text-center", children: error }),
578
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? t2("login.submitting") : t2("login.submit") }),
579
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center", children: /* @__PURE__ */ jsxRuntime.jsx(
580
+ "button",
581
+ {
582
+ type: "button",
583
+ onClick: () => navigate("/forgot-password"),
584
+ className: "text-sm text-primary hover:opacity-80 transition-colors",
585
+ children: t2("login.forgotPassword")
586
+ }
587
+ ) })
588
+ ] }),
589
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
590
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full border-t border-border" }) }),
591
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: t2("login.orContinueWith") }) })
592
+ ] }),
593
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
594
+ /* @__PURE__ */ jsxRuntime.jsxs(
595
+ button.Button,
596
+ {
597
+ type: "button",
598
+ variant: "outline",
599
+ className: "w-full justify-center",
600
+ onClick: () => handleSocialLogin(),
601
+ children: [
602
+ /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
603
+ /* @__PURE__ */ jsxRuntime.jsx(
604
+ "path",
605
+ {
606
+ fill: "#EA4335",
607
+ 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"
608
+ }
609
+ ),
610
+ /* @__PURE__ */ jsxRuntime.jsx(
611
+ "path",
612
+ {
613
+ fill: "#4285F4",
614
+ 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"
615
+ }
616
+ ),
617
+ /* @__PURE__ */ jsxRuntime.jsx(
618
+ "path",
619
+ {
620
+ fill: "#FBBC05",
621
+ 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"
622
+ }
623
+ ),
624
+ /* @__PURE__ */ jsxRuntime.jsx(
625
+ "path",
626
+ {
627
+ fill: "#34A853",
628
+ 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"
629
+ }
630
+ ),
631
+ /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
632
+ ] }),
633
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithGoogle") })
634
+ ]
635
+ }
636
+ ),
637
+ /* @__PURE__ */ jsxRuntime.jsxs(
638
+ button.Button,
639
+ {
640
+ type: "button",
641
+ variant: "outline",
642
+ className: "w-full justify-center",
643
+ onClick: () => handleSocialLogin(),
644
+ children: [
645
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
646
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithMTLogin") })
647
+ ]
648
+ }
649
+ ),
650
+ /* @__PURE__ */ jsxRuntime.jsx(
651
+ button.Button,
652
+ {
653
+ type: "button",
654
+ variant: "outline",
655
+ className: "w-full justify-center font-normal",
656
+ onClick: () => handleSocialLogin(),
657
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithGovBr") })
658
+ }
659
+ )
660
+ ] })
661
+ ] })
662
+ ] })
663
+ ] });
664
+ }
665
+ function ResetPasswordPage() {
666
+ const navigate = reactRouterDom.useNavigate();
667
+ const { t: t2 } = reactI18next.useTranslation();
668
+ const [password, setPassword] = React.useState("");
669
+ const [confirmPassword, setConfirmPassword] = React.useState("");
670
+ const [isLoading, setIsLoading] = React.useState(false);
671
+ const [error, setError] = React.useState("");
672
+ const [passwordStrength, setPasswordStrength] = React.useState(
673
+ null
674
+ );
675
+ const checkPasswordStrength = (pwd) => {
676
+ if (pwd.length === 0) {
677
+ setPasswordStrength(null);
678
+ return;
679
+ }
680
+ if (pwd.length < 6) {
681
+ setPasswordStrength("weak");
682
+ } else if (pwd.length < 10) {
683
+ setPasswordStrength("medium");
684
+ } else {
685
+ setPasswordStrength("strong");
686
+ }
687
+ };
688
+ const handlePasswordChange = (value) => {
689
+ setPassword(value);
690
+ checkPasswordStrength(value);
691
+ setError("");
692
+ };
693
+ const handleSubmit = async (e) => {
694
+ e.preventDefault();
695
+ setError("");
696
+ if (password.length < 6) {
697
+ setError(t2("resetPassword.errorMinLength"));
698
+ return;
699
+ }
700
+ if (password !== confirmPassword) {
701
+ setError(t2("resetPassword.errorMismatch"));
702
+ return;
703
+ }
704
+ setIsLoading(true);
705
+ await new Promise((resolve) => setTimeout(resolve, 1500));
706
+ navigate("/login", { state: { resetSuccess: true } });
707
+ setIsLoading(false);
708
+ };
709
+ const getStrengthColor = () => {
710
+ switch (passwordStrength) {
711
+ case "weak":
712
+ return "text-destructive";
713
+ case "medium":
714
+ return "text-[var(--chart-3)]";
715
+ case "strong":
716
+ return "text-[var(--chart-2)]";
717
+ default:
718
+ return "text-muted-foreground";
719
+ }
720
+ };
721
+ const getStrengthText = () => {
722
+ switch (passwordStrength) {
723
+ case "weak":
724
+ return t2("resetPassword.strengthWeak");
725
+ case "medium":
726
+ return t2("resetPassword.strengthMedium");
727
+ case "strong":
728
+ return t2("resetPassword.strengthStrong");
729
+ default:
730
+ return "";
731
+ }
732
+ };
733
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen flex", children: [
734
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
735
+ /* @__PURE__ */ jsxRuntime.jsx(
736
+ alertDialog.ImageWithFallback,
737
+ {
738
+ src: "https://images.unsplash.com/photo-1555949963-aa79dcee981c?w=1200&h=800&fit=crop&auto=format",
739
+ alt: t2("resetPassword.heroImageAlt"),
740
+ className: "absolute inset-0 w-full h-full object-cover"
741
+ }
742
+ ),
743
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
744
+ ] }),
745
+ /* @__PURE__ */ jsxRuntime.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: [
746
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsxRuntime.jsx(XerticaXLogo.LanguageSelector, { variant: "minimal", showIcon: false }) }),
747
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
748
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
749
+ /* @__PURE__ */ jsxRuntime.jsxs(
750
+ "button",
751
+ {
752
+ onClick: () => navigate("/login"),
753
+ className: "flex items-center gap-2 text-muted-foreground hover:text-foreground transition-colors",
754
+ children: [
755
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "w-4 h-4" }),
756
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-small", children: t2("resetPassword.backToLogin") })
757
+ ]
758
+ }
759
+ ),
760
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
761
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
762
+ XerticaXLogo.XerticaLogo,
763
+ {
764
+ className: "h-12 w-auto text-primary dark:text-foreground",
765
+ variant: "theme"
766
+ }
767
+ ) }),
768
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm text-muted-foreground", children: t2("resetPassword.heading") }),
769
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-muted-foreground", children: t2("resetPassword.subheading") })
770
+ ] }),
771
+ /* @__PURE__ */ jsxRuntime.jsxs("form", { className: "space-y-6", onSubmit: handleSubmit, children: [
772
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
773
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "password", children: t2("resetPassword.newPasswordLabel") }),
774
+ /* @__PURE__ */ jsxRuntime.jsx(
775
+ input.Input,
776
+ {
777
+ id: "password",
778
+ name: "password",
779
+ type: "password",
780
+ required: true,
781
+ className: "w-full",
782
+ placeholder: "••••••••",
783
+ value: password,
784
+ onChange: (e) => handlePasswordChange(e.target.value)
785
+ }
786
+ ),
787
+ passwordStrength && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
788
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 h-1 bg-muted rounded-full overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
789
+ "div",
790
+ {
791
+ 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)]"}`
792
+ }
793
+ ) }),
794
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: `text-small ${getStrengthColor()}`, children: getStrengthText() })
795
+ ] })
796
+ ] }),
797
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
798
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "confirmPassword", children: t2("resetPassword.confirmPasswordLabel") }),
799
+ /* @__PURE__ */ jsxRuntime.jsx(
800
+ input.Input,
801
+ {
802
+ id: "confirmPassword",
803
+ name: "confirmPassword",
804
+ type: "password",
805
+ required: true,
806
+ className: "w-full",
807
+ placeholder: "••••••••",
808
+ value: confirmPassword,
809
+ onChange: (e) => {
810
+ setConfirmPassword(e.target.value);
811
+ setError("");
812
+ }
813
+ }
814
+ )
815
+ ] }),
816
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-accent rounded-[var(--radius)] p-4 space-y-2", children: [
817
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: t2("resetPassword.requirements") }),
818
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
819
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
820
+ /* @__PURE__ */ jsxRuntime.jsx(
821
+ lucideReact.CheckCircle2,
822
+ {
823
+ className: `w-4 h-4 ${password.length >= 6 ? "text-[var(--chart-2)]" : "text-muted-foreground"}`
824
+ }
825
+ ),
826
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: t2("resetPassword.requirementMinChars") })
827
+ ] }),
828
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
829
+ /* @__PURE__ */ jsxRuntime.jsx(
830
+ lucideReact.CheckCircle2,
831
+ {
832
+ className: `w-4 h-4 ${password === confirmPassword && password.length > 0 ? "text-[var(--chart-2)]" : "text-muted-foreground"}`
833
+ }
834
+ ),
835
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: t2("resetPassword.requirementMatch") })
836
+ ] })
837
+ ] })
838
+ ] }),
839
+ error && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-destructive bg-destructive/10 rounded-[var(--radius)] p-3", children: [
840
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "w-4 h-4 flex-shrink-0" }),
841
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: error })
842
+ ] }),
843
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? t2("resetPassword.submitting") : t2("resetPassword.submit") })
844
+ ] })
845
+ ] })
846
+ ] })
847
+ ] });
848
+ }
849
+ function createLucideIconSvg(iconName) {
850
+ const iconPaths = {
851
+ 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>',
852
+ 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>',
853
+ 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>',
854
+ 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>',
855
+ 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>'
856
+ };
857
+ const path = iconPaths[iconName] || "";
858
+ 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>`;
859
+ }
860
+ const markerGroups = {
861
+ restaurant: {
862
+ id: "restaurant",
863
+ name: "Restaurantes",
864
+ color: "var(--destructive)",
865
+ // red
866
+ iconColor: "#FFFFFF",
867
+ // white para contraste
868
+ iconName: "utensils",
869
+ icon: lucideReact.Utensils
870
+ },
871
+ hotel: {
872
+ id: "hotel",
873
+ name: "Hotéis",
874
+ color: "var(--info)",
875
+ // blue
876
+ iconColor: "#FFFFFF",
877
+ iconName: "hotel",
878
+ icon: lucideReact.Hotel
879
+ },
880
+ landmark: {
881
+ id: "landmark",
882
+ name: "Pontos Turísticos",
883
+ color: "var(--success)",
884
+ // green
885
+ iconColor: "#FFFFFF",
886
+ iconName: "landmark",
887
+ icon: lucideReact.Landmark
888
+ },
889
+ shopping: {
890
+ id: "shopping",
891
+ name: "Compras",
892
+ color: "var(--warning)",
893
+ // orange
894
+ iconColor: "#FFFFFF",
895
+ iconName: "shopping",
896
+ icon: lucideReact.ShoppingBag
897
+ },
898
+ cafe: {
899
+ id: "cafe",
900
+ name: "Cafeterias",
901
+ color: "var(--primary)",
902
+ // purple
903
+ iconColor: "#FFFFFF",
904
+ iconName: "coffee",
905
+ icon: lucideReact.Coffee
906
+ }
907
+ };
908
+ const sampleLocations = [
909
+ // Restaurantes
910
+ {
911
+ position: { lat: -23.5505, lng: -46.6333 },
912
+ title: "Restaurante Italiano",
913
+ info: "Melhor pizza da cidade",
914
+ group: "restaurant"
915
+ },
916
+ {
917
+ position: { lat: -23.5485, lng: -46.635 },
918
+ title: "Sushi Bar",
919
+ info: "Comida japonesa autêntica",
920
+ group: "restaurant"
921
+ },
922
+ {
923
+ position: { lat: -23.552, lng: -46.631 },
924
+ title: "Churrascaria Premium",
925
+ info: "Rodízio tradicional brasileiro",
926
+ group: "restaurant"
927
+ },
928
+ // Hotéis
929
+ {
930
+ position: { lat: -23.5475, lng: -46.6361 },
931
+ title: "Hotel Luxo",
932
+ info: "5 estrelas - Vista panorâmica",
933
+ group: "hotel"
934
+ },
935
+ {
936
+ position: { lat: -23.553, lng: -46.634 },
937
+ title: "Hotel Boutique",
938
+ info: "Design moderno e aconchegante",
939
+ group: "hotel"
940
+ },
941
+ // Pontos Turísticos
942
+ {
943
+ position: { lat: -23.5613, lng: -46.6563 },
944
+ title: "Parque Ibirapuera",
945
+ info: "Maior parque urbano da cidade",
946
+ group: "landmark"
947
+ },
948
+ {
949
+ position: { lat: -23.5558, lng: -46.6396 },
950
+ title: "MASP",
951
+ info: "Museu de Arte de São Paulo",
952
+ group: "landmark"
953
+ },
954
+ {
955
+ position: { lat: -23.5489, lng: -46.6388 },
956
+ title: "Avenida Paulista",
957
+ info: "Centro financeiro e cultural",
958
+ group: "landmark"
959
+ },
960
+ // Shopping
961
+ {
962
+ position: { lat: -23.5465, lng: -46.64 },
963
+ title: "Shopping Center",
964
+ info: "Mais de 300 lojas",
965
+ group: "shopping"
966
+ },
967
+ {
968
+ position: { lat: -23.554, lng: -46.638 },
969
+ title: "Galeria de Arte",
970
+ info: "Arte contemporânea e design",
971
+ group: "shopping"
972
+ },
973
+ // Cafeterias
974
+ {
975
+ position: { lat: -23.5495, lng: -46.6345 },
976
+ title: "Café Artesanal",
977
+ info: "Café especial e brunch",
978
+ group: "cafe"
979
+ },
980
+ {
981
+ position: { lat: -23.551, lng: -46.637 },
982
+ title: "Coffee House",
983
+ info: "Café gourmet e wi-fi",
984
+ group: "cafe"
985
+ },
986
+ {
987
+ position: { lat: -23.5525, lng: -46.6355 },
988
+ title: "Café Cultural",
989
+ info: "Livros e café",
990
+ group: "cafe"
991
+ }
992
+ ];
993
+ function FilterableMapExample({ apiKey }) {
994
+ const [activeFilters, setActiveFilters] = React.useState(
995
+ new Set(Object.keys(markerGroups))
996
+ );
997
+ const [showFilters, setShowFilters] = React.useState(true);
998
+ const filteredLocations = React.useMemo(() => {
999
+ return sampleLocations.filter((location) => activeFilters.has(location.group));
1000
+ }, [activeFilters]);
1001
+ const toggleFilter = (groupId) => {
1002
+ setActiveFilters((prev) => {
1003
+ const newFilters = new Set(prev);
1004
+ if (newFilters.has(groupId)) {
1005
+ newFilters.delete(groupId);
1006
+ } else {
1007
+ newFilters.add(groupId);
1008
+ }
1009
+ return newFilters;
1010
+ });
1011
+ };
1012
+ const toggleAll = () => {
1013
+ if (activeFilters.size === Object.keys(markerGroups).length) {
1014
+ setActiveFilters(/* @__PURE__ */ new Set());
1015
+ } else {
1016
+ setActiveFilters(new Set(Object.keys(markerGroups)));
1017
+ }
1018
+ };
1019
+ const markersWithCustomization = filteredLocations.map((location) => ({
1020
+ ...location,
1021
+ customColor: markerGroups[location.group].color,
1022
+ iconSvg: createLucideIconSvg(markerGroups[location.group].iconName),
1023
+ iconColor: markerGroups[location.group].iconColor
1024
+ }));
1025
+ const getGroupCount = (groupId) => {
1026
+ return sampleLocations.filter((loc) => loc.group === groupId).length;
1027
+ };
1028
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
1029
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
1030
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
1031
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapPin, { className: "w-5 h-5 text-primary" }),
1032
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { children: "Filtro por Categorias" })
1033
+ ] }),
1034
+ /* @__PURE__ */ jsxRuntime.jsxs(progress.Badge, { variant: "secondary", children: [
1035
+ filteredLocations.length,
1036
+ " de ",
1037
+ sampleLocations.length,
1038
+ " locais"
1039
+ ] })
1040
+ ] }),
1041
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: "Use os filtros compactos no canto superior esquerdo do mapa para visualizar marcadores por categoria" }),
1042
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
1043
+ /* @__PURE__ */ jsxRuntime.jsx(
1044
+ alertDialog.Map,
1045
+ {
1046
+ center: { lat: -23.5505, lng: -46.6333 },
1047
+ zoom: 14,
1048
+ markers: markersWithCustomization,
1049
+ height: "500px",
1050
+ zoomControl: true,
1051
+ fullscreenControl: true,
1052
+ apiKey
1053
+ }
1054
+ ),
1055
+ /* @__PURE__ */ jsxRuntime.jsx(
1056
+ "div",
1057
+ {
1058
+ className: button.cn(
1059
+ "absolute top-4 left-4 z-10 transition-all duration-300",
1060
+ showFilters ? "translate-x-0" : "-translate-x-full"
1061
+ ),
1062
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2.5 rounded-lg shadow-[var(--shadow-elevation-sm)] bg-card border border-border max-w-[220px]", children: [
1063
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2 gap-2", children: [
1064
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
1065
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Filter, { className: "w-3.5 h-3.5 text-foreground" }),
1066
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-foreground", children: "Filtros" })
1067
+ ] }),
1068
+ /* @__PURE__ */ jsxRuntime.jsx(
1069
+ button.Button,
1070
+ {
1071
+ size: "sm",
1072
+ variant: "ghost",
1073
+ onClick: () => setShowFilters(false),
1074
+ className: "h-5 w-5 p-0",
1075
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3 h-3" })
1076
+ }
1077
+ )
1078
+ ] }),
1079
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5", children: [
1080
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 py-0.5", children: [
1081
+ /* @__PURE__ */ jsxRuntime.jsx(
1082
+ alertDialog.Checkbox,
1083
+ {
1084
+ id: "filter-all",
1085
+ checked: activeFilters.size === Object.keys(markerGroups).length,
1086
+ onCheckedChange: toggleAll
1087
+ }
1088
+ ),
1089
+ /* @__PURE__ */ jsxRuntime.jsxs(
1090
+ alertDialog.Label,
1091
+ {
1092
+ htmlFor: "filter-all",
1093
+ className: "flex items-center gap-1.5 cursor-pointer text-sm",
1094
+ children: [
1095
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapPin, { className: "w-3.5 h-3.5" }),
1096
+ "Todos",
1097
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "secondary", className: "text-xs h-4 px-1", children: sampleLocations.length })
1098
+ ]
1099
+ }
1100
+ )
1101
+ ] }),
1102
+ Object.entries(markerGroups).map(([id, group]) => {
1103
+ const groupId = id;
1104
+ const Icon = group.icon;
1105
+ const isActive = activeFilters.has(groupId);
1106
+ const count = getGroupCount(groupId);
1107
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 py-0.5", children: [
1108
+ /* @__PURE__ */ jsxRuntime.jsx(
1109
+ alertDialog.Checkbox,
1110
+ {
1111
+ id: `filter-${id}`,
1112
+ checked: isActive,
1113
+ onCheckedChange: () => toggleFilter(groupId)
1114
+ }
1115
+ ),
1116
+ /* @__PURE__ */ jsxRuntime.jsxs(
1117
+ alertDialog.Label,
1118
+ {
1119
+ htmlFor: `filter-${id}`,
1120
+ className: "flex items-center gap-1.5 cursor-pointer text-sm",
1121
+ children: [
1122
+ /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "w-3.5 h-3.5", style: { color: group.color } }),
1123
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: isActive ? "text-foreground" : "text-muted-foreground", children: group.name }),
1124
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "outline", className: "text-xs h-4 px-1", children: count })
1125
+ ]
1126
+ }
1127
+ )
1128
+ ] }, id);
1129
+ })
1130
+ ] })
1131
+ ] })
1132
+ }
1133
+ ),
1134
+ !showFilters && /* @__PURE__ */ jsxRuntime.jsxs(
1135
+ button.Button,
1136
+ {
1137
+ size: "sm",
1138
+ onClick: () => setShowFilters(true),
1139
+ className: "absolute top-4 left-4 z-10 h-8 bg-primary text-primary-foreground",
1140
+ children: [
1141
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Filter, { className: "w-3.5 h-3.5 mr-1.5" }),
1142
+ "Filtros"
1143
+ ]
1144
+ }
1145
+ )
1146
+ ] }),
1147
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-3 justify-center pt-2 border-t border-border", children: Object.entries(markerGroups).map(([id, group]) => {
1148
+ const Icon = group.icon;
1149
+ const count = getGroupCount(id);
1150
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-3 py-1 rounded-lg bg-muted", children: [
1151
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-3 h-3 rounded-full", style: { backgroundColor: group.color } }),
1152
+ /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "w-4 h-4", style: { color: group.color } }),
1153
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", style: { color: "var(--foreground)" }, children: group.name }),
1154
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "secondary", className: "text-xs h-5", children: count })
1155
+ ] }, id);
1156
+ }) }),
1157
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3", children: [
1158
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
1159
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: "Total de Locais" }),
1160
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl text-foreground", children: sampleLocations.length })
1161
+ ] }),
1162
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
1163
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: "Visíveis" }),
1164
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl text-primary", children: filteredLocations.length })
1165
+ ] }),
1166
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
1167
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: "Categorias" }),
1168
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl text-foreground", children: Object.keys(markerGroups).length })
1169
+ ] }),
1170
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center p-3 rounded-lg bg-muted", children: [
1171
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: "Filtros Ativos" }),
1172
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl text-chart-2", children: activeFilters.size })
1173
+ ] })
1174
+ ] })
1175
+ ] });
1176
+ }
1177
+ function DrawingMapExample({ apiKey }) {
1178
+ const [mapInstance, setMapInstance] = React.useState(null);
1179
+ const [selectedMode, setSelectedMode] = React.useState(null);
1180
+ const [shapes, setShapes] = React.useState([]);
1181
+ const [showSaveDialog, setShowSaveDialog] = React.useState(false);
1182
+ const [savedData, setSavedData] = React.useState("");
1183
+ const [isDrawingPolygon, setIsDrawingPolygon] = React.useState(false);
1184
+ const tempPolylineRef = React.useRef(null);
1185
+ const polygonPathRef = React.useRef([]);
1186
+ const mapListenersRef = React.useRef([]);
1187
+ const colors = {
1188
+ fill: "#2C275B",
1189
+ // Primary do CSS
1190
+ stroke: "#2C275B",
1191
+ fillOpacity: 0.2,
1192
+ strokeWeight: 2,
1193
+ editable: true,
1194
+ draggable: true
1195
+ };
1196
+ const addMarker = React.useCallback(
1197
+ (position) => {
1198
+ if (!mapInstance) return;
1199
+ const marker = new google.maps.marker.AdvancedMarkerElement({
1200
+ position,
1201
+ map: mapInstance,
1202
+ gmpDraggable: true,
1203
+ // Propriedade correta para AdvancedMarkerElement
1204
+ title: "Marcador"
1205
+ });
1206
+ marker.addListener("dragend", () => {
1207
+ sonner.toast.info("Posição do marcador atualizada");
1208
+ });
1209
+ const newShape = { type: "marker", overlay: marker };
1210
+ setShapes((prev) => [...prev, newShape]);
1211
+ sonner.toast.success("Marcador adicionado");
1212
+ },
1213
+ [mapInstance]
1214
+ );
1215
+ const addCircle = React.useCallback(
1216
+ (center) => {
1217
+ if (!mapInstance) return;
1218
+ const circle = new google.maps.Circle({
1219
+ map: mapInstance,
1220
+ center,
1221
+ radius: 500,
1222
+ fillColor: colors.fill,
1223
+ fillOpacity: colors.fillOpacity,
1224
+ strokeColor: colors.stroke,
1225
+ strokeWeight: colors.strokeWeight,
1226
+ editable: true,
1227
+ draggable: true
1228
+ });
1229
+ const newShape = { type: "circle", overlay: circle };
1230
+ setShapes((prev) => [...prev, newShape]);
1231
+ sonner.toast.success("Círculo adicionado");
1232
+ },
1233
+ [mapInstance, colors]
1234
+ );
1235
+ const addRectangle = React.useCallback(
1236
+ (center) => {
1237
+ if (!mapInstance) return;
1238
+ const offset = 5e-3;
1239
+ const bounds = {
1240
+ north: center.lat() + offset,
1241
+ south: center.lat() - offset,
1242
+ east: center.lng() + offset,
1243
+ west: center.lng() - offset
1244
+ };
1245
+ const rectangle = new google.maps.Rectangle({
1246
+ map: mapInstance,
1247
+ bounds,
1248
+ fillColor: colors.fill,
1249
+ fillOpacity: colors.fillOpacity,
1250
+ strokeColor: colors.stroke,
1251
+ strokeWeight: colors.strokeWeight,
1252
+ editable: true,
1253
+ draggable: true
1254
+ });
1255
+ const newShape = { type: "rectangle", overlay: rectangle };
1256
+ setShapes((prev) => [...prev, newShape]);
1257
+ sonner.toast.success("Retângulo adicionado");
1258
+ },
1259
+ [mapInstance, colors]
1260
+ );
1261
+ const cancelPolygonDrawing = React.useCallback(() => {
1262
+ if (tempPolylineRef.current) {
1263
+ tempPolylineRef.current.setMap(null);
1264
+ tempPolylineRef.current = null;
1265
+ }
1266
+ polygonPathRef.current = [];
1267
+ setIsDrawingPolygon(false);
1268
+ }, []);
1269
+ const finishPolygon = React.useCallback(() => {
1270
+ if (!mapInstance || polygonPathRef.current.length < 3) {
1271
+ if (polygonPathRef.current.length < 3 && polygonPathRef.current.length > 0) {
1272
+ sonner.toast.error("Polígono precisa de pelo menos 3 pontos.");
1273
+ }
1274
+ return;
1275
+ }
1276
+ const polygon = new google.maps.Polygon({
1277
+ map: mapInstance,
1278
+ paths: polygonPathRef.current,
1279
+ fillColor: colors.fill,
1280
+ fillOpacity: colors.fillOpacity,
1281
+ strokeColor: colors.stroke,
1282
+ strokeWeight: colors.strokeWeight,
1283
+ editable: true,
1284
+ draggable: true
1285
+ });
1286
+ const newShape = { type: "polygon", overlay: polygon };
1287
+ setShapes((prev) => [...prev, newShape]);
1288
+ cancelPolygonDrawing();
1289
+ sonner.toast.success("Polígono criado com sucesso!");
1290
+ }, [mapInstance, colors, cancelPolygonDrawing]);
1291
+ const addPolygonPoint = React.useCallback(
1292
+ (point) => {
1293
+ var _a;
1294
+ if (!mapInstance) return;
1295
+ if (!isDrawingPolygon) {
1296
+ setIsDrawingPolygon(true);
1297
+ polygonPathRef.current = [point];
1298
+ tempPolylineRef.current = new google.maps.Polyline({
1299
+ map: mapInstance,
1300
+ path: polygonPathRef.current,
1301
+ strokeColor: colors.stroke,
1302
+ strokeOpacity: 0.8,
1303
+ strokeWeight: 2,
1304
+ geodesic: true,
1305
+ clickable: false
1306
+ // Importante: não capturar cliques para não atrapalhar o mapa
1307
+ });
1308
+ sonner.toast.info("Clique para adicionar pontos. Duplo clique ou botão check para fechar.", {
1309
+ duration: 4e3
1310
+ });
1311
+ } else {
1312
+ polygonPathRef.current.push(point);
1313
+ (_a = tempPolylineRef.current) == null ? void 0 : _a.setPath(polygonPathRef.current);
1314
+ }
1315
+ },
1316
+ [mapInstance, isDrawingPolygon, colors]
1317
+ );
1318
+ const clearListeners = () => {
1319
+ mapListenersRef.current.forEach((listener) => google.maps.event.removeListener(listener));
1320
+ mapListenersRef.current = [];
1321
+ };
1322
+ React.useEffect(() => {
1323
+ if (!mapInstance) return;
1324
+ clearListeners();
1325
+ if (!selectedMode) {
1326
+ mapInstance.setOptions({ draggableCursor: "grab", clickableIcons: true });
1327
+ return;
1328
+ }
1329
+ mapInstance.setOptions({
1330
+ draggableCursor: "crosshair",
1331
+ clickableIcons: false
1332
+ });
1333
+ const clickListener = mapInstance.addListener("click", (e) => {
1334
+ if (!e.latLng) return;
1335
+ switch (selectedMode) {
1336
+ case "marker":
1337
+ addMarker(e.latLng);
1338
+ break;
1339
+ case "circle":
1340
+ addCircle(e.latLng);
1341
+ break;
1342
+ case "rectangle":
1343
+ addRectangle(e.latLng);
1344
+ break;
1345
+ case "polygon":
1346
+ addPolygonPoint(e.latLng);
1347
+ break;
1348
+ }
1349
+ });
1350
+ mapListenersRef.current.push(clickListener);
1351
+ if (selectedMode === "polygon") {
1352
+ const dblClickListener = mapInstance.addListener("dblclick", (e) => {
1353
+ if (e.domEvent) e.domEvent.stopPropagation();
1354
+ finishPolygon();
1355
+ });
1356
+ mapListenersRef.current.push(dblClickListener);
1357
+ }
1358
+ return () => {
1359
+ clearListeners();
1360
+ };
1361
+ }, [
1362
+ mapInstance,
1363
+ selectedMode,
1364
+ addMarker,
1365
+ addCircle,
1366
+ addRectangle,
1367
+ addPolygonPoint,
1368
+ finishPolygon
1369
+ ]);
1370
+ const handleModeChange = (mode) => {
1371
+ if (isDrawingPolygon) {
1372
+ cancelPolygonDrawing();
1373
+ }
1374
+ setSelectedMode(mode);
1375
+ };
1376
+ const clearAll = () => {
1377
+ shapes.forEach((shape) => {
1378
+ if ("setMap" in shape.overlay) shape.overlay.setMap(null);
1379
+ else shape.overlay.map = null;
1380
+ });
1381
+ setShapes([]);
1382
+ if (isDrawingPolygon) cancelPolygonDrawing();
1383
+ sonner.toast.info("Mapa limpo");
1384
+ };
1385
+ const undoLast = () => {
1386
+ var _a;
1387
+ if (isDrawingPolygon) {
1388
+ if (polygonPathRef.current.length > 0) {
1389
+ polygonPathRef.current.pop();
1390
+ (_a = tempPolylineRef.current) == null ? void 0 : _a.setPath(polygonPathRef.current);
1391
+ if (polygonPathRef.current.length === 0) {
1392
+ cancelPolygonDrawing();
1393
+ }
1394
+ }
1395
+ return;
1396
+ }
1397
+ if (shapes.length === 0) return;
1398
+ const lastShape = shapes[shapes.length - 1];
1399
+ if ("setMap" in lastShape.overlay) lastShape.overlay.setMap(null);
1400
+ else lastShape.overlay.map = null;
1401
+ setShapes((prev) => prev.slice(0, prev.length - 1));
1402
+ };
1403
+ const handleSave = () => {
1404
+ if (shapes.length === 0) {
1405
+ sonner.toast.error("Adicione desenhos ao mapa antes de salvar.");
1406
+ return;
1407
+ }
1408
+ const exportData = shapes.map((s) => {
1409
+ var _a, _b;
1410
+ let data = {};
1411
+ if (s.type === "marker") {
1412
+ const marker = s.overlay;
1413
+ const pos = marker.position;
1414
+ if (pos) {
1415
+ const lat = typeof pos.lat === "function" ? pos.lat() : pos.lat;
1416
+ const lng = typeof pos.lng === "function" ? pos.lng() : pos.lng;
1417
+ data = { lat, lng };
1418
+ }
1419
+ } else if (s.type === "circle") {
1420
+ const circle = s.overlay;
1421
+ data = {
1422
+ center: { lat: (_a = circle.getCenter()) == null ? void 0 : _a.lat(), lng: (_b = circle.getCenter()) == null ? void 0 : _b.lng() },
1423
+ radius: circle.getRadius()
1424
+ };
1425
+ } else if (s.type === "rectangle") {
1426
+ const rect = s.overlay;
1427
+ const bounds = rect.getBounds();
1428
+ data = {
1429
+ north: bounds == null ? void 0 : bounds.getNorthEast().lat(),
1430
+ south: bounds == null ? void 0 : bounds.getSouthWest().lat(),
1431
+ east: bounds == null ? void 0 : bounds.getNorthEast().lng(),
1432
+ west: bounds == null ? void 0 : bounds.getSouthWest().lng()
1433
+ };
1434
+ } else if (s.type === "polygon") {
1435
+ const poly = s.overlay;
1436
+ const path = poly.getPath();
1437
+ data = path.getArray().map((coord) => ({ lat: coord.lat(), lng: coord.lng() }));
1438
+ }
1439
+ return { type: s.type, data };
1440
+ });
1441
+ setSavedData(JSON.stringify(exportData, null, 2));
1442
+ setShowSaveDialog(true);
1443
+ };
1444
+ const ToolButton = ({
1445
+ active,
1446
+ onClick,
1447
+ icon: Icon,
1448
+ label
1449
+ }) => /* @__PURE__ */ jsxRuntime.jsxs(
1450
+ button.Button,
1451
+ {
1452
+ variant: active ? "default" : "ghost",
1453
+ className: `w-full justify-start gap-3 ${active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground"}`,
1454
+ onClick,
1455
+ children: [
1456
+ /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
1457
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label })
1458
+ ]
1459
+ }
1460
+ );
1461
+ return /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { className: "h-full border-0 shadow-none md:border md:shadow-sm", children: [
1462
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardHeader, { className: "border-b bg-muted/20 pb-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
1463
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
1464
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Ferramentas de Desenho" }),
1465
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { className: "mt-1", children: "Crie geometrias personalizadas no mapa" })
1466
+ ] }),
1467
+ /* @__PURE__ */ jsxRuntime.jsxs(progress.Badge, { variant: "outline", className: "h-6", children: [
1468
+ shapes.length,
1469
+ " ",
1470
+ shapes.length === 1 ? "elemento" : "elementos"
1471
+ ] })
1472
+ ] }) }),
1473
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "p-0 flex flex-col md:flex-row h-[600px] bg-background", children: [
1474
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full md:w-64 border-b md:border-b-0 md:border-r bg-muted/10 flex flex-col", children: [
1475
+ /* @__PURE__ */ jsxRuntime.jsx(input.ScrollArea, { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 space-y-6", children: [
1476
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
1477
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-2", children: "Ferramentas" }),
1478
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
1479
+ /* @__PURE__ */ jsxRuntime.jsx(
1480
+ ToolButton,
1481
+ {
1482
+ active: selectedMode === null,
1483
+ onClick: () => handleModeChange(null),
1484
+ icon: lucideReact.MousePointer2,
1485
+ label: "Navegar"
1486
+ }
1487
+ ),
1488
+ /* @__PURE__ */ jsxRuntime.jsx(
1489
+ ToolButton,
1490
+ {
1491
+ active: selectedMode === "marker",
1492
+ onClick: () => handleModeChange("marker"),
1493
+ icon: lucideReact.MapPin,
1494
+ label: "Marcador"
1495
+ }
1496
+ ),
1497
+ /* @__PURE__ */ jsxRuntime.jsx(
1498
+ ToolButton,
1499
+ {
1500
+ active: selectedMode === "circle",
1501
+ onClick: () => handleModeChange("circle"),
1502
+ icon: lucideReact.Circle,
1503
+ label: "Círculo"
1504
+ }
1505
+ ),
1506
+ /* @__PURE__ */ jsxRuntime.jsx(
1507
+ ToolButton,
1508
+ {
1509
+ active: selectedMode === "rectangle",
1510
+ onClick: () => handleModeChange("rectangle"),
1511
+ icon: lucideReact.Square,
1512
+ label: "Retângulo"
1513
+ }
1514
+ ),
1515
+ /* @__PURE__ */ jsxRuntime.jsx(
1516
+ ToolButton,
1517
+ {
1518
+ active: selectedMode === "polygon",
1519
+ onClick: () => handleModeChange("polygon"),
1520
+ icon: lucideReact.Hexagon,
1521
+ label: "Polígono"
1522
+ }
1523
+ )
1524
+ ] })
1525
+ ] }),
1526
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
1527
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
1528
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-2", children: "Ações" }),
1529
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
1530
+ /* @__PURE__ */ jsxRuntime.jsxs(
1531
+ button.Button,
1532
+ {
1533
+ variant: "outline",
1534
+ onClick: undoLast,
1535
+ disabled: shapes.length === 0 && !isDrawingPolygon,
1536
+ className: "w-full",
1537
+ title: "Desfazer último",
1538
+ "aria-label": "Desfazer último",
1539
+ children: [
1540
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Undo, { className: "h-4 w-4 mr-2" }),
1541
+ "Desfazer"
1542
+ ]
1543
+ }
1544
+ ),
1545
+ /* @__PURE__ */ jsxRuntime.jsxs(
1546
+ button.Button,
1547
+ {
1548
+ variant: "destructive",
1549
+ onClick: clearAll,
1550
+ disabled: shapes.length === 0 && !isDrawingPolygon,
1551
+ className: "w-full bg-destructive/10 text-destructive hover:bg-destructive hover:text-destructive-foreground border-0 shadow-none",
1552
+ children: [
1553
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-4 w-4 mr-2" }),
1554
+ "Limpar"
1555
+ ]
1556
+ }
1557
+ )
1558
+ ] }),
1559
+ /* @__PURE__ */ jsxRuntime.jsxs(
1560
+ button.Button,
1561
+ {
1562
+ variant: "default",
1563
+ onClick: handleSave,
1564
+ disabled: shapes.length === 0,
1565
+ className: "w-full mt-2",
1566
+ children: [
1567
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Save, { className: "h-4 w-4 mr-2" }),
1568
+ "Salvar GeoJSON"
1569
+ ]
1570
+ }
1571
+ )
1572
+ ] })
1573
+ ] }) }),
1574
+ isDrawingPolygon && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 bg-primary/5 border-t border-primary/10", children: [
1575
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-2 text-primary text-xs font-medium", children: [
1576
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex h-2 w-2", children: [
1577
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75" }),
1578
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-primary" })
1579
+ ] }),
1580
+ "Desenhando Polígono..."
1581
+ ] }),
1582
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
1583
+ /* @__PURE__ */ jsxRuntime.jsxs(
1584
+ button.Button,
1585
+ {
1586
+ size: "sm",
1587
+ className: "w-full bg-green-600 hover:bg-green-700 text-white",
1588
+ onClick: finishPolygon,
1589
+ children: [
1590
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3 w-3 mr-1" }),
1591
+ " Concluir"
1592
+ ]
1593
+ }
1594
+ ),
1595
+ /* @__PURE__ */ jsxRuntime.jsxs(
1596
+ button.Button,
1597
+ {
1598
+ size: "sm",
1599
+ variant: "outline",
1600
+ className: "w-full",
1601
+ onClick: cancelPolygonDrawing,
1602
+ children: [
1603
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3 mr-1" }),
1604
+ " Cancelar"
1605
+ ]
1606
+ }
1607
+ )
1608
+ ] })
1609
+ ] })
1610
+ ] }),
1611
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 relative bg-muted/5 min-h-[400px]", children: [
1612
+ /* @__PURE__ */ jsxRuntime.jsx(
1613
+ alertDialog.Map,
1614
+ {
1615
+ className: "h-full w-full rounded-none md:rounded-br-lg",
1616
+ center: { lat: -23.5505, lng: -46.6333 },
1617
+ zoom: 13,
1618
+ height: "100%",
1619
+ mapContainerClassName: "h-full w-full rounded-none md:rounded-br-lg",
1620
+ disableDefaultUI: true,
1621
+ zoomControl: true,
1622
+ onMapLoad: setMapInstance,
1623
+ apiKey
1624
+ }
1625
+ ),
1626
+ selectedMode && !isDrawingPolygon && /* @__PURE__ */ jsxRuntime.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: [
1627
+ selectedMode === "marker" && "Clique no mapa para adicionar um marcador",
1628
+ selectedMode === "circle" && "Clique no mapa para definir o centro do círculo",
1629
+ selectedMode === "rectangle" && "Clique no mapa para criar um retângulo",
1630
+ selectedMode === "polygon" && "Clique sequencialmente para desenhar a área"
1631
+ ] })
1632
+ ] }),
1633
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.Dialog, { open: showSaveDialog, onOpenChange: setShowSaveDialog, children: /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.DialogContent, { className: "max-w-md", children: [
1634
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.DialogHeader, { children: [
1635
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogTitle, { children: "Dados Geográficos (GeoJSON)" }),
1636
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogDescription, { children: "Copie os dados das formas desenhadas abaixo." })
1637
+ ] }),
1638
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative mt-2", children: /* @__PURE__ */ jsxRuntime.jsx(
1639
+ "pre",
1640
+ {
1641
+ className: "p-4 rounded-lg bg-muted overflow-auto max-h-[300px] text-xs font-mono",
1642
+ "data-custom-scrollbar": true,
1643
+ children: savedData
1644
+ }
1645
+ ) }),
1646
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end mt-4", children: /* @__PURE__ */ jsxRuntime.jsx(button.Button, { onClick: () => setShowSaveDialog(false), children: "Fechar" }) })
1647
+ ] }) })
1648
+ ] })
1649
+ ] });
1650
+ }
1651
+ function MapShowcase() {
1652
+ const [activeTab, setActiveTab] = React.useState("simple");
1653
+ const [isTransitioning, setIsTransitioning] = React.useState(false);
1654
+ const [apiKey, setApiKey] = React.useState("");
1655
+ const [inputApiKey, setInputApiKey] = React.useState("");
1656
+ const [showTraffic, setShowTraffic] = React.useState(false);
1657
+ const [showTransit, setShowTransit] = React.useState(false);
1658
+ const [showBicycling, setShowBicycling] = React.useState(false);
1659
+ const [showZoomControl, setShowZoomControl] = React.useState(true);
1660
+ const [showMapTypeControl, setShowMapTypeControl] = React.useState(false);
1661
+ const [showStreetViewControl, setShowStreetViewControl] = React.useState(false);
1662
+ const [showFullscreenControl, setShowFullscreenControl] = React.useState(true);
1663
+ const handleTabChange = (value) => {
1664
+ if (value === activeTab) return;
1665
+ setIsTransitioning(true);
1666
+ setTimeout(() => {
1667
+ setActiveTab(value);
1668
+ setIsTransitioning(false);
1669
+ }, 50);
1670
+ };
1671
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-8", children: [
1672
+ /* @__PURE__ */ jsxRuntime.jsx(
1673
+ alertDialog.PageHeader,
1674
+ {
1675
+ title: "Mapas",
1676
+ 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.",
1677
+ actions: /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { children: "Design System" })
1678
+ }
1679
+ ),
1680
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1681
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1682
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Configuração da API Key" }),
1683
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Insira sua Google Maps API Key para renderizar os mapas abaixo." })
1684
+ ] }),
1685
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-md items-center space-x-2", children: [
1686
+ /* @__PURE__ */ jsxRuntime.jsx(
1687
+ input.Input,
1688
+ {
1689
+ type: "password",
1690
+ placeholder: "Cole sua Google Maps API Key aqui",
1691
+ "aria-label": "Google Maps API Key",
1692
+ value: inputApiKey,
1693
+ onChange: (e) => setInputApiKey(e.target.value),
1694
+ className: "max-w-md h-10"
1695
+ }
1696
+ ),
1697
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { onClick: () => setApiKey(inputApiKey), children: "Salvar" })
1698
+ ] }) })
1699
+ ] }),
1700
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Tabs, { value: activeTab, onValueChange: handleTabChange, className: "w-full", children: [
1701
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.TabsList, { className: "grid w-full grid-cols-4 mb-8", children: [
1702
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "simple", children: "Mapas Simples" }),
1703
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "markers", children: "Marcadores" }),
1704
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "controls", children: "Controles" }),
1705
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.TabsTrigger, { value: "drawing", className: "flex items-center gap-2", children: [
1706
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pencil, { className: "w-3 h-3" }),
1707
+ " Desenho"
1708
+ ] })
1709
+ ] }),
1710
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "simple", className: "space-y-8", children: !isTransitioning && activeTab === "simple" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1711
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1712
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1713
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Mapa Padrão" }),
1714
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Configuração básica do mapa centralizado em uma coordenada específica." })
1715
+ ] }),
1716
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(
1717
+ alertDialog.Map,
1718
+ {
1719
+ center: { lat: -23.5505, lng: -46.6333 },
1720
+ zoom: 13,
1721
+ height: "400px",
1722
+ apiKey
1723
+ }
1724
+ ) })
1725
+ ] }),
1726
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1727
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1728
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Camadas (Layers)" }),
1729
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Sobreposição de informações como tráfego, transporte público e ciclovias." })
1730
+ ] }),
1731
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-4", children: [
1732
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-6 p-4 border rounded-lg bg-muted/50", children: [
1733
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1734
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Switch, { id: "traffic", checked: showTraffic, onCheckedChange: setShowTraffic }),
1735
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Label, { htmlFor: "traffic", className: "flex items-center gap-2", children: [
1736
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Layers, { className: "w-4 h-4" }),
1737
+ " Trânsito"
1738
+ ] })
1739
+ ] }),
1740
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1741
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Switch, { id: "transit", checked: showTransit, onCheckedChange: setShowTransit }),
1742
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Label, { htmlFor: "transit", className: "flex items-center gap-2", children: [
1743
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Layers, { className: "w-4 h-4" }),
1744
+ " Transporte"
1745
+ ] })
1746
+ ] }),
1747
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1748
+ /* @__PURE__ */ jsxRuntime.jsx(
1749
+ alertDialog.Switch,
1750
+ {
1751
+ id: "bicycling",
1752
+ checked: showBicycling,
1753
+ onCheckedChange: setShowBicycling
1754
+ }
1755
+ ),
1756
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Label, { htmlFor: "bicycling", className: "flex items-center gap-2", children: [
1757
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Layers, { className: "w-4 h-4" }),
1758
+ " Ciclovias"
1759
+ ] })
1760
+ ] })
1761
+ ] }),
1762
+ /* @__PURE__ */ jsxRuntime.jsx(
1763
+ alertDialog.Map,
1764
+ {
1765
+ center: { lat: -23.5505, lng: -46.6333 },
1766
+ zoom: 12,
1767
+ height: "500px",
1768
+ layers: {
1769
+ traffic: showTraffic,
1770
+ transit: showTransit,
1771
+ bicycling: showBicycling
1772
+ },
1773
+ apiKey
1774
+ }
1775
+ )
1776
+ ] })
1777
+ ] }),
1778
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid md:grid-cols-3 gap-4", children: [
1779
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1780
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { className: "text-sm", children: "São Paulo" }) }),
1781
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsxRuntime.jsx(
1782
+ alertDialog.Map,
1783
+ {
1784
+ center: { lat: -23.5505, lng: -46.6333 },
1785
+ zoom: 11,
1786
+ height: "200px",
1787
+ disableDefaultUI: true,
1788
+ apiKey
1789
+ }
1790
+ ) })
1791
+ ] }),
1792
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1793
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { className: "text-sm", children: "Rio de Janeiro" }) }),
1794
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsxRuntime.jsx(
1795
+ alertDialog.Map,
1796
+ {
1797
+ center: { lat: -22.9068, lng: -43.1729 },
1798
+ zoom: 11,
1799
+ height: "200px",
1800
+ disableDefaultUI: true,
1801
+ apiKey
1802
+ }
1803
+ ) })
1804
+ ] }),
1805
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1806
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardHeader, { className: "p-4 pb-2", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { className: "text-sm", children: "New York" }) }),
1807
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "p-4 pt-0", children: /* @__PURE__ */ jsxRuntime.jsx(
1808
+ alertDialog.Map,
1809
+ {
1810
+ center: { lat: 40.7128, lng: -74.006 },
1811
+ zoom: 11,
1812
+ height: "200px",
1813
+ disableDefaultUI: true,
1814
+ apiKey
1815
+ }
1816
+ ) })
1817
+ ] })
1818
+ ] })
1819
+ ] }) }),
1820
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "markers", className: "space-y-8", children: !isTransitioning && activeTab === "markers" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1821
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1822
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1823
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Marcadores e Pins" }),
1824
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Exemplos de marcadores personalizados com diferentes cores e informações." })
1825
+ ] }),
1826
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(
1827
+ alertDialog.Map,
1828
+ {
1829
+ center: { lat: -23.5505, lng: -46.6333 },
1830
+ zoom: 13,
1831
+ height: "500px",
1832
+ apiKey,
1833
+ markers: [
1834
+ {
1835
+ position: { lat: -23.5505, lng: -46.6333 },
1836
+ title: "Principal",
1837
+ info: "Marcador padrão",
1838
+ customColor: "#4F46E5"
1839
+ },
1840
+ {
1841
+ position: { lat: -23.54, lng: -46.64 },
1842
+ title: "Secundário",
1843
+ info: "Marcador de alerta",
1844
+ customColor: "#EF4444",
1845
+ icon: "!"
1846
+ },
1847
+ {
1848
+ position: { lat: -23.56, lng: -46.62 },
1849
+ title: "Loja",
1850
+ info: "Ponto de venda",
1851
+ customColor: "#10B981",
1852
+ icon: "S"
1853
+ }
1854
+ ]
1855
+ }
1856
+ ) })
1857
+ ] }),
1858
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1859
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1860
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Marcador com Ações" }),
1861
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Marcador interativo que exibe conteúdo rico (texto, imagem, botões) ao ser clicado." })
1862
+ ] }),
1863
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(
1864
+ alertDialog.Map,
1865
+ {
1866
+ center: { lat: -23.5505, lng: -46.6333 },
1867
+ zoom: 13,
1868
+ height: "500px",
1869
+ apiKey,
1870
+ markers: [
1871
+ {
1872
+ position: { lat: -23.5505, lng: -46.6333 },
1873
+ label: "🏢",
1874
+ richContent: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 max-w-[260px]", children: [
1875
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2", children: [
1876
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-base", children: "Xertica HQ" }),
1877
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "outline", className: "text-[10px] h-5", children: "Open" })
1878
+ ] }),
1879
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full h-32 bg-muted rounded-md mb-3 overflow-hidden relative", children: [
1880
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" }),
1881
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center text-white font-medium", children: "Office View" })
1882
+ ] }),
1883
+ /* @__PURE__ */ jsxRuntime.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." }),
1884
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-2", children: [
1885
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "sm", className: "w-full h-8 text-xs shadow-sm", children: "Navegar" }),
1886
+ /* @__PURE__ */ jsxRuntime.jsx(
1887
+ button.Button,
1888
+ {
1889
+ size: "sm",
1890
+ variant: "outline",
1891
+ className: "w-full h-8 text-xs bg-background",
1892
+ children: "Detalhes"
1893
+ }
1894
+ )
1895
+ ] })
1896
+ ] })
1897
+ }
1898
+ ]
1899
+ }
1900
+ ) })
1901
+ ] }),
1902
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1903
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1904
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Áreas e Zonas" }),
1905
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Delimitação de áreas geográficas usando círculos e polígonos." })
1906
+ ] }),
1907
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(
1908
+ alertDialog.Map,
1909
+ {
1910
+ center: { lat: -23.5505, lng: -46.6333 },
1911
+ zoom: 12,
1912
+ height: "500px",
1913
+ apiKey,
1914
+ markers: [
1915
+ {
1916
+ position: { lat: -23.5505, lng: -46.6333 },
1917
+ title: "Centro da Zona",
1918
+ info: "Raio de 3km",
1919
+ customColor: "#6366F1"
1920
+ }
1921
+ ],
1922
+ circle: {
1923
+ center: { lat: -23.5505, lng: -46.6333 },
1924
+ radius: 3e3,
1925
+ fillColor: "#6366F1",
1926
+ strokeColor: "#4F46E5"
1927
+ },
1928
+ polygon: {
1929
+ paths: [
1930
+ [
1931
+ { lat: -23.52, lng: -46.6 },
1932
+ { lat: -23.52, lng: -46.66 },
1933
+ { lat: -23.58, lng: -46.66 },
1934
+ { lat: -23.58, lng: -46.6 }
1935
+ ]
1936
+ ],
1937
+ fillColor: "#10B981",
1938
+ strokeColor: "#059669"
1939
+ }
1940
+ }
1941
+ ) })
1942
+ ] })
1943
+ ] }) }),
1944
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "controls", className: "space-y-8", children: !isTransitioning && activeTab === "controls" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1945
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
1946
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
1947
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Controles do Mapa" }),
1948
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Personalize a interface do mapa ativando ou desativando controles nativos." })
1949
+ ] }),
1950
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-4", children: [
1951
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 p-4 border rounded-lg bg-muted/50", children: [
1952
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1953
+ /* @__PURE__ */ jsxRuntime.jsx(
1954
+ alertDialog.Checkbox,
1955
+ {
1956
+ id: "zoom",
1957
+ checked: showZoomControl,
1958
+ onCheckedChange: (c) => setShowZoomControl(!!c)
1959
+ }
1960
+ ),
1961
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "zoom", children: "Zoom Control" })
1962
+ ] }),
1963
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1964
+ /* @__PURE__ */ jsxRuntime.jsx(
1965
+ alertDialog.Checkbox,
1966
+ {
1967
+ id: "maptype",
1968
+ checked: showMapTypeControl,
1969
+ onCheckedChange: (c) => setShowMapTypeControl(!!c)
1970
+ }
1971
+ ),
1972
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "maptype", children: "Map Type" })
1973
+ ] }),
1974
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1975
+ /* @__PURE__ */ jsxRuntime.jsx(
1976
+ alertDialog.Checkbox,
1977
+ {
1978
+ id: "streetview",
1979
+ checked: showStreetViewControl,
1980
+ onCheckedChange: (c) => setShowStreetViewControl(!!c)
1981
+ }
1982
+ ),
1983
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "streetview", children: "Street View" })
1984
+ ] }),
1985
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
1986
+ /* @__PURE__ */ jsxRuntime.jsx(
1987
+ alertDialog.Checkbox,
1988
+ {
1989
+ id: "fullscreen",
1990
+ checked: showFullscreenControl,
1991
+ onCheckedChange: (c) => setShowFullscreenControl(!!c)
1992
+ }
1993
+ ),
1994
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "fullscreen", children: "Fullscreen" })
1995
+ ] })
1996
+ ] }),
1997
+ /* @__PURE__ */ jsxRuntime.jsx(
1998
+ alertDialog.Map,
1999
+ {
2000
+ center: { lat: -23.5505, lng: -46.6333 },
2001
+ zoom: 13,
2002
+ height: "400px",
2003
+ apiKey,
2004
+ zoomControl: showZoomControl,
2005
+ mapTypeControl: showMapTypeControl,
2006
+ streetViewControl: showStreetViewControl,
2007
+ fullscreenControl: showFullscreenControl
2008
+ }
2009
+ )
2010
+ ] })
2011
+ ] }),
2012
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2013
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2014
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: "Filtros Interativos" }),
2015
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: "Exemplo avançado de mapa com controles customizados para filtragem de marcadores." })
2016
+ ] }),
2017
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(FilterableMapExample, { apiKey }) })
2018
+ ] })
2019
+ ] }) }),
2020
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "drawing", className: "space-y-8", children: !isTransitioning && activeTab === "drawing" && /* @__PURE__ */ jsxRuntime.jsx(DrawingMapExample, { apiKey }) })
2021
+ ] }),
2022
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid md:grid-cols-3 gap-6 pt-8 border-t", children: [
2023
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2024
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-sm", children: "Documentação" }),
2025
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
2026
+ "Verifique ",
2027
+ /* @__PURE__ */ jsxRuntime.jsx("code", { children: "MAP_SETUP.md" }),
2028
+ " para configuração inicial e requisitos de API."
2029
+ ] })
2030
+ ] }),
2031
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2032
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-sm", children: "Performance" }),
2033
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "Utiliza carregamento assíncrono e AdvancedMarkerElement para melhor desempenho." })
2034
+ ] }),
2035
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2036
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-semibold text-sm", children: "Design System" }),
2037
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
2038
+ "Componentes seguem estritamente as variáveis de tokens do ",
2039
+ /* @__PURE__ */ jsxRuntime.jsx("code", { children: "globals.css" }),
2040
+ "."
2041
+ ] })
2042
+ ] })
2043
+ ] })
2044
+ ] });
2045
+ }
2046
+ function TemplateContent() {
2047
+ const { t: t2 } = reactI18next.useTranslation();
2048
+ const layout = LayoutContext.useOptionalLayout();
2049
+ const [localSidebarExpanded, setLocalSidebarExpanded] = React.useState(false);
2050
+ const [localSidebarWidth, setLocalSidebarWidth] = React.useState(280);
2051
+ const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
2052
+ const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? localSidebarWidth;
2053
+ const setSidebarWidth = (layout == null ? void 0 : layout.setSidebarWidth) ?? setLocalSidebarWidth;
2054
+ (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
2055
+ reactRouterDom.useNavigate();
2056
+ const { data: teamMembers = [], isLoading: teamLoading } = useTeamMembers();
2057
+ const progress$1 = useDashboardStore((s) => s.progress);
2058
+ const setProgress = useDashboardStore((s) => s.setProgress);
2059
+ const sliderValue = useDashboardStore((s) => s.sliderValue);
2060
+ const setSliderValue = useDashboardStore((s) => s.setSliderValue);
2061
+ const switchEnabled = useDashboardStore((s) => s.switchEnabled);
2062
+ const toggleSwitch = useDashboardStore((s) => s.toggleSwitch);
2063
+ const [showSidebarUser, setShowSidebarUser] = React.useState(true);
2064
+ const [showSidebarSettings, setShowSidebarSettings] = React.useState(true);
2065
+ const [showSidebarLogout, setShowSidebarLogout] = React.useState(true);
2066
+ const [showHeaderActions, setShowHeaderActions] = React.useState(true);
2067
+ const [showHeaderBreadcrumbs, setShowHeaderBreadcrumbs] = React.useState(true);
2068
+ const handleFormSubmit = (e) => {
2069
+ e.preventDefault();
2070
+ sonner.toast.success(t2("templates.formSubmitSuccess"));
2071
+ };
2072
+ return /* @__PURE__ */ jsxRuntime.jsxs(
2073
+ "div",
2074
+ {
2075
+ className: "flex-1 flex flex-col overflow-hidden transition-all duration-300",
2076
+ style: {
2077
+ paddingLeft: sidebarExpanded ? `${sidebarWidth}px` : "80px"
2078
+ },
2079
+ children: [
2080
+ /* @__PURE__ */ jsxRuntime.jsx(
2081
+ sidebar.Header,
2082
+ {
2083
+ showThemeToggle: true,
2084
+ showLanguageSelector: true,
2085
+ breadcrumbs: [
2086
+ { label: t2("nav.designSystem"), href: "/home", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Home, { className: "w-4 h-4" }) },
2087
+ { label: t2("templates.breadcrumb") }
2088
+ ],
2089
+ renderLink: (href, props) => /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Link, { to: href, ...props })
2090
+ }
2091
+ ),
2092
+ /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-hidden bg-muted", children: /* @__PURE__ */ jsxRuntime.jsx(input.ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 sm:p-4 md:p-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-6xl mx-auto space-y-8", children: [
2093
+ /* @__PURE__ */ jsxRuntime.jsx(
2094
+ alertDialog.PageHeader,
2095
+ {
2096
+ title: t2("templates.title"),
2097
+ subtitle: t2("templates.subtitle")
2098
+ }
2099
+ ),
2100
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2101
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.headerWithBreadcrumbs.sectionTitle") }),
2102
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2103
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2104
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.headerWithBreadcrumbs.cardTitle") }),
2105
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.headerWithBreadcrumbs.cardDescription") })
2106
+ ] }),
2107
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "p-0 border-t bg-background overflow-hidden rounded-b-[var(--radius-lg)]", children: [
2108
+ /* @__PURE__ */ jsxRuntime.jsx(
2109
+ sidebar.Header,
2110
+ {
2111
+ className: "border-b",
2112
+ breadcrumbs: [
2113
+ { label: t2("templates.headerWithBreadcrumbs.breadcrumbs.dashboard"), href: "#", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Home, { className: "w-4 h-4" }) },
2114
+ { label: t2("templates.headerWithBreadcrumbs.breadcrumbs.settings"), href: "#", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings, { className: "w-4 h-4" }) },
2115
+ { label: t2("templates.headerWithBreadcrumbs.breadcrumbs.users"), href: "#", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Users, { className: "w-4 h-4" }) },
2116
+ { label: t2("templates.headerWithBreadcrumbs.breadcrumbs.accessProfile") }
2117
+ ],
2118
+ showLanguageSelector: true,
2119
+ showThemeToggle: true
2120
+ }
2121
+ ),
2122
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6 min-h-[200px]", children: [
2123
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-lg font-semibold mb-2", children: t2("templates.headerWithBreadcrumbs.exampleContentTitle") }),
2124
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-muted-foreground", children: [
2125
+ t2("templates.headerWithBreadcrumbs.exampleContentDescriptionPart1"),
2126
+ /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "Header" }),
2127
+ t2("templates.headerWithBreadcrumbs.exampleContentDescriptionPart2")
2128
+ ] })
2129
+ ] })
2130
+ ] })
2131
+ ] })
2132
+ ] }),
2133
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2134
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2135
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.alerts") }),
2136
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
2137
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Alert, { variant: "info", children: [
2138
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertTitle, { children: t2("templates.alerts.infoTitle") }),
2139
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertDescription, { children: t2("templates.alerts.infoDescription") })
2140
+ ] }),
2141
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Alert, { variant: "destructive", children: [
2142
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertTitle, { children: t2("templates.alerts.errorTitle") }),
2143
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertDescription, { children: t2("templates.alerts.errorDescription") })
2144
+ ] }),
2145
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Alert, { variant: "success", children: [
2146
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertTitle, { children: t2("templates.alerts.successTitle") }),
2147
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertDescription, { children: t2("templates.alerts.successDescription") })
2148
+ ] }),
2149
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Alert, { variant: "warning", children: [
2150
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertTitle, { children: t2("templates.alerts.warningTitle") }),
2151
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertDescription, { children: t2("templates.alerts.warningDescription") })
2152
+ ] })
2153
+ ] })
2154
+ ] }),
2155
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2156
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2157
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.cardsAndTabs") }),
2158
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Tabs, { defaultValue: "overview", className: "w-full", children: [
2159
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.TabsList, { className: "grid w-full grid-cols-4", children: [
2160
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "overview", children: t2("templates.tabs.overview") }),
2161
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "forms", children: t2("templates.tabs.forms") }),
2162
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "data", children: t2("templates.tabs.data") }),
2163
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "settings", children: t2("templates.tabs.settings") })
2164
+ ] }),
2165
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.TabsContent, { value: "overview", className: "space-y-4", children: [
2166
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
2167
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2168
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2169
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("stats.totalUsers") }),
2170
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("stats.last30Days") })
2171
+ ] }),
2172
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-foreground", children: [
2173
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "1,234" }),
2174
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "default", className: "ml-2", children: "+12%" })
2175
+ ] }) })
2176
+ ] }),
2177
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2178
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2179
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("stats.totalRevenue") }),
2180
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("stats.currentMonth") })
2181
+ ] }),
2182
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-foreground", children: [
2183
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "$ 45.2k" }),
2184
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "secondary", className: "ml-2", children: "+8%" })
2185
+ ] }) })
2186
+ ] }),
2187
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2188
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2189
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("stats.conversionRate") }),
2190
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("stats.currentWeek") })
2191
+ ] }),
2192
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-foreground", children: [
2193
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "[font-size:var(--text-stats)] [font-weight:var(--font-weight-bold)]", children: "3.2%" }),
2194
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "outline", className: "ml-2", children: "-2%" })
2195
+ ] }) })
2196
+ ] })
2197
+ ] }),
2198
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2199
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2200
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.overview.progressTitle") }),
2201
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.overview.progressDescription") })
2202
+ ] }),
2203
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-6", children: [
2204
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2205
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2206
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.overview.projectProgress") }),
2207
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "[font-size:var(--text-small)] text-muted-foreground", children: [
2208
+ progress$1,
2209
+ "%"
2210
+ ] })
2211
+ ] }),
2212
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Progress, { value: progress$1, className: "w-full" }),
2213
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
2214
+ /* @__PURE__ */ jsxRuntime.jsx(
2215
+ button.Button,
2216
+ {
2217
+ size: "sm",
2218
+ onClick: () => setProgress(Math.max(0, progress$1 - 10)),
2219
+ children: "-10%"
2220
+ }
2221
+ ),
2222
+ /* @__PURE__ */ jsxRuntime.jsx(
2223
+ button.Button,
2224
+ {
2225
+ size: "sm",
2226
+ onClick: () => setProgress(Math.min(100, progress$1 + 10)),
2227
+ children: "+10%"
2228
+ }
2229
+ )
2230
+ ] })
2231
+ ] }),
2232
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2233
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2234
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2235
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.overview.volume") }),
2236
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "[font-size:var(--text-small)] text-muted-foreground", children: [
2237
+ sliderValue[0],
2238
+ "%"
2239
+ ] })
2240
+ ] }),
2241
+ /* @__PURE__ */ jsxRuntime.jsx(
2242
+ slider.Slider,
2243
+ {
2244
+ value: sliderValue,
2245
+ onValueChange: setSliderValue,
2246
+ min: 0,
2247
+ max: 100,
2248
+ step: 1,
2249
+ className: "w-full",
2250
+ "aria-label": t2("templates.overview.volume")
2251
+ }
2252
+ )
2253
+ ] })
2254
+ ] })
2255
+ ] })
2256
+ ] }),
2257
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "forms", className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2258
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2259
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.forms.registrationTitle") }),
2260
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.forms.registrationDescription") })
2261
+ ] }),
2262
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleFormSubmit, className: "space-y-4", children: [
2263
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
2264
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2265
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "firstName", children: t2("templates.forms.firstName") }),
2266
+ /* @__PURE__ */ jsxRuntime.jsx(input.Input, { id: "firstName", placeholder: t2("templates.forms.firstNamePlaceholder") })
2267
+ ] }),
2268
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2269
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "lastName", children: t2("templates.forms.lastName") }),
2270
+ /* @__PURE__ */ jsxRuntime.jsx(input.Input, { id: "lastName", placeholder: t2("templates.forms.lastNamePlaceholder") })
2271
+ ] })
2272
+ ] }),
2273
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2274
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "email", children: t2("templates.forms.email") }),
2275
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2276
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
2277
+ /* @__PURE__ */ jsxRuntime.jsx(
2278
+ input.Input,
2279
+ {
2280
+ id: "email",
2281
+ type: "email",
2282
+ placeholder: t2("templates.forms.emailPlaceholder"),
2283
+ className: "pl-10"
2284
+ }
2285
+ )
2286
+ ] })
2287
+ ] }),
2288
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2289
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "phone", children: t2("templates.forms.phone") }),
2290
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2291
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Phone, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
2292
+ /* @__PURE__ */ jsxRuntime.jsx(
2293
+ input.Input,
2294
+ {
2295
+ id: "phone",
2296
+ type: "tel",
2297
+ placeholder: t2("templates.forms.phonePlaceholder"),
2298
+ className: "pl-10"
2299
+ }
2300
+ )
2301
+ ] })
2302
+ ] }),
2303
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2304
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "role", children: t2("templates.forms.role") }),
2305
+ /* @__PURE__ */ jsxRuntime.jsxs(select.Select, { children: [
2306
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { id: "role", children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder: t2("templates.forms.rolePlaceholder") }) }),
2307
+ /* @__PURE__ */ jsxRuntime.jsxs(select.SelectContent, { children: [
2308
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "developer", children: t2("templates.forms.roles.developer") }),
2309
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "designer", children: t2("templates.forms.roles.designer") }),
2310
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "manager", children: t2("templates.forms.roles.manager") }),
2311
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "analyst", children: t2("templates.forms.roles.analyst") })
2312
+ ] })
2313
+ ] })
2314
+ ] }),
2315
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
2316
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "bio", children: t2("templates.forms.bio") }),
2317
+ /* @__PURE__ */ jsxRuntime.jsx(
2318
+ richTextEditor.Textarea,
2319
+ {
2320
+ id: "bio",
2321
+ placeholder: t2("templates.forms.bioPlaceholder"),
2322
+ rows: 4
2323
+ }
2324
+ )
2325
+ ] }),
2326
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2327
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
2328
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { children: t2("templates.forms.preferences") }),
2329
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2330
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2331
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Checkbox, { id: "newsletter" }),
2332
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "newsletter", className: "font-normal", children: t2("templates.forms.newsletter") })
2333
+ ] }),
2334
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2335
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Checkbox, { id: "notifications" }),
2336
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "notifications", className: "font-normal", children: t2("templates.forms.pushNotifications") })
2337
+ ] }),
2338
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2339
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Checkbox, { id: "updates" }),
2340
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "updates", className: "font-normal", children: t2("templates.forms.featureUpdates") })
2341
+ ] })
2342
+ ] }),
2343
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2344
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2345
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.forms.accountType") }),
2346
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.RadioGroup, { defaultValue: "personal", "aria-label": t2("templates.forms.accountType"), children: [
2347
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2348
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.RadioGroupItem, { value: "personal", id: "personal" }),
2349
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "personal", className: "font-normal", children: t2("templates.forms.accountPersonal") })
2350
+ ] }),
2351
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2352
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.RadioGroupItem, { value: "business", id: "business" }),
2353
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "business", className: "font-normal", children: t2("templates.forms.accountBusiness") })
2354
+ ] }),
2355
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2356
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.RadioGroupItem, { value: "enterprise", id: "enterprise" }),
2357
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "enterprise", className: "font-normal", children: t2("templates.forms.accountEnterprise") })
2358
+ ] })
2359
+ ] })
2360
+ ] })
2361
+ ] })
2362
+ ] }) }),
2363
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardFooter, { className: "flex justify-between", children: [
2364
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", children: t2("templates.forms.cancel") }),
2365
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { onClick: handleFormSubmit, children: t2("templates.forms.createAccount") })
2366
+ ] })
2367
+ ] }) }),
2368
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "data", className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsx(SectionErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2369
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2370
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.data.title") }),
2371
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.data.description") })
2372
+ ] }),
2373
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { children: [
2374
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2375
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
2376
+ /* @__PURE__ */ jsxRuntime.jsx(
2377
+ input.Input,
2378
+ {
2379
+ placeholder: t2("templates.data.searchPlaceholder"),
2380
+ "aria-label": t2("templates.data.searchPlaceholder"),
2381
+ className: "pl-10"
2382
+ }
2383
+ )
2384
+ ] }) }),
2385
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-[var(--radius-lg)] border border-border overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Table, { children: [
2386
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.TableRow, { children: [
2387
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHead, { children: t2("team.name") }),
2388
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHead, { children: t2("team.email") }),
2389
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHead, { children: t2("team.role") }),
2390
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHead, { children: t2("team.status") }),
2391
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableHead, { className: "text-right", children: t2("team.actions") })
2392
+ ] }) }),
2393
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableBody, { children: teamLoading ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.TableRow, { children: [
2394
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
2395
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "size-8 rounded-full shrink-0" }),
2396
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-28" })
2397
+ ] }) }),
2398
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-36" }) }),
2399
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-20" }) }),
2400
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-5 w-16 rounded-full" }) }),
2401
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-7 w-14 ml-auto" }) })
2402
+ ] }, i)) }) : teamMembers.map((member) => /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.TableRow, { children: [
2403
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: member.name }),
2404
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: member.email }),
2405
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: t2(`team.roles.${member.role}`) }),
2406
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsx(
2407
+ progress.Badge,
2408
+ {
2409
+ variant: member.status === "active" ? "default" : member.status === "away" ? "secondary" : "outline",
2410
+ children: t2(`common.${member.status}`)
2411
+ }
2412
+ ) }),
2413
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.TableCell, { className: "text-right", children: /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "ghost", size: "sm", children: t2("common.edit") }) })
2414
+ ] }, member.id)) })
2415
+ ] }) })
2416
+ ] }),
2417
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardFooter, { className: "flex justify-between items-center", children: [
2418
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2("team.showing", { count: teamMembers.length, total: teamMembers.length }) }),
2419
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
2420
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", size: "sm", children: t2("common.previous") }),
2421
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", size: "sm", children: t2("common.next") })
2422
+ ] })
2423
+ ] })
2424
+ ] }) }) }),
2425
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "settings", className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2426
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2427
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.settings.title") }),
2428
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.settings.description") })
2429
+ ] }),
2430
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-6", children: [
2431
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2432
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
2433
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "dark-mode", children: t2("templates.settings.darkMode") }),
2434
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2("templates.settings.darkModeDescription") })
2435
+ ] }),
2436
+ /* @__PURE__ */ jsxRuntime.jsx(
2437
+ alertDialog.Switch,
2438
+ {
2439
+ id: "dark-mode",
2440
+ checked: switchEnabled,
2441
+ onCheckedChange: toggleSwitch
2442
+ }
2443
+ )
2444
+ ] }),
2445
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2446
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2447
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
2448
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "email-notifications", children: t2("templates.settings.emailNotifications") }),
2449
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2("templates.settings.emailNotificationsDescription") })
2450
+ ] }),
2451
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Switch, { id: "email-notifications", defaultChecked: true })
2452
+ ] }),
2453
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2454
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2455
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
2456
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "push-notifications", children: t2("templates.settings.pushNotifications") }),
2457
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2("templates.settings.pushNotificationsDescription") })
2458
+ ] }),
2459
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Switch, { id: "push-notifications" })
2460
+ ] }),
2461
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2462
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2463
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.settings.language") }),
2464
+ /* @__PURE__ */ jsxRuntime.jsxs(select.Select, { defaultValue: "pt-br", children: [
2465
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { "aria-label": t2("templates.settings.language"), children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, {}) }),
2466
+ /* @__PURE__ */ jsxRuntime.jsxs(select.SelectContent, { children: [
2467
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "pt-br", children: t2("templates.settings.languages.ptBR") }),
2468
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "en", children: t2("templates.settings.languages.en") }),
2469
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "es", children: t2("templates.settings.languages.es") })
2470
+ ] })
2471
+ ] })
2472
+ ] }),
2473
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2474
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2475
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.settings.timezone") }),
2476
+ /* @__PURE__ */ jsxRuntime.jsxs(select.Select, { defaultValue: "america-sao-paulo", children: [
2477
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { "aria-label": t2("templates.settings.timezone"), children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, {}) }),
2478
+ /* @__PURE__ */ jsxRuntime.jsxs(select.SelectContent, { children: [
2479
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "america-sao-paulo", children: t2("templates.settings.timezones.saoPaulo") }),
2480
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "america-new-york", children: t2("templates.settings.timezones.newYork") }),
2481
+ /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "europe-london", children: t2("templates.settings.timezones.london") })
2482
+ ] })
2483
+ ] })
2484
+ ] })
2485
+ ] }),
2486
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardFooter, { className: "flex justify-between", children: [
2487
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", children: t2("templates.settings.restoreDefaults") }),
2488
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { children: t2("templates.settings.saveChanges") })
2489
+ ] })
2490
+ ] }) })
2491
+ ] })
2492
+ ] }),
2493
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2494
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2495
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.buttons") }),
2496
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2497
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2498
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.buttons.title") }),
2499
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.buttons.description") })
2500
+ ] }),
2501
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-6", children: [
2502
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2503
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.buttons.variants") }),
2504
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-3", children: [
2505
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "default", children: "Default" }),
2506
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "secondary", children: "Secondary" }),
2507
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", children: "Outline" }),
2508
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "ghost", children: "Ghost" }),
2509
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "link", children: "Link" }),
2510
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "destructive", children: "Destructive" })
2511
+ ] })
2512
+ ] }),
2513
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2514
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2515
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.buttons.sizes") }),
2516
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-3", children: [
2517
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "sm", children: "Small" }),
2518
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "default", children: "Default" }),
2519
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "lg", children: "Large" }),
2520
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "icon", "aria-label": t2("nav.settings"), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings, { className: "h-4 w-4" }) })
2521
+ ] })
2522
+ ] }),
2523
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2524
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2525
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.buttons.withIcons") }),
2526
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-3", children: [
2527
+ /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { children: [
2528
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "mr-2 h-4 w-4" }),
2529
+ t2("templates.buttons.profile")
2530
+ ] }),
2531
+ /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { variant: "secondary", children: [
2532
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "mr-2 h-4 w-4" }),
2533
+ t2("templates.buttons.messages")
2534
+ ] }),
2535
+ /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { variant: "outline", children: [
2536
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "mr-2 h-4 w-4" }),
2537
+ t2("templates.buttons.schedule")
2538
+ ] })
2539
+ ] })
2540
+ ] }),
2541
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, {}),
2542
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
2543
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { children: t2("templates.buttons.states") }),
2544
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-3", children: [
2545
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { disabled: true, children: t2("templates.buttons.disabled") }),
2546
+ /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", disabled: true, children: t2("templates.buttons.outlineDisabled") })
2547
+ ] })
2548
+ ] })
2549
+ ] })
2550
+ ] })
2551
+ ] }),
2552
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2553
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2554
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.badges") }),
2555
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2556
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2557
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.badges.title") }),
2558
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.badges.description") })
2559
+ ] }),
2560
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-3", children: [
2561
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "default", children: "Default" }),
2562
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "secondary", children: "Secondary" }),
2563
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "outline", children: "Outline" }),
2564
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { variant: "destructive", children: "Destructive" }),
2565
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { className: "bg-success text-success-foreground", children: "Success" }),
2566
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { className: "bg-warning text-warning-foreground", children: "Warning" }),
2567
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { className: "bg-info text-info-foreground", children: "Info" })
2568
+ ] }) })
2569
+ ] })
2570
+ ] }),
2571
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2572
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2573
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.dialogs") }),
2574
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 md:grid-cols-2", children: [
2575
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2576
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2577
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.dialogs.dialogTitle") }),
2578
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.dialogs.dialogDescription") })
2579
+ ] }),
2580
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "flex justify-center py-6", children: /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Dialog, { children: [
2581
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "outline", children: t2("templates.dialogs.editProfile") }) }),
2582
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.DialogContent, { className: "sm:max-w-[425px]", children: [
2583
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.DialogHeader, { children: [
2584
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogTitle, { children: t2("templates.dialogs.editProfile") }),
2585
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogDescription, { children: t2("templates.dialogs.editProfileDescription") })
2586
+ ] }),
2587
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4 py-4", children: [
2588
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-4 items-center gap-4", children: [
2589
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "name", className: "text-right", children: t2("templates.dialogs.name") }),
2590
+ /* @__PURE__ */ jsxRuntime.jsx(input.Input, { id: "name", defaultValue: "John Doe", className: "col-span-3" })
2591
+ ] }),
2592
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-4 items-center gap-4", children: [
2593
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "username", className: "text-right", children: t2("templates.dialogs.username") }),
2594
+ /* @__PURE__ */ jsxRuntime.jsx(input.Input, { id: "username", defaultValue: "@johndoe", className: "col-span-3" })
2595
+ ] })
2596
+ ] }),
2597
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.DialogFooter, { children: /* @__PURE__ */ jsxRuntime.jsx(button.Button, { type: "submit", children: t2("templates.dialogs.update") }) })
2598
+ ] })
2599
+ ] }) })
2600
+ ] }),
2601
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2602
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2603
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.dialogs.alertDialogTitle") }),
2604
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.dialogs.alertDialogDescription") })
2605
+ ] }),
2606
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: "flex justify-center py-6", children: /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialog, { children: [
2607
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "destructive", children: t2("templates.dialogs.deleteAccount") }) }),
2608
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogContent, { className: "sm:max-w-[425px]", children: [
2609
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogHeader, { children: [
2610
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogTitle, { children: t2("templates.dialogs.areYouSure") }),
2611
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogDescription, { children: t2("templates.dialogs.deleteWarning") })
2612
+ ] }),
2613
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.AlertDialogFooter, { children: [
2614
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogCancel, { children: t2("templates.dialogs.cancel") }),
2615
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.AlertDialogAction, { className: "bg-destructive text-destructive-foreground hover:bg-destructive/90", children: t2("templates.dialogs.continue") })
2616
+ ] })
2617
+ ] })
2618
+ ] }) })
2619
+ ] })
2620
+ ] })
2621
+ ] }),
2622
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2623
+ /* @__PURE__ */ jsxRuntime.jsx("section", { children: /* @__PURE__ */ jsxRuntime.jsx(MapShowcase, {}) }),
2624
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2625
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2626
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.headerVariations.sectionTitle") }),
2627
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2628
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2629
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.headerVariations.cardTitle") }),
2630
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.headerVariations.cardDescription") })
2631
+ ] }),
2632
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-6", children: [
2633
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 border rounded-[var(--radius-lg)] bg-muted/30", children: [
2634
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold mb-4", children: t2("templates.headerVariations.visibleElements") }),
2635
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6", children: [
2636
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2637
+ /* @__PURE__ */ jsxRuntime.jsx(
2638
+ alertDialog.Switch,
2639
+ {
2640
+ id: "header-actions",
2641
+ checked: showHeaderActions,
2642
+ onCheckedChange: setShowHeaderActions
2643
+ }
2644
+ ),
2645
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "header-actions", className: "cursor-pointer", children: t2("templates.headerVariations.actionButtons") })
2646
+ ] }),
2647
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2648
+ /* @__PURE__ */ jsxRuntime.jsx(
2649
+ alertDialog.Switch,
2650
+ {
2651
+ id: "header-bread",
2652
+ checked: showHeaderBreadcrumbs,
2653
+ onCheckedChange: setShowHeaderBreadcrumbs
2654
+ }
2655
+ ),
2656
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "header-bread", className: "cursor-pointer", children: t2("templates.headerVariations.breadcrumbsLabel") })
2657
+ ] })
2658
+ ] })
2659
+ ] }),
2660
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative border rounded-[var(--radius-lg)] bg-muted/10 overflow-hidden shadow-inner", children: [
2661
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 bg-background/50 border-b text-xs font-mono text-muted-foreground", children: t2("templates.headerVariations.preview") }),
2662
+ /* @__PURE__ */ jsxRuntime.jsx(
2663
+ sidebar.Header,
2664
+ {
2665
+ title: !showHeaderBreadcrumbs ? t2("templates.headerVariations.currentPage") : void 0,
2666
+ breadcrumbs: showHeaderBreadcrumbs ? [
2667
+ {
2668
+ label: t2("templates.headerVariations.breadcrumbBrand"),
2669
+ href: "#",
2670
+ icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Home, { className: "w-4 h-4" })
2671
+ },
2672
+ { label: t2("templates.headerVariations.breadcrumbSettings"), href: "#" },
2673
+ { label: t2("templates.headerVariations.breadcrumbProfile") }
2674
+ ] : void 0,
2675
+ actions: showHeaderActions ? [
2676
+ {
2677
+ id: "notify",
2678
+ icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { className: "w-5 h-5" }),
2679
+ onClick: () => sonner.toast(t2("templates.headerVariations.notificationsOpenedToast"))
2680
+ },
2681
+ {
2682
+ id: "mail",
2683
+ label: t2("templates.headerVariations.messagesLabel"),
2684
+ icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "w-5 h-5" }),
2685
+ onClick: () => sonner.toast(t2("templates.headerVariations.messagesOpenedToast"))
2686
+ }
2687
+ ] : void 0
2688
+ }
2689
+ ),
2690
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-32 flex items-center justify-center text-muted-foreground text-sm italic", children: t2("templates.headerVariations.contentArea") })
2691
+ ] })
2692
+ ] })
2693
+ ] })
2694
+ ] }),
2695
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2696
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
2697
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4", children: t2("templates.sections.sidebarVariations") }),
2698
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { children: [
2699
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2700
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.sidebar.title") }),
2701
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.sidebar.description") })
2702
+ ] }),
2703
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.Tabs, { defaultValue: "assistant", className: "w-full", children: [
2704
+ /* @__PURE__ */ jsxRuntime.jsxs(alertDialog.TabsList, { className: "mb-4", children: [
2705
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "assistant", children: t2("templates.sidebar.assistantMode") }),
2706
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsTrigger, { value: "default", children: t2("templates.sidebar.defaultMode") })
2707
+ ] }),
2708
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-6 p-4 border rounded-[var(--radius-lg)] bg-muted/30", children: [
2709
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold mb-4", children: t2("templates.sidebarControls.footerSettings") }),
2710
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-6 mt-2", children: [
2711
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2712
+ /* @__PURE__ */ jsxRuntime.jsx(
2713
+ alertDialog.Switch,
2714
+ {
2715
+ id: "show-user",
2716
+ checked: showSidebarUser,
2717
+ onCheckedChange: setShowSidebarUser
2718
+ }
2719
+ ),
2720
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "show-user", className: "cursor-pointer", children: t2("templates.sidebarControls.userProfile") })
2721
+ ] }),
2722
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2723
+ /* @__PURE__ */ jsxRuntime.jsx(
2724
+ alertDialog.Switch,
2725
+ {
2726
+ id: "show-settings",
2727
+ checked: showSidebarSettings,
2728
+ onCheckedChange: setShowSidebarSettings
2729
+ }
2730
+ ),
2731
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "show-settings", className: "cursor-pointer", children: t2("templates.sidebarControls.settings") })
2732
+ ] }),
2733
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
2734
+ /* @__PURE__ */ jsxRuntime.jsx(
2735
+ alertDialog.Switch,
2736
+ {
2737
+ id: "show-logout",
2738
+ checked: showSidebarLogout,
2739
+ onCheckedChange: setShowSidebarLogout
2740
+ }
2741
+ ),
2742
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Label, { htmlFor: "show-logout", className: "cursor-pointer", children: t2("templates.sidebarControls.logoutButton") })
2743
+ ] })
2744
+ ] }),
2745
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 pt-6 border-t", children: [
2746
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
2747
+ /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-semibold", children: t2("templates.sidebarControls.sidebarWidthDesktop") }),
2748
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs font-mono bg-muted px-2 py-1 rounded", children: [
2749
+ sidebarWidth,
2750
+ "px"
2751
+ ] })
2752
+ ] }),
2753
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
2754
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground w-12 text-right", children: "240px" }),
2755
+ /* @__PURE__ */ jsxRuntime.jsx(
2756
+ slider.Slider,
2757
+ {
2758
+ value: [sidebarWidth],
2759
+ onValueChange: (val) => setSidebarWidth(val[0]),
2760
+ min: 240,
2761
+ max: 450,
2762
+ step: 10,
2763
+ className: "flex-1",
2764
+ "aria-label": t2("templates.sidebarControls.sidebarWidthAriaLabel")
2765
+ }
2766
+ ),
2767
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground w-12", children: "450px" })
2768
+ ] })
2769
+ ] })
2770
+ ] }),
2771
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "assistant", children: /* @__PURE__ */ jsxRuntime.jsxs(
2772
+ "div",
2773
+ {
2774
+ className: "relative h-[600px] border rounded-[var(--radius-lg)] bg-muted/20 overflow-hidden",
2775
+ style: { transform: "translateZ(0)" },
2776
+ children: [
2777
+ /* @__PURE__ */ jsxRuntime.jsx(
2778
+ sidebar.Sidebar,
2779
+ {
2780
+ expanded: true,
2781
+ width: sidebarWidth,
2782
+ onToggle: () => {
2783
+ },
2784
+ user: { email: "admin@xertica.com" },
2785
+ onLogout: () => sonner.toast(t2("templates.sidebar.logoutToast")),
2786
+ location: { pathname: "/assistant/current" },
2787
+ navigate: () => {
2788
+ },
2789
+ variant: "assistant",
2790
+ search: {
2791
+ show: true,
2792
+ placeholder: t2("templates.sidebar.searchTopicsPlaceholder"),
2793
+ filter: {
2794
+ show: true,
2795
+ content: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2 space-y-2", children: [
2796
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-semibold uppercase text-muted-foreground px-2", children: t2("templates.sidebarControls.filterByStatus") }),
2797
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2 p-1", children: [
2798
+ /* @__PURE__ */ jsxRuntime.jsx(progress.Badge, { className: "bg-sidebar-foreground/20 text-sidebar-foreground border-none cursor-pointer hover:bg-sidebar-foreground/30", children: t2("templates.sidebarControls.filterActive") }),
2799
+ /* @__PURE__ */ jsxRuntime.jsx(
2800
+ progress.Badge,
2801
+ {
2802
+ variant: "outline",
2803
+ className: "text-sidebar-foreground/70 border-sidebar-foreground/20 cursor-pointer hover:bg-sidebar-foreground/10",
2804
+ children: t2("templates.sidebarControls.filterArchived")
2805
+ }
2806
+ ),
2807
+ /* @__PURE__ */ jsxRuntime.jsx(
2808
+ progress.Badge,
2809
+ {
2810
+ variant: "outline",
2811
+ className: "text-sidebar-foreground/70 border-sidebar-foreground/20 cursor-pointer hover:bg-sidebar-foreground/10",
2812
+ children: t2("templates.sidebarControls.filterPending")
2813
+ }
2814
+ )
2815
+ ] })
2816
+ ] })
2817
+ }
2818
+ },
2819
+ fixedArea: {
2820
+ show: true,
2821
+ content: /* @__PURE__ */ jsxRuntime.jsxs(button.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: [
2822
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "w-4 h-4 mr-2" }),
2823
+ t2("templates.sidebar.newConversation")
2824
+ ] })
2825
+ },
2826
+ navigationGroups: [
2827
+ {
2828
+ id: "recent",
2829
+ label: t2("templates.sidebar.recent"),
2830
+ icon: lucideReact.Clock,
2831
+ items: [
2832
+ {
2833
+ path: "/assistant/refatoracao",
2834
+ label: t2("templates.sidebar.items.sidebarRefactor"),
2835
+ description: t2("templates.sidebar.items.sidebarRefactorDescription"),
2836
+ actions: [
2837
+ {
2838
+ label: t2("templates.sidebar.actions.rename"),
2839
+ icon: lucideReact.FileEdit,
2840
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.renameToast"))
2841
+ },
2842
+ {
2843
+ label: t2("templates.sidebar.actions.move"),
2844
+ icon: lucideReact.ArrowRightLeft,
2845
+ children: [
2846
+ {
2847
+ label: t2("templates.sidebar.actions.moveActive"),
2848
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.moveActiveToast"))
2849
+ },
2850
+ {
2851
+ label: t2("templates.sidebar.actions.moveMonitoring"),
2852
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.moveMonitoringToast"))
2853
+ },
2854
+ {
2855
+ label: t2("templates.sidebar.actions.moveArchive"),
2856
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.moveArchiveToast"))
2857
+ }
2858
+ ]
2859
+ },
2860
+ {
2861
+ label: t2("templates.sidebar.actions.clear"),
2862
+ icon: lucideReact.Trash2,
2863
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.clearToast")),
2864
+ variant: "destructive"
2865
+ }
2866
+ ]
2867
+ }
2868
+ ]
2869
+ },
2870
+ {
2871
+ id: "projects",
2872
+ label: t2("templates.sidebar.constructionMonitoring"),
2873
+ icon: lucideReact.Map,
2874
+ actions: [
2875
+ {
2876
+ label: t2("templates.sidebar.actions.newCategory"),
2877
+ icon: lucideReact.Plus,
2878
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.newCategoryToast"))
2879
+ },
2880
+ {
2881
+ label: t2("templates.sidebar.actions.archiveGroup"),
2882
+ icon: lucideReact.Archive,
2883
+ onClick: () => sonner.toast(t2("templates.sidebar.actions.archiveGroupToast"))
2884
+ }
2885
+ ],
2886
+ items: [
2887
+ {
2888
+ path: "/assistant/br163",
2889
+ label: t2("templates.sidebar.items.br163Restoration"),
2890
+ icon: () => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full bg-yellow-500" }),
2891
+ description: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5 min-w-[160px]", children: [
2892
+ /* @__PURE__ */ jsxRuntime.jsx(
2893
+ progress.Progress,
2894
+ {
2895
+ value: 67,
2896
+ className: "h-1.5 bg-sidebar-foreground/10"
2897
+ }
2898
+ ),
2899
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center text-[10px] text-sidebar-foreground/60", children: [
2900
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("templates.sidebar.items.br163Location") }),
2901
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "67%" })
2902
+ ] })
2903
+ ] })
2904
+ }
2905
+ ]
2906
+ }
2907
+ ],
2908
+ footer: {
2909
+ showUser: showSidebarUser,
2910
+ showSettings: showSidebarSettings,
2911
+ showLogout: showSidebarLogout
2912
+ }
2913
+ }
2914
+ ),
2915
+ /* @__PURE__ */ jsxRuntime.jsx(
2916
+ "div",
2917
+ {
2918
+ className: "absolute inset-y-0 right-0 p-8 flex items-center justify-center transition-all duration-300",
2919
+ style: { left: `${sidebarWidth}px` },
2920
+ children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-center", children: t2("templates.sidebar.assistantContent") })
2921
+ }
2922
+ )
2923
+ ]
2924
+ }
2925
+ ) }),
2926
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.TabsContent, { value: "default", children: /* @__PURE__ */ jsxRuntime.jsxs(
2927
+ "div",
2928
+ {
2929
+ className: "relative h-[600px] border rounded-[var(--radius-lg)] bg-muted/20 overflow-hidden",
2930
+ style: { transform: "translateZ(0)" },
2931
+ children: [
2932
+ /* @__PURE__ */ jsxRuntime.jsx(
2933
+ sidebar.Sidebar,
2934
+ {
2935
+ expanded: true,
2936
+ width: sidebarWidth,
2937
+ onToggle: () => {
2938
+ },
2939
+ user: {
2940
+ name: "Ariel Santos",
2941
+ email: "admin@xertica.com",
2942
+ avatar: "https://github.com/shadcn.png"
2943
+ },
2944
+ onLogout: () => sonner.toast(t2("templates.sidebar.logoutToast")),
2945
+ onSettingsClick: () => sonner.toast(t2("templates.sidebar.settingsClickedToast")),
2946
+ location: { pathname: "/home" },
2947
+ navigate: () => {
2948
+ },
2949
+ variant: "default",
2950
+ routes: [
2951
+ { path: "/home", label: t2("templates.sidebar.routes.home"), icon: lucideReact.Home },
2952
+ { path: "/dashboard", label: t2("templates.sidebar.routes.dashboard"), icon: lucideReact.Users },
2953
+ { path: "/settings", label: t2("templates.sidebar.routes.settings"), icon: lucideReact.Settings }
2954
+ ],
2955
+ footer: {
2956
+ showUser: showSidebarUser,
2957
+ showSettings: showSidebarSettings,
2958
+ showLogout: showSidebarLogout
2959
+ }
2960
+ }
2961
+ ),
2962
+ /* @__PURE__ */ jsxRuntime.jsx(
2963
+ "div",
2964
+ {
2965
+ className: "absolute inset-y-0 right-0 p-8 flex items-center justify-center transition-all duration-300",
2966
+ style: { left: `${sidebarWidth}px` },
2967
+ children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-center", children: t2("templates.sidebar.defaultContent") })
2968
+ }
2969
+ )
2970
+ ]
2971
+ }
2972
+ ) })
2973
+ ] }) })
2974
+ ] })
2975
+ ] }),
2976
+ /* @__PURE__ */ jsxRuntime.jsx(alertDialog.Separator, { className: "my-8" }),
2977
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { className: "mt-8", children: [
2978
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
2979
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: t2("templates.footer.title") }),
2980
+ /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: t2("templates.footer.subtitle") })
2981
+ ] }),
2982
+ /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardContent, { className: "space-y-4", children: [
2983
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-muted-foreground", children: [
2984
+ t2("templates.footer.descriptionPart1"),
2985
+ /* @__PURE__ */ jsxRuntime.jsx("code", { className: "bg-muted px-2 py-1 rounded-[var(--radius-sm)] [font-size:var(--text-small)]", children: "xertica-ui" }),
2986
+ t2("templates.footer.descriptionPart2")
2987
+ ] }),
2988
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.Alert, { variant: "info", children: [
2989
+ /* @__PURE__ */ jsxRuntime.jsx(richTextEditor.AlertTitle, { children: t2("templates.footer.tipTitle") }),
2990
+ /* @__PURE__ */ jsxRuntime.jsxs(richTextEditor.AlertDescription, { children: [
2991
+ t2("templates.footer.tipDescriptionPart1"),
2992
+ /* @__PURE__ */ jsxRuntime.jsx("code", { className: "bg-muted px-1 rounded", children: "styles/xertica/tokens.css" }),
2993
+ t2("templates.footer.tipDescriptionPart2")
2994
+ ] })
2995
+ ] })
2996
+ ] })
2997
+ ] })
2998
+ ] }) }) }) })
2999
+ ]
3000
+ }
3001
+ );
3002
+ }
3003
+ function TemplatePage() {
3004
+ const { user, logout } = useAuth();
3005
+ const layout = LayoutContext.useOptionalLayout();
3006
+ const [localSidebarExpanded, setLocalSidebarExpanded] = React.useState(false);
3007
+ const [localAssistantExpanded, setLocalAssistantExpanded] = React.useState(false);
3008
+ const sidebarExpanded = (layout == null ? void 0 : layout.sidebarExpanded) ?? localSidebarExpanded;
3009
+ const sidebarWidth = (layout == null ? void 0 : layout.sidebarWidth) ?? 280;
3010
+ const assistenteExpanded = (layout == null ? void 0 : layout.assistenteExpanded) ?? localAssistantExpanded;
3011
+ const toggleSidebar = (layout == null ? void 0 : layout.toggleSidebar) ?? (() => setLocalSidebarExpanded((value) => !value));
3012
+ const toggleAssistente = (layout == null ? void 0 : layout.toggleAssistente) ?? (() => setLocalAssistantExpanded((value) => !value));
3013
+ const location = reactRouterDom.useLocation();
3014
+ const navigate = reactRouterDom.useNavigate();
3015
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-screen flex bg-muted overflow-hidden relative", children: [
3016
+ /* @__PURE__ */ jsxRuntime.jsx(
3017
+ sidebar.Sidebar,
3018
+ {
3019
+ expanded: sidebarExpanded,
3020
+ width: sidebarWidth,
3021
+ onToggle: toggleSidebar,
3022
+ user: {
3023
+ ...user,
3024
+ name: "Ariel Santos",
3025
+ avatar: "https://github.com/shadcn.png"
3026
+ },
3027
+ onLogout: logout,
3028
+ onSettingsClick: () => navigate("/settings"),
3029
+ location,
3030
+ navigate,
3031
+ routes
3032
+ }
3033
+ ),
3034
+ /* @__PURE__ */ jsxRuntime.jsx(TemplateContent, {}),
3035
+ /* @__PURE__ */ jsxRuntime.jsx(
3036
+ xerticaAssistant.XerticaAssistant,
3037
+ {
3038
+ isExpanded: assistenteExpanded,
3039
+ onToggle: toggleAssistente,
3040
+ onEvaluation: () => {
3041
+ }
3042
+ }
3043
+ )
3044
+ ] });
3045
+ }
3046
+ function VerifyEmailPage() {
3047
+ var _a;
3048
+ const navigate = reactRouterDom.useNavigate();
3049
+ const location = reactRouterDom.useLocation();
3050
+ const { t: t2 } = reactI18next.useTranslation();
3051
+ const email = ((_a = location.state) == null ? void 0 : _a.email) || "your@email.com";
3052
+ const [isResending, setIsResending] = React.useState(false);
3053
+ const [resendSuccess, setResendSuccess] = React.useState(false);
3054
+ const handleResend = async () => {
3055
+ setIsResending(true);
3056
+ setResendSuccess(false);
3057
+ await new Promise((resolve) => setTimeout(resolve, 1500));
3058
+ setIsResending(false);
3059
+ setResendSuccess(true);
3060
+ setTimeout(() => setResendSuccess(false), 3e3);
3061
+ };
3062
+ const handleSocialLogin = (_provider) => {
3063
+ };
3064
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-h-screen flex", children: [
3065
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex lg:flex-1 relative overflow-hidden", children: [
3066
+ /* @__PURE__ */ jsxRuntime.jsx(
3067
+ alertDialog.ImageWithFallback,
3068
+ {
3069
+ src: "https://images.unsplash.com/photo-1563986768609-322da13575f3?w=1200&h=800&fit=crop&auto=format",
3070
+ alt: t2("verifyEmail.heroImageAlt"),
3071
+ className: "absolute inset-0 w-full h-full object-cover"
3072
+ }
3073
+ ),
3074
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-[image:var(--gradient-diagonal)] opacity-80" })
3075
+ ] }),
3076
+ /* @__PURE__ */ jsxRuntime.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: [
3077
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-20", children: /* @__PURE__ */ jsxRuntime.jsx(XerticaXLogo.LanguageSelector, { variant: "minimal", showIcon: false }) }),
3078
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 lg:hidden bg-[image:var(--gradient-diagonal)] opacity-10 dark:opacity-5" }),
3079
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-sm space-y-6 relative z-10", children: [
3080
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
3081
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
3082
+ XerticaXLogo.XerticaLogo,
3083
+ {
3084
+ className: "h-12 w-auto text-primary dark:text-foreground",
3085
+ variant: "theme"
3086
+ }
3087
+ ) }),
3088
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center mb-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4 bg-primary/10 rounded-[var(--radius)]", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mail, { className: "w-12 h-12 text-primary" }) }) }),
3089
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm text-muted-foreground", children: t2("verifyEmail.heading") }),
3090
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-muted-foreground", children: t2("verifyEmail.instructionsSent") }),
3091
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-primary", children: email })
3092
+ ] }),
3093
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-accent rounded-[var(--radius)] p-4 space-y-3", children: [
3094
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: t2("verifyEmail.instructions") }),
3095
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2 text-muted-foreground", children: [
3096
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "w-4 h-4 mt-0.5 flex-shrink-0 text-[var(--chart-2)]" }),
3097
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: t2("verifyEmail.checkSpam") })
3098
+ ] })
3099
+ ] }),
3100
+ resendSuccess && /* @__PURE__ */ jsxRuntime.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: [
3101
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "w-5 h-5 text-[var(--chart-2)] flex-shrink-0" }),
3102
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-[var(--chart-2)]", children: t2("verifyEmail.resentSuccess") })
3103
+ ] }),
3104
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
3105
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-muted-foreground", children: t2("verifyEmail.notReceived") }),
3106
+ /* @__PURE__ */ jsxRuntime.jsx(
3107
+ button.Button,
3108
+ {
3109
+ variant: "outline",
3110
+ className: "w-full",
3111
+ onClick: handleResend,
3112
+ disabled: isResending,
3113
+ children: isResending ? t2("verifyEmail.resending") : t2("verifyEmail.resend")
3114
+ }
3115
+ ),
3116
+ /* @__PURE__ */ jsxRuntime.jsxs(
3117
+ button.Button,
3118
+ {
3119
+ type: "button",
3120
+ onClick: () => navigate("/login"),
3121
+ variant: "outline",
3122
+ className: "w-full text-muted-foreground hover:text-foreground",
3123
+ children: [
3124
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "w-4 h-4 mr-2" }),
3125
+ t2("verifyEmail.backToLogin")
3126
+ ]
3127
+ }
3128
+ )
3129
+ ] }),
3130
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
3131
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full border-t border-border" }) }),
3132
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex justify-center text-sm", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-muted px-2 text-muted-foreground", children: t2("login.orContinueWith") }) })
3133
+ ] }),
3134
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
3135
+ /* @__PURE__ */ jsxRuntime.jsxs(
3136
+ button.Button,
3137
+ {
3138
+ type: "button",
3139
+ variant: "outline",
3140
+ className: "w-full justify-center",
3141
+ onClick: () => handleSocialLogin(),
3142
+ children: [
3143
+ /* @__PURE__ */ jsxRuntime.jsxs("svg", { className: "w-5 h-5 mr-2", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", children: [
3144
+ /* @__PURE__ */ jsxRuntime.jsx(
3145
+ "path",
3146
+ {
3147
+ fill: "#EA4335",
3148
+ 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"
3149
+ }
3150
+ ),
3151
+ /* @__PURE__ */ jsxRuntime.jsx(
3152
+ "path",
3153
+ {
3154
+ fill: "#4285F4",
3155
+ 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"
3156
+ }
3157
+ ),
3158
+ /* @__PURE__ */ jsxRuntime.jsx(
3159
+ "path",
3160
+ {
3161
+ fill: "#FBBC05",
3162
+ 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"
3163
+ }
3164
+ ),
3165
+ /* @__PURE__ */ jsxRuntime.jsx(
3166
+ "path",
3167
+ {
3168
+ fill: "#34A853",
3169
+ 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"
3170
+ }
3171
+ ),
3172
+ /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "none", d: "M0 0h48v48H0z" })
3173
+ ] }),
3174
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithGoogle") })
3175
+ ]
3176
+ }
3177
+ ),
3178
+ /* @__PURE__ */ jsxRuntime.jsxs(
3179
+ button.Button,
3180
+ {
3181
+ type: "button",
3182
+ variant: "outline",
3183
+ className: "w-full justify-center",
3184
+ onClick: () => handleSocialLogin(),
3185
+ children: [
3186
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { className: "w-5 h-5 mr-2 text-[var(--chart-4)]" }),
3187
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithMTLogin") })
3188
+ ]
3189
+ }
3190
+ ),
3191
+ /* @__PURE__ */ jsxRuntime.jsx(
3192
+ button.Button,
3193
+ {
3194
+ type: "button",
3195
+ variant: "outline",
3196
+ className: "w-full justify-center font-normal",
3197
+ onClick: () => handleSocialLogin(),
3198
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: t2("login.signInWithGovBr") })
3199
+ }
3200
+ )
3201
+ ] })
3202
+ ] })
3203
+ ] })
3204
+ ] });
3205
+ }
3206
+ exports.ForgotPasswordPage = ForgotPasswordPage;
3207
+ exports.HomeContent = HomeContent;
3208
+ exports.HomePage = HomePage;
3209
+ exports.LoginPage = LoginPage;
3210
+ exports.ResetPasswordPage = ResetPasswordPage;
3211
+ exports.TemplateContent = TemplateContent;
3212
+ exports.TemplatePage = TemplatePage;
3213
+ exports.VerifyEmailPage = VerifyEmailPage;