@llmnative/react 2.0.1 → 2.2.0

package/dist/types/src/components/auth/useAuthFlows.d.ts

@@ -0,0 +1,46 @@
+import type { AuthProviderAdapter, UserProfile } from '../../providers/auth/AuthProvider';
+import type { SignInProps } from './SignIn';
+import type { SignUpProps } from './SignUp';
+import type { ForgotPasswordProps } from './ForgotPassword';
+import type { ResetPasswordProps } from './ResetPassword';
+import type { VerifyEmailProps } from './VerifyEmail';
+export interface AuthSession {
+    /** The signed-in user, `null` without a session. */
+    user: UserProfile | null;
+    /** `false` while the session of the last visit is being restored: show neither the page nor the sign-in. */
+    ready: boolean;
+    signOut: () => Promise<void>;
+    adapter: AuthProviderAdapter;
+}
+/** Who is signed in with an auth provider of the app, and whether it is known yet (CR-127). */
+export declare function useAuthSession(provider?: string): AuthSession;
+export interface AuthFlowsOptions {
+    /** The page the confirmation link of a new account opens (your `VerifyEmail`), e.g. `/verify-email`. */
+    verifyEmailPath?: string;
+    /** The page the link to choose a new password opens (your `ResetPassword`), e.g. `/reset-password`. */
+    resetPasswordPath?: string;
+}
+export interface AuthFlows {
+    adapter: AuthProviderAdapter;
+    /** For `<SignIn {...flows.signIn} />`: password, code by email, providers, as the adapter offers them. */
+    signIn: Pick<SignInProps, 'onPasswordSignIn' | 'onRequestCode' | 'onVerifyCode' | 'onProviderSignIn' | 'providers'>;
+    /** For `<SignUp {...flows.signUp} />`; `undefined` when the adapter cannot create accounts. */
+    signUp?: Pick<SignUpProps, 'onSignUp' | 'onResendVerification'>;
+    /** For `<ForgotPassword {...flows.forgotPassword} />`; `undefined` without password reset. */
+    forgotPassword?: Pick<ForgotPasswordProps, 'onSendReset'>;
+    /** For `<ResetPassword {...flows.resetPassword(code)} />`, with the code of the link. */
+    resetPassword: (code: string | null | undefined) => Pick<ResetPasswordProps, 'onResetPassword' | 'invalidLink'>;
+    /** For `<VerifyEmail {...flows.verifyEmail} code={…} />`. */
+    verifyEmail: Pick<VerifyEmailProps, 'onVerify' | 'onResend'>;
+}
+/**
+ * Binds the access screens to an auth provider of the app (CR-127): each screen gets the functions of
+ * the methods the adapter has. An adapter that can reset a password (Firebase, Supabase, mock) signs in
+ * with email and password; one that cannot (Google, GitHub, Dropbox) offers its own button.
+ */
+export declare function useAuthFlows(provider?: string, options?: AuthFlowsOptions): AuthFlows;
+/**
+ * The code of the link an email opened, whatever the service calls it: `oobCode` (Firebase),
+ * `token_hash` (Supabase), `code`.
+ */
+export declare function linkCode(search?: string | URLSearchParams): string | null;

package/dist/types/src/index.d.ts

