xertica-ui 2.9.7 → 2.9.9

package/dist/XerticaProvider-Ck996htf.cjs

@@ -0,0 +1,47 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const AssistenteContext = require('./AssistenteContext-CLK8tgdt.cjs');
+const BrandColorsContext = require('./BrandColorsContext-SeOZd2Cq.cjs');
+const LanguageContext = require('./LanguageContext-ubC7TSs_.cjs');
+const LayoutContext = require('./LayoutContext-BEq_-n98.cjs');
+const ThemeContext = require('./ThemeContext-CEY9pCn-.cjs');
+const googleMapsLoader = require('./google-maps-loader-DfeBRI8Q.cjs');
+const sonner = require('./sonner-B-jWlik1.cjs');
+const tooltip = require('./tooltip-CIKRzQqE.cjs');
+
+function XerticaProvider({
+  children,
+  apiKey,
+  googleMapsApiKey,
+  defaultBrandTheme,
+  defaultColorTheme,
+  primaryColor,
+  useCustomTokens,
+  disableDarkMode,
+  availableLanguages,
+  defaultLanguage
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.ThemeProvider, { disableDarkMode, children: /* @__PURE__ */ jsxRuntime.jsx(
+    BrandColorsContext.BrandColorsProvider,
+    {
+      defaultTheme: defaultColorTheme || defaultBrandTheme,
+      primaryColor,
+      useCustomTokens,
+      children: /* @__PURE__ */ jsxRuntime.jsx(LanguageContext.LanguageProvider, { availableLanguages, defaultLanguage, children: /* @__PURE__ */ jsxRuntime.jsx(
+        AssistenteContext.ApiKeyProvider,
+        {
+          initialApiKey: apiKey,
+          initialGeminiApiKey: apiKey,
+          initialGoogleMapsApiKey: googleMapsApiKey,
+          children: /* @__PURE__ */ jsxRuntime.jsx(googleMapsLoader.GoogleMapsLoaderProvider, { apiKey: googleMapsApiKey, children: /* @__PURE__ */ jsxRuntime.jsx(AssistenteContext.AssistenteProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(LayoutContext.LayoutProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.TooltipProvider, { children: [
+            children,
+            /* @__PURE__ */ jsxRuntime.jsx(sonner.Toaster, { position: "top-right", richColors: true })
+          ] }) }) }) })
+        }
+      ) })
+    }
+  ) });
+}
+
+exports.XerticaProvider = XerticaProvider;

package/dist/XerticaProvider-kE5l0MQn.js

@@ -0,0 +1,45 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { A as ApiKeyProvider, a as AssistenteProvider } from './AssistenteContext-Bm8_RJTB.js';
+import { B as BrandColorsProvider } from './BrandColorsContext-D3Y0CYZF.js';
+import { L as LanguageProvider } from './LanguageContext-B1aOXO-K.js';
+import { L as LayoutProvider } from './LayoutContext-DNl1xSoX.js';
+import { T as ThemeProvider } from './ThemeContext-Dk3tH7Ym.js';
+import { b as GoogleMapsLoaderProvider } from './google-maps-loader-BOug999f.js';
+import { T as Toaster } from './sonner-C9tiqj4f.js';
+import { b as TooltipProvider } from './tooltip-_MAwsiOL.js';
+
+function XerticaProvider({
+  children,
+  apiKey,
+  googleMapsApiKey,
+  defaultBrandTheme,
+  defaultColorTheme,
+  primaryColor,
+  useCustomTokens,
+  disableDarkMode,
+  availableLanguages,
+  defaultLanguage
+}) {
+  return /* @__PURE__ */ jsx(ThemeProvider, { disableDarkMode, children: /* @__PURE__ */ jsx(
+    BrandColorsProvider,
+    {
+      defaultTheme: defaultColorTheme || defaultBrandTheme,
+      primaryColor,
+      useCustomTokens,
+      children: /* @__PURE__ */ jsx(LanguageProvider, { availableLanguages, defaultLanguage, children: /* @__PURE__ */ jsx(
+        ApiKeyProvider,
+        {
+          initialApiKey: apiKey,
+          initialGeminiApiKey: apiKey,
+          initialGoogleMapsApiKey: googleMapsApiKey,
+          children: /* @__PURE__ */ jsx(GoogleMapsLoaderProvider, { apiKey: googleMapsApiKey, children: /* @__PURE__ */ jsx(AssistenteProvider, { children: /* @__PURE__ */ jsx(LayoutProvider, { children: /* @__PURE__ */ jsxs(TooltipProvider, { children: [
+            children,
+            /* @__PURE__ */ jsx(Toaster, { position: "top-right", richColors: true })
+          ] }) }) }) })
+        }
+      ) })
+    }
+  ) });
+}
+
+export { XerticaProvider as X };