@@ -13,6 +13,7 @@ export type { I18nDict, I18nConfig, I18nController, I18nTranslations, I18nLocale
 export * as locales from './conf/i18n';
 export type { AppThemeProviderConfig, BuiltInThemeId, CardTheme, ColorScale, GalleryTheme, ListCardTheme, MenuTheme, ModalTheme, ProviderSwitcherTheme, ToolbarTheme, TableTheme, Theme, ThemeConfig, ThemeController, ThemeMode, ThemeDefinition, ThemePresetConfig, } from './Theme';
 export { AuthButton, useAccessToken, getAccessToken } from './auth';
+export * from './components/auth';
 export { useGlobalVars, getGlobalVars, setGlobalVars, removeGlobalVars } from './Global';
 export type { DataProviderAdapter, FieldValue, RecordProps, RecordArray, DatabaseOptions, DBConfig, ReadOptions, WhereClause, OrderClause, Condition } from './providers/data/DataProvider';
 export type { OrderConfig, OrderDirection } from './libs/order';
@@ -50,7 +51,10 @@ export { FirebaseStorageProvider } from './providers/storage/firebase';
 export type { FirebaseStorageProviderConfig } from './providers/storage/firebase';
 export { SupabaseStorageProvider } from './providers/storage/supabase';
 export { useStorageProvider, StorageProvider } from './providers/storage/StorageProviderContext';
-export type { AuthProviderAdapter, AuthIntent, AuthSignInOptions, UserProfile } from './providers/auth/AuthProvider';
+export type { AuthProviderAdapter, AuthIntent, AuthSignInOptions, UserProfile, AuthSignUpInput, AuthSignUpResult, AuthLinkOptions, AuthEmailCodeOptions, AuthErrorReason, } from './providers/auth/AuthProvider';
+export { AuthFlowError } from './providers/auth/AuthProvider';
+export { MockAuthProvider } from './providers/auth/mock/MockAuthProvider';
+export type { MockAuthProviderOptions, MockAuthAccount } from './providers/auth/mock/MockAuthProvider';
 export { useAuthProvider, AuthProvider } from './providers/auth/AuthProviderContext';
 export { GoogleAuthProvider } from './providers/auth/google/GoogleAuthProvider';
 export type { FirebaseAuthProviderOptions, FirebaseSignInOptions } from './providers/auth/firebase/FirebaseAuthProvider';

package/dist/types/src/providers/auth/AuthProvider.d.ts

@@ -27,4 +27,55 @@ export interface AuthProviderAdapter extends ProviderConfigurable {
      * re-verifies the raw token itself rather than trusting client-read claims.
      */
     getIdTokenClaims?(forceRefresh?: boolean): Promise<Record<string, unknown> | null>;
+    /** Resolves once the session of the last visit is restored (signed in or not): `AuthGate` waits for it. */
+    whenReady?(): Promise<void>;
+    /** Creates an account with email and password; says whether the email must be confirmed first. */
+    signUp?(input: AuthSignUpInput): Promise<AuthSignUpResult>;
+    /** Sends the link to choose a new password. Never says whether the account exists. */
+    sendPasswordReset?(email: string, options?: AuthLinkOptions): Promise<void>;
+    /** Sets the new password with the code of the link (`oobCode`, `token_hash`, …). */
+    confirmPasswordReset?(code: string, newPassword: string): Promise<void>;
+    /** Sends again the link that confirms the email: of the signed-in user, or of `email` when the service allows it. */
+    sendEmailVerification?(options?: AuthLinkOptions & {
+        email?: string;
+    }): Promise<void>;
+    /** Confirms the email with the code of the link. */
+    verifyEmail?(code: string): Promise<void>;
+    /** Sends a one-time code by email to sign in. */
+    requestEmailCode?(email: string, options?: AuthEmailCodeOptions): Promise<void>;
+    /** Signs in with the code received by email. */
+    verifyEmailCode?(email: string, code: string): Promise<UserProfile | null>;
+}
+export interface AuthSignUpInput {
+    email: string;
+    password: string;
+    /** The full name, when the screen asks for it. */
+    name?: string;
+    /** Where the confirmation link brings back (the page that calls `verifyEmail`). */
+    redirectTo?: string;
+}
+export interface AuthSignUpResult {
+    user: UserProfile | null;
+    /** The account works once the email is confirmed: the screen says to check the inbox. */
+    needsEmailVerification: boolean;
+}
+export interface AuthLinkOptions {
+    /** The page the link of the email opens. */
+    redirectTo?: string;
+}
+export interface AuthEmailCodeOptions {
+    /** Creates the account when the email has none (default `false`: only existing accounts sign in). */
+    createUser?: boolean;
+}
+/** Why an access flow failed, in words a screen can translate (`authErrorMessage`). */
+export type AuthErrorReason = 'credentials' | 'emailInUse' | 'weakPassword' | 'invalidEmail' | 'tooManyRequests' | 'network' | 'invalidCode' | 'expiredLink' | 'disabled' | 'cancelled' | 'notSupported' | 'generic';
+/**
+ * An error of an access flow with its reason: a screen shows the translated message of the reason,
+ * never the raw text of the service. Throw it from your own functions (e.g. a code checked by your server).
+ */
+export declare class AuthFlowError extends Error {
+    readonly reason: AuthErrorReason;
+    constructor(reason: AuthErrorReason, message?: string, options?: {
+        cause?: unknown;
+    });
 }

package/dist/types/src/providers/auth/firebase/FirebaseAuthProvider.d.ts

@@ -1,4 +1,4 @@
-import type { AuthProviderAdapter, AuthSignInOptions, UserProfile } from '../AuthProvider';
+import type { AuthLinkOptions, AuthProviderAdapter, AuthSignInOptions, AuthSignUpInput, AuthSignUpResult, UserProfile } from '../AuthProvider';
 import type { ProviderConfigurationState } from '../../ProviderConfiguration';
 import type { FirebaseConfig } from '../../../Config';
 /**
@@ -46,4 +46,11 @@ export declare class FirebaseAuthProvider implements AuthProviderAdapter {
     onAuthChange(callback: (user: UserProfile | null) => void): () => void;
     getAccessToken(): Promise<string>;
     getIdTokenClaims(forceRefresh?: boolean): Promise<Record<string, unknown> | null>;
+    private requireAuth;
+    whenReady(): Promise<void>;
+    signUp({ email, password, name, redirectTo }: AuthSignUpInput): Promise<AuthSignUpResult>;
+    sendPasswordReset(email: string, options?: AuthLinkOptions): Promise<void>;
+    confirmPasswordReset(code: string, newPassword: string): Promise<void>;
+    sendEmailVerification(options?: AuthLinkOptions): Promise<void>;
+    verifyEmail(code: string): Promise<void>;
 }

package/dist/types/src/providers/auth/github/GitHubAuthProvider.d.ts

@@ -32,6 +32,8 @@ export declare class GitHubAuthProvider implements AuthProviderAdapter {
     refresh(): Promise<UserProfile | null>;
     /** Leaves for GitHub through the server, and comes back to the page it left from. */
     signIn(options?: AuthSignInOptions): Promise<UserProfile | null>;
+    /** Resolves once the server said who is signed in (CR-127): `AuthGate` waits for it. */
+    whenReady(): Promise<void>;
     signOut(): Promise<void>;
     onAuthChange(callback: (user: UserProfile | null) => void): () => void;
     private setUser;

package/dist/types/src/providers/auth/mock/MockAuthProvider.d.ts

@@ -0,0 +1,55 @@
+import type { AuthEmailCodeOptions, AuthProviderAdapter, AuthSignInOptions, AuthSignUpInput, AuthSignUpResult, UserProfile } from '../AuthProvider';
+import type { ProviderConfigurationState } from '../../ProviderConfiguration';
+/** An account of the mock: its password, and whether its email is confirmed. */
+export interface MockAuthAccount {
+    email: string;
+    password: string;
+    displayName?: string;
+    emailVerified?: boolean;
+}
+export interface MockAuthProviderOptions {
+    /**
+     * The accounts that exist. Omitted: any email and any password sign in (a demo); given: only these,
+     * and a wrong password fails as a real service would.
+     */
+    accounts?: MockAuthAccount[];
+    /** The code every email "receives" (default `123456`); any other code fails. */
+    code?: string;
+    /** Where the session is kept between reloads (default `sessionStorage`); `null` keeps it in memory only. */
+    storage?: Storage | null;
+    /** A pause before each answer, in ms, to see the loading states (default `400`). */
+    latency?: number;
+}
+/**
+ * An auth provider for demos and tests, with no service behind it (CR-127): every flow of the access
+ * screens works in memory. Never use it in production: it trusts any credential it is configured to.
+ */
+export declare class MockAuthProvider implements AuthProviderAdapter {
+    private user;
+    private readonly listeners;
+    private readonly accounts;
+    private readonly open;
+    private readonly code;
+    private readonly storage;
+    private readonly latency;
+    constructor(options?: MockAuthProviderOptions);
+    getConfigurationState(): ProviderConfigurationState;
+    isConfigured(): boolean;
+    getUser(): UserProfile | null;
+    isAuthenticated(): boolean;
+    whenReady(): Promise<void>;
+    onAuthChange(callback: (user: UserProfile | null) => void): () => void;
+    signIn(options?: AuthSignInOptions): Promise<UserProfile | null>;
+    signOut(): Promise<void>;
+    signUp({ email, password, name }: AuthSignUpInput): Promise<AuthSignUpResult>;
+    sendPasswordReset(): Promise<void>;
+    confirmPasswordReset(code: string, newPassword: string): Promise<void>;
+    sendEmailVerification(): Promise<void>;
+    verifyEmail(code: string): Promise<void>;
+    requestEmailCode(email: string, options?: AuthEmailCodeOptions): Promise<void>;
+    verifyEmailCode(email: string, code: string): Promise<UserProfile | null>;
+    private profile;
+    private setUser;
+    private restore;
+    private pause;
+}

package/dist/types/src/providers/auth/supabase/SupabaseAuthProvider.d.ts

@@ -1,4 +1,4 @@
-import type { AuthProviderAdapter, AuthSignInOptions, UserProfile } from '../AuthProvider';
+import type { AuthEmailCodeOptions, AuthLinkOptions, AuthProviderAdapter, AuthSignInOptions, AuthSignUpInput, AuthSignUpResult, UserProfile } from '../AuthProvider';
 import type { ProviderConfigurationState } from '../../ProviderConfiguration';
 export interface SupabaseAuthConfig {
     url: string;
@@ -45,4 +45,19 @@ export declare class SupabaseAuthProvider implements AuthProviderAdapter {
     signOut(): Promise<void>;
     onAuthChange(callback: (user: UserProfile | null) => void): () => void;
     getAccessToken(): Promise<string>;
+    whenReady(): Promise<void>;
+    signUp({ email, password, name, redirectTo }: AuthSignUpInput): Promise<AuthSignUpResult>;
+    sendPasswordReset(email: string, options?: AuthLinkOptions): Promise<void>;
+    /**
+     * `code` is the `token_hash` of the recovery email (template `{{ .TokenHash }}`); empty when the link
+     * already opened a recovery session (the default template), and then only the password is set.
+     */
+    confirmPasswordReset(code: string, newPassword: string): Promise<void>;
+    sendEmailVerification(options?: AuthLinkOptions & {
+        email?: string;
+    }): Promise<void>;
+    /** `code` is the `token_hash` of the confirmation email (template `{{ .TokenHash }}`). */
+    verifyEmail(code: string): Promise<void>;
+    requestEmailCode(email: string, options?: AuthEmailCodeOptions): Promise<void>;
+    verifyEmailCode(email: string, code: string): Promise<UserProfile | null>;
 }

package/dist/types/src/providers/manifest.d.ts

@@ -1,5 +1,6 @@
 import type { CredentialsAdapter } from './credentials/CredentialsProvider';
 import { MockDataProvider } from './data/mock';
+import { type MockAuthProviderOptions } from './auth/mock/MockAuthProvider';
 import type { AIProviderAdapter } from './ai/AIProvider';
 import type { DataProviderAdapter } from './data/DataProvider';
 import type { StorageProviderAdapter } from './storage/StorageProvider';
@@ -23,6 +24,8 @@ export type GoogleProviderConfig = GoogleOAuth2 & {
 export type SupabaseProviderConfig = SupabaseConfig;
 export type MockProviderConfig = {
     data?: ConstructorParameters<typeof MockDataProvider>[0];
+    /** Registers `mockAuth` (CR-127), a provider of access with no service behind it: demos and tests only. */
+    auth?: MockAuthProviderOptions | boolean;
 };
 export declare const FIREBASE_MANIFEST: DriverManifest<FirebaseConfig>;
 export declare const GOOGLE_MANIFEST: DriverManifest<GoogleProviderConfig>;
@@ -34,7 +37,7 @@ export declare const AI_MANIFEST: DriverManifest<AIConfig>;
 export declare const PROVIDER_MANIFESTS: Record<string, DriverManifest<any>>;
 export type DataDriverName = 'dbRealtime' | 'firestoreDb' | 'supabaseDb' | 'mock';
 export type StorageDriverName = 'firestorage' | 'supabaseStorage';
-export type AuthDriverName = 'googleAuth' | 'firebaseAuth' | 'dropboxAuth' | 'supabaseAuth' | 'githubAuth';
+export type AuthDriverName = 'googleAuth' | 'firebaseAuth' | 'dropboxAuth' | 'supabaseAuth' | 'githubAuth' | 'mockAuth';
 export type EmailDriverName = 'gmail';
 export type AIDriverName = 'openai' | 'openrouter' | 'opencode' | 'opencode-go' | 'openai-compatible' | 'deepseek' | 'gemini' | 'anthropic' | 'mistral' | 'cloudflare' | 'groq';
 export type CredentialsDriverName = 'googleServiceAccount';

package/llms-full.txt

@@ -98,6 +98,15 @@ The VS Code and Tokyo Night themes are compiled from the original VS Code theme
 
 `ColorScale` tokens: `background`, `foreground`, `canvas` (page floor behind cards and panels, `bg-canvas`; falls back to `background`), `card`, `popover`, `primary`, `secondary`, `muted`, `accent`, `destructive`, `success`, `warning`, `info` (each with its `*Foreground`), `border`, `input` (border of form fields), `ring`. A consumer bridging the tokens in its own `@theme inline` adds `--color-canvas: hsl(var(--rf-canvas, var(--rf-background)));`.
 
+**The frame of the app** (CR-126), as the title bar, side bar and status bar of the IDE: `header`, `headerForeground`, `headerBorder`, `sidebar`, `sidebarForeground`, `sidebarBorder`, `sidebarAccent` (the selected entry), `sidebarAccentForeground`, `footer`, `footerForeground`, `footerBorder`. The IDE themes carry them (VS Code Light+: gray title bar, blue status bar); a theme without them falls back to the base tokens (header and footer on `background`, sidebar on `card`, borders on `border`). Utilities: `bg-header text-header-foreground border-header-border`, `bg-sidebar …`, `bg-footer …`. `SideNav` draws itself with the sidebar tokens. The top bar and status bar of a layout:
+
+```tsx
+<header className="flex h-14 shrink-0 items-center gap-3 border-b border-header-border bg-header px-4 text-header-foreground">…</header>
+<footer className="shrink-0 border-t border-footer-border bg-footer px-4 py-1.5 text-xs text-footer-foreground">…</footer>
+```
+
+A border without a color class (`border`, `border-b`) is the theme's `border`, not the text color. The scaffold (`npx @llmnative/react create`) starts in `vscode-light-modern` and bridges all these tokens in `src/styles/globals.css`; a consumer scaffolded before adds the `--color-header…`/`--color-sidebar…`/`--color-footer…` lines of `src/globals.css` to its own `@theme inline`.
+
 ---
 
 ## Provider System
@@ -147,6 +156,27 @@ export const menuConfig: MenuConfig = {
 
 La home va dichiarata con `path: '/'`: senza quella voce, `/` mostra "Missing Page".
 
+### Voci di menu e rotte
+
+`SideNav menuKey="main"` e `Menu menuKey="main"` mostrano solo le **voci**: le route di quella chiave con `title`,
+senza `hidden: true`, senza parametri (`:token`) e senza `*`. Le altre sono rotte e basta (CR-126). Ogni voce
+mostrata ha `title` **e** `icon`. Una pagina raggiunta da un link (accesso, invito, impostazioni dal menu utente)
+sta in una chiave che nessun menu mostra, oppure ha `hidden: true`:
+
+```tsx
+export const menuConfig: MenuConfig = {
+  main: [
+    { path: '/', title: 'Dashboard', icon: 'layout-dashboard', page: HomePage },
+    { path: '/contacts', title: 'Contatti', icon: 'users', page: ContactsPage },
+    { path: '/settings', title: 'Impostazioni', icon: 'settings', page: SettingsPage, hidden: true },
+  ],
+  routes: [
+    { path: '/invite/:token', page: InvitePage, layout: AccessLayout },
+    { path: '*', page: NotFoundPage },
+  ],
+};
+```
+
 ### Hooks
 
 ```ts
@@ -218,6 +248,66 @@ await auth.signIn({ method: 'oauth', provider: 'github' })
 const token = await auth.getAccessToken('https://www.googleapis.com/auth/gmail.send')
 ```
 
+### Schermate di accesso e gate senza redirect (CR-127)
+
+Le schermate sono pronte: non scriverne a mano. Non conoscono il backend: ricevono le funzioni da
+chiamare (una promessa) e mostrano l'errore lanciato tradotto, mai il testo grezzo del servizio
+(`authErrorMessage`: codici di Firebase e Supabase, `AuthFlowError(reason)` per le funzioni tue).
+Testi nel namespace `access` delle 6 lingue. Ognuna ha `brand`, `toolbar`, `footer`, `bare` (solo il
+contenuto, in una modale), `errorMessage(error)`.
+
+| Componente | Cosa fa | Funzioni |
+|---|---|---|
+| `SignIn` | provider esterni, email + password, codice via email, in qualsiasi combinazione | `onPasswordSignIn({email,password})`, `onRequestCode(email)` + `onVerifyCode(email,code)`, `providers` + `onProviderSignIn(id)` |
+| `SignUp` | nome, email, password con i requisiti mentre si scrive, termini; poi "controlla la tua email" | `onSignUp({name,email,password})` → `{ needsEmailVerification }`, `onResendVerification(email)` |
+| `ForgotPassword` | email → stessa risposta con o senza account, nuovo invio dopo un'attesa | `onSendReset(email)` |
+| `ResetPassword` | nuova password dal link dell'email; link scaduto | `onResetPassword(password)`, `invalidLink` |
+| `VerifyEmail` | attivazione: con `code` verifica subito, senza aspetta la conferma | `onVerify(code)`, `onResend()`, `onContinue()` |
+| `VerifyCode` | codice di N cifre in caselle, inviato a codice completo | `onVerify(code)`, `onResend()`, `onChangeEmail()` |
+| `OneTimeCodeInput` | le caselle da sole (incolla, avanti/indietro, `one-time-code`) | `value`, `onChange`, `onComplete` |
+| `AuthLayout` | la cornice di una schermata (marchio, card, titolo, piè di pagina) | — |
+| `AuthGate` | la pagina solo con la sessione; senza, `fallback` al suo posto | `allow(user)`, `denied`, `loading` |
+
+```tsx
+import { App, SignIn, AuthFlowError } from '@llmnative/react';
+
+// Tutta l'app riservata: senza sessione ogni pagina mostra l'accesso al suo posto, l'indirizzo
+// resta quello aperto e dopo l'accesso compare la pagina. Nessuna pagina /login, nessun redirect.
+<App
+  menuConfig={{ main: [...], access: [{ path: '/invito/:token', page: InvitePage, public: true }] }}
+  authGate={{
+    fallback: <SignIn providers={['google', 'apple']} onProviderSignIn={enter}
+                      onRequestCode={sendCode} onVerifyCode={checkCode} appName="CRM" />,
+    allow: async (user) => (await isMember(user)),   // altrimenti "Accesso non consentito"
+  }}
+/>
+
+// Una funzione tua che rifiuta: la schermata dice "Il codice non è corretto o è scaduto."
+async function checkCode(email: string, code: string) {
+  const { token } = await callFunction('verifyLoginCode', { email, code }).catch(() => {
+    throw new AuthFlowError('invalidCode');
+  });
+  await signInWithCustomToken(token);
+}
+```
+
+Con gli adapter del framework `useAuthFlows(provider?, { verifyEmailPath, resetPasswordPath })` dà le
+funzioni pronte (`<SignIn {...flows.signIn} />`, `flows.signUp`, `flows.forgotPassword`,
+`flows.resetPassword(linkCode())`, `flows.verifyEmail`). Metodi opzionali di `AuthProviderAdapter`:
+
+| Metodo | Firebase | Supabase | `mockAuth` |
+|---|---|---|---|
+| `whenReady` (il gate aspetta la sessione) | ✅ | ✅ | ✅ (anche `githubAuth`) |
+| `signUp`, `sendPasswordReset`, `confirmPasswordReset` | ✅ | ✅ | ✅ |
+| `sendEmailVerification`, `verifyEmail` | ✅ | ✅ | ✅ |
+| `requestEmailCode`, `verifyEmailCode` | — (serve una funzione tua) | ✅ | ✅ |
+
+`useAuthSession(provider?)` dà `{ user, ready, signOut }`. `linkCode()` legge il codice del link
+(`oobCode`, `token_hash`, `code`). `mockAuth` (`providers.mock.auth: true`) è solo per demo e test:
+qualsiasi email e password, codice `123456`; con `accounts` rifiuta le credenziali sbagliate.
+Link delle email: in Firebase imposta l'URL di azione sulle tue pagine (`/reset-password`,
+`/verify-email`); in Supabase usa `{{ .TokenHash }}` nei template delle email.
+
 ### CredentialsAdapter (Google Service Account)
 ```tsx
 // Chiama Google APIs lato browser senza Node.js
@@ -1436,6 +1526,7 @@ src/
   conf/
     app.ts           ← providers config letta da .env (VITE_PROVIDER, VITE_AI_PROVIDER...)
     menu.ts          ← MenuConfig con path, title, icon, page (layout opzionale: c'è LayoutDefault)
+    access.tsx       ← rotte pubbliche delle pagine di accesso (CR-127)
   data/
     mockData.ts      ← dati fake per MockDataProvider
   layouts/
@@ -1444,6 +1535,7 @@ src/
     Header.tsx / Sidebar.tsx / PageHeader.tsx / Footer.tsx   ← solo componenti pubblici (SideNav, AuthButton, ActionButton, Brand, Breadcrumbs)
   pages/
     home/HomePage.tsx
+    access/          ← SignInPage (il fallback del gate), SignUp, ForgotPassword, ResetPassword, VerifyEmail
     [altre pagine dal template scelto]
   styles/
     globals.css      ← @import '@llmnative/react/dist/index.css' + Tailwind override
@@ -1461,11 +1553,12 @@ const env = import.meta.env
 export const providers: AppProvidersConfig = {
   mock: { data: mockData },
   ai: { openaiApiKey: env.VITE_OPENAI_API_KEY ?? '' },  // AI dentro providers, non prop <App>
-  services: { data: 'mock', auth: 'googleAuth' },
+  mock: { data: mockData, auth: true },               // mockAuth: accesso di prova
+  services: { data: 'mock', auth: 'mockAuth' },
 }
 ```
 
-Driver per `VITE_PROVIDER`: `firebase` → `firestoreDb` + `firestorage` + `firebaseAuth`; `supabase` → `supabaseDb` + `supabaseStorage` + `supabaseAuth`; `mock` → `mock` + `googleAuth`. `index.tsx` passa `LayoutDefault={Default}` ad `<App>`.
+Driver per `VITE_PROVIDER`: `firebase` → `firestoreDb` + `firestorage` + `firebaseAuth`; `supabase` → `supabaseDb` + `supabaseStorage` + `supabaseAuth`; `mock` → `mock` + `mockAuth`. `index.tsx` passa `LayoutDefault={Default}`, le traduzioni del framework (`translations: { ...locales }`) e `authGate={{ fallback: <SignInPage /> }}`: senza sessione ogni pagina mostra l'accesso al suo posto. Le pagine di accesso (`pages/access/`: SignInPage, SignUpPage, ForgotPasswordPage, ResetPasswordPage, VerifyEmailPage) e le loro rotte pubbliche (`conf/access.tsx`) sono uguali per ogni template; per un'app aperta a tutti togli `authGate`.
 
 ---
 
@@ -1477,6 +1570,7 @@ Driver per `VITE_PROVIDER`: `firebase` → `firestoreDb` + `firestorage` + `fire
 | `inputType` o `Input.Number`/`Input.Email` non esistono | Il tipo HTML è la prop `type` | `<Input type="number">`, `<Input type="email">`, `<Input type="date">` |
 | `Menu context=` non esiste | La prop si chiama `menuKey` | `<Menu menuKey="main" />` |
 | `SignInButton` non esiste | Rinominato | `<AuthButton />` |
+| Pagina `/login` con redirect, form di accesso fatti a mano | Le schermate e il gate ci sono (CR-127) | `<App authGate={{ fallback: <SignIn … /> }}>`, rotte aperte con `public: true` |
 | `firebase: { config: ... }` errato | FirebaseConfig è flat | `firebase: { apiKey, authDomain, databaseURL, ... }` |
 | `google: { oAuth2: { clientId } }` errato | GoogleProviderConfig è flat | `google: { clientId, scope }` |
 | `children` su `Grid` | Grid non accetta children | Usa `form={<Fields />}` per il form inline |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llmnative/react",
-  "version": "2.0.1",
+  "version": "2.2.0",
   "description": "LLM-native React framework for deterministic UI generation. Data-driven by default, schema-driven optional. Ultra-low token consumption — built for AI agents, not just humans.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",