package/dist/brand.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const XerticaProvider = require('./XerticaProvider-b3n_oL8w.cjs');
+const XerticaProvider = require('./XerticaProvider-Ck996htf.cjs');
 const jsxRuntime = require('react/jsx-runtime');
 const button = require('./button-BMDlWZR8.cjs');
 const IsotypeTwist = require('./IsotypeTwist-DvsUgZs_.cjs');

package/dist/brand.es.js

@@ -1,4 +1,4 @@
-export { X as XerticaProvider } from './XerticaProvider-Bi5lKC9N.js';
+export { X as XerticaProvider } from './XerticaProvider-kE5l0MQn.js';
 import { jsx } from 'react/jsx-runtime';
 import { c as cn } from './button-B05czY_8.js';
 import { I as ISOTYPE_PATTERNS, g as getIsotypeVariant, a as ISOTYPE_COLORS, m as mulberry32 } from './IsotypeTwist-BTdNL4iV.js';

package/dist/cli.js

@@ -901,19 +901,24 @@ export default function App() {
 }
 function generateLandingAppTsx(selectedCodes, disableDarkMode = false) {
   const disableDarkModeProp = disableDarkMode ? `
-      disableDarkMode={true}` : "";
-  const availableLanguagesProp = buildAvailableLanguagesProp(selectedCodes, "      ");
+        disableDarkMode={true}` : "";
+  const availableLanguagesProp = buildAvailableLanguagesProp(selectedCodes, "        ");
   return `import React from 'react';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { XerticaProvider } from 'xertica-ui/brand';
 import { LandingPage } from '../pages/LandingPage';
 
+const queryClient = new QueryClient();
+
 export default function App() {
   return (
-    <XerticaProvider
-      useCustomTokens={true}${availableLanguagesProp}${disableDarkModeProp}
-    >
-      <LandingPage />
-    </XerticaProvider>
+    <QueryClientProvider client={queryClient}>
+      <XerticaProvider
+        useCustomTokens={true}${availableLanguagesProp}${disableDarkModeProp}
+      >
+        <LandingPage />
+      </XerticaProvider>
+    </QueryClientProvider>
   );
 }
 `;

package/dist/components/pages/forgot-password-page/ForgotPasswordPage.d.ts

@@ -4,11 +4,12 @@ import React from 'react';
  *
  * @description
  * A screen that allows users to request a password reset link via email.
- * Includes the shared brand isotype side-panel (desktop) and alternative
- * social login options similar to the main Login page.
+ * Includes a side-panel (desktop) and alternative social login options
+ * similar to the main Login page.
  *
  * @ai-rules
  * 1. Navigation: Successfully submitting the email triggers a navigation to `/verify-email`.
- * 2. Visuals: Keeps consistency with `LoginPage` in terms of layout and branding.
+ * 2. Visuals: Keeps consistency with `LoginPage` in terms of layout and branding, including
+ *    the theme-conditional isotype/hero-image left panel.
  */
 export declare function ForgotPasswordPage(): React.JSX.Element;

package/dist/components/pages/login-page/LoginPage.d.ts

@@ -13,13 +13,14 @@ interface LoginPageProps {
  * Standard Login Page component.
  *
  * @description
- * A complete, responsive login screen featuring a brand isotype side-panel (on desktop)
- * and a focused authentication form. Supports email/password login and placeholders
+ * A complete, responsive login screen featuring a side-panel (on desktop) and a
+ * focused authentication form. Supports email/password login and placeholders
  * for Social/SSO providers (Google, MT Login, gov.br).
  *
  * @ai-rules
  * 1. State Management: You must provide the `onLogin` callback to handle the actual authentication logic.
- * 2. Visuals: Left panel renders `IsotypeTwist` via `AuthPageShell`'s `leftPanel="isotype"` — no hero image on this page.
+ * 2. Visuals: Left panel renders the brand isotype only when the `xertica` theme is active
+ *    (`AuthPageShell`'s `leftPanel="isotype"`); every other theme shows the original hero image.
  * 3. Routing: Uses `react-router` for navigation to the forgot-password flow.
  */
 export declare function LoginPage({ onLogin }: LoginPageProps): React.JSX.Element;

package/dist/components/pages/verify-email-page/VerifyEmailPage.d.ts

@@ -5,7 +5,8 @@ import React from 'react';
  * @description
  * An informative screen shown after a password reset request. It instructs
  * the user to check their email and provides a "Resend email" feature.
- * Includes the same consistent layout with the shared brand isotype side-panel.
+ * Includes the same consistent layout as the other auth pages, including the
+ * theme-conditional isotype/hero-image left panel.
  *
  * @ai-rules
  * 1. Data Source: It retrieves the email from the router's `location.state`.

package/dist/hooks.cjs.js

@@ -5,7 +5,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const LayoutContext = require('./LayoutContext-BEq_-n98.cjs');
 const ThemeContext = require('./ThemeContext-CEY9pCn-.cjs');
 const LanguageContext = require('./LanguageContext-ubC7TSs_.cjs');
-const BrandColorsContext = require('./BrandColorsContext-Ug_TZ8yn.cjs');
+const BrandColorsContext = require('./BrandColorsContext-SeOZd2Cq.cjs');
+const AssistenteContext = require('./AssistenteContext-CLK8tgdt.cjs');
 const useMobile = require('./use-mobile-BdXTRb0Z.cjs');
 const React = require('react');
 const useAudioPlayer = require('./use-audio-player-DGvhPrgR.cjs');
@@ -34,12 +35,12 @@ exports.useTheme = ThemeContext.useTheme;
 exports.DEFAULT_LANGUAGES = LanguageContext.DEFAULT_LANGUAGES;
 exports.LanguageProvider = LanguageContext.LanguageProvider;
 exports.useLanguage = LanguageContext.useLanguage;
-exports.ApiKeyProvider = BrandColorsContext.ApiKeyProvider;
-exports.AssistenteProvider = BrandColorsContext.AssistenteProvider;
 exports.BrandColorsProvider = BrandColorsContext.BrandColorsProvider;
-exports.useApiKey = BrandColorsContext.useApiKey;
-exports.useAssistente = BrandColorsContext.useAssistente;
 exports.useBrandColors = BrandColorsContext.useBrandColors;
+exports.ApiKeyProvider = AssistenteContext.ApiKeyProvider;
+exports.AssistenteProvider = AssistenteContext.AssistenteProvider;
+exports.useApiKey = AssistenteContext.useApiKey;
+exports.useAssistente = AssistenteContext.useAssistente;
 exports.useIsMobile = useMobile.useIsMobile;
 exports.useMobile = useMobile.useMobile;
 exports.useAudioPlayer = useAudioPlayer.useAudioPlayer;

package/dist/hooks.es.js

@@ -2,7 +2,8 @@ import { u as useLayout } from './LayoutContext-DNl1xSoX.js';
 export { L as LayoutProvider, a as useOptionalLayout } from './LayoutContext-DNl1xSoX.js';
 export { T as ThemeProvider, u as useTheme } from './ThemeContext-Dk3tH7Ym.js';
 export { D as DEFAULT_LANGUAGES, L as LanguageProvider, u as useLanguage } from './LanguageContext-B1aOXO-K.js';
-export { A as ApiKeyProvider, a as AssistenteProvider, B as BrandColorsProvider, u as useApiKey, b as useAssistente, c as useBrandColors } from './BrandColorsContext-z0O2LlZz.js';
+export { B as BrandColorsProvider, u as useBrandColors } from './BrandColorsContext-D3Y0CYZF.js';
+export { A as ApiKeyProvider, a as AssistenteProvider, u as useApiKey, b as useAssistente } from './AssistenteContext-Bm8_RJTB.js';
 export { u as useIsMobile, a as useMobile } from './use-mobile-Ce2cBAQe.js';
 import { useEffect } from 'react';
 export { u as useAudioPlayer } from './use-audio-player-B78fd2ct.js';

package/dist/index.cjs.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const xerticaAssistant = require('./xertica-assistant-DdYS6WXT.cjs');
-const XerticaProvider = require('./XerticaProvider-b3n_oL8w.cjs');
-const VerifyEmailPage = require('./VerifyEmailPage-DGaX-jZv.cjs');
+const XerticaProvider = require('./XerticaProvider-Ck996htf.cjs');
+const VerifyEmailPage = require('./VerifyEmailPage-BInYcjRd.cjs');
 const button = require('./button-BMDlWZR8.cjs');
 const skeleton = require('./skeleton-D8WaauK0.cjs');
 const alertDialog = require('./alert-dialog-C48TOdYU.cjs');

package/dist/index.es.js

@@ -1,6 +1,6 @@
 export { F as FormattedDocument, M as MarkdownMessage, a as ModernChatInput, X as XerticaAssistant, g as generateDemoResponse, g as gerarResposta } from './xertica-assistant-B1xAl2Vn.js';
-export { X as XerticaProvider } from './XerticaProvider-Bi5lKC9N.js';
-export { F as ForgotPasswordPage, H as HomeContent, a as HomePage, L as LandingPage, b as LoginPage, R as ResetPasswordPage, T as TemplateContent, c as TemplatePage, V as VerifyEmailPage } from './VerifyEmailPage-90lK6pP4.js';
+export { X as XerticaProvider } from './XerticaProvider-kE5l0MQn.js';
+export { F as ForgotPasswordPage, H as HomeContent, a as HomePage, L as LandingPage, b as LoginPage, R as ResetPasswordPage, T as TemplateContent, c as TemplatePage, V as VerifyEmailPage } from './VerifyEmailPage-Z-cA_IIo.js';
 export { B as Button, b as buttonVariants, c as cn } from './button-B05czY_8.js';
 export { C as Card, a as CardAction, b as CardContent, c as CardDescription, d as CardFooter, e as CardHeader, f as CardTitle, S as Skeleton } from './skeleton-BtBwJ39W.js';
 export { A as AlertDialog, a as AlertDialogAction, b as AlertDialogCancel, c as AlertDialogContent, d as AlertDialogDescription, e as AlertDialogFooter, f as AlertDialogHeader, g as AlertDialogOverlay, h as AlertDialogPortal, i as AlertDialogTitle, j as AlertDialogTrigger, C as Checkbox, L as Label, M as Map, P as PageHeader, k as PageHeaderDescription, l as PageHeaderHeading, R as RadioGroup, m as RadioGroupItem, S as Separator, n as Switch, T as Tabs, o as TabsContent, p as TabsList, q as TabsTrigger, u as useMapLayers } from './alert-dialog-NjflitDa.js';

package/dist/pages.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const VerifyEmailPage = require('./VerifyEmailPage-DGaX-jZv.cjs');
+const VerifyEmailPage = require('./VerifyEmailPage-BInYcjRd.cjs');
 
 
 

package/dist/pages.es.js

@@ -1 +1 @@
-export { F as ForgotPasswordPage, H as HomeContent, a as HomePage, L as LandingPage, b as LoginPage, R as ResetPasswordPage, T as TemplateContent, c as TemplatePage, V as VerifyEmailPage } from './VerifyEmailPage-90lK6pP4.js';
+export { F as ForgotPasswordPage, H as HomeContent, a as HomePage, L as LandingPage, b as LoginPage, R as ResetPasswordPage, T as TemplateContent, c as TemplatePage, V as VerifyEmailPage } from './VerifyEmailPage-Z-cA_IIo.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xertica-ui",
-  "version": "2.9.7",
+  "version": "2.9.9",
   "description": "Xertica UI — Enterprise-grade React design system with Tailwind CSS v4, Radix UI, and AI-first documentation.",
   "type": "module",
   "main": "./dist/index.cjs.js",

package/templates/src/features/auth/ui/ForgotPasswordContent.tsx

@@ -5,10 +5,12 @@ import { ArrowLeft } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
 import { AuthPageShell, SocialLoginButtons } from 'xertica-ui/blocks';
 import { useTranslation } from 'react-i18next';
+import { useBrandColors } from 'xertica-ui/hooks';
 
 export function ForgotPasswordContent() {
   const navigate = useNavigate();
   const { t } = useTranslation();
+  const { currentTheme } = useBrandColors();
   const [email, setEmail] = useState('');
   const [isLoading, setIsLoading] = useState(false);
 
@@ -20,8 +22,8 @@ export function ForgotPasswordContent() {
     setIsLoading(false);
   };
 
-  return (
-    <AuthPageShell leftPanel="isotype">
+  const content = (
+    <>
       <div className="text-center">
         <div className="flex items-center justify-center mb-4">
           <XerticaLogo className="h-12 w-auto text-primary dark:text-foreground" variant="theme" />
@@ -61,6 +63,17 @@ export function ForgotPasswordContent() {
       </form>
 
       <SocialLoginButtons onSocialLogin={provider => console.log(`Login com ${provider}`)} />
+    </>
+  );
+
+  return currentTheme === 'xertica' ? (
+    <AuthPageShell leftPanel="isotype">{content}</AuthPageShell>
+  ) : (
+    <AuthPageShell
+      imageSrc="https://images.unsplash.com/photo-1557804506-669a67965ba0?w=1200&h=800&fit=crop&auto=format"
+      imageAlt={t('forgotPassword.heroImageAlt')}
+    >
+      {content}
     </AuthPageShell>
   );
 }

package/templates/src/features/auth/ui/LoginContent.tsx

@@ -4,6 +4,7 @@ import { XerticaLogo } from 'xertica-ui/brand';
 import { useNavigate } from 'react-router-dom';
 import { AuthPageShell, SocialLoginButtons } from 'xertica-ui/blocks';
 import { useTranslation } from 'react-i18next';
+import { useBrandColors } from 'xertica-ui/hooks';
 
 interface LoginContentProps {
   onLogin: (email: string, password: string) => boolean;
@@ -12,6 +13,7 @@ interface LoginContentProps {
 export function LoginContent({ onLogin }: LoginContentProps) {
   const navigate = useNavigate();
   const { t } = useTranslation();
+  const { currentTheme } = useBrandColors();
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
   const [isLoading, setIsLoading] = useState(false);
@@ -26,8 +28,8 @@ export function LoginContent({ onLogin }: LoginContentProps) {
     setIsLoading(false);
   };
 
-  return (
-    <AuthPageShell leftPanel="isotype">
+  const content = (
+    <>
       <div className="text-center">
         <div className="flex items-center justify-center mb-4">
           <XerticaLogo className="h-12 w-auto text-primary dark:text-foreground" variant="theme" />
@@ -83,6 +85,17 @@ export function LoginContent({ onLogin }: LoginContentProps) {
           onLogin('social@user.com', 'social-auth');
         }}
       />
+    </>
+  );
+
+  return currentTheme === 'xertica' ? (
+    <AuthPageShell leftPanel="isotype">{content}</AuthPageShell>
+  ) : (
+    <AuthPageShell
+      imageSrc="https://images.unsplash.com/photo-1551434678-e076c223a692?w=1200&h=800&fit=crop&auto=format"
+      imageAlt={t('login.heroImageAlt')}
+    >
+      {content}
     </AuthPageShell>
   );
 }

package/templates/src/features/auth/ui/ResetPasswordContent.tsx

@@ -5,10 +5,12 @@ import { AuthPageShell, usePasswordStrength, PasswordStrengthMeter } from 'xerti
 import { ArrowLeft, CheckCircle2, AlertCircle } from 'lucide-react';
 import { useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
+import { useBrandColors } from 'xertica-ui/hooks';
 
 export function ResetPasswordContent() {
   const navigate = useNavigate();
   const { t } = useTranslation();
+  const { currentTheme } = useBrandColors();
   const [password, setPassword] = useState('');
   const [confirmPassword, setConfirmPassword] = useState('');
   const [isLoading, setIsLoading] = useState(false);
@@ -37,8 +39,8 @@ export function ResetPasswordContent() {
     setIsLoading(false);
   };
 
-  return (
-    <AuthPageShell leftPanel="isotype">
+  const content = (
+    <>
       <button
         onClick={() => navigate('/login')}
         className="flex items-center gap-2 text-muted-foreground hover:text-foreground transition-colors"
@@ -121,6 +123,17 @@ export function ResetPasswordContent() {
           {isLoading ? t('resetPassword.submitting') : t('resetPassword.submit')}
         </Button>
       </form>
+    </>
+  );
+
+  return currentTheme === 'xertica' ? (
+    <AuthPageShell leftPanel="isotype">{content}</AuthPageShell>
+  ) : (
+    <AuthPageShell
+      imageSrc="https://images.unsplash.com/photo-1555949963-aa79dcee981c?w=1200&h=800&fit=crop&auto=format"
+      imageAlt={t('resetPassword.heroImageAlt')}
+    >
+      {content}
     </AuthPageShell>
   );
 }

package/templates/src/features/auth/ui/VerifyEmailContent.tsx

@@ -5,11 +5,13 @@ import { ArrowLeft, Mail, CheckCircle2 } from 'lucide-react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import { AuthPageShell, SocialLoginButtons } from 'xertica-ui/blocks';
 import { useTranslation } from 'react-i18next';
+import { useBrandColors } from 'xertica-ui/hooks';
 
 export function VerifyEmailContent() {
   const navigate = useNavigate();
   const location = useLocation();
   const { t } = useTranslation();
+  const { currentTheme } = useBrandColors();
   const email = location.state?.email || 'seu@email.com';
   const [isResending, setIsResending] = useState(false);
   const [resendSuccess, setResendSuccess] = useState(false);
@@ -23,8 +25,8 @@ export function VerifyEmailContent() {
     setTimeout(() => setResendSuccess(false), 3000);
   };
 
-  return (
-    <AuthPageShell leftPanel="isotype">
+  const content = (
+    <>
       <div className="text-center">
         <div className="flex items-center justify-center mb-4">
           <XerticaLogo className="h-12 w-auto text-primary dark:text-foreground" variant="theme" />
@@ -71,6 +73,17 @@ export function VerifyEmailContent() {
       </div>
 
       <SocialLoginButtons onSocialLogin={provider => console.log(`Login com ${provider}`)} />
+    </>
+  );
+
+  return currentTheme === 'xertica' ? (
+    <AuthPageShell leftPanel="isotype">{content}</AuthPageShell>
+  ) : (
+    <AuthPageShell
+      imageSrc="https://images.unsplash.com/photo-1563986768609-322da13575f3?w=1200&h=800&fit=crop&auto=format"
+      imageAlt={t('verifyEmail.heroImageAlt')}
+    >
+      {content}
     </AuthPageShell>
   );
 }

package/templates/src/styles/index.css

@@ -93,3 +93,8 @@
   /* Gradients */
   --image-gradient-diagonal: var(--gradient-diagonal);
 }
+
+/* Ensure the root element fills the screen height, allowing container-level scrolling */
+#root {
+  height: 100%;
+}

package/templates/tsconfig.node.json

@@ -6,6 +6,7 @@
     "moduleResolution": "bundler",
     "allowSyntheticDefaultImports": true,
     "strict": true,
+    "skipLibCheck": true,
     "composite": true
   },
   "include": ["vite.config.ts"